カテゴリー
Linux

AngularJS を使って PHP へ JSON データを POST する方法

追記。「ログインページを介さず Basic 認証」シリーズの投稿一覧です♪

  1. 【Nginx】Basic 認証をかける方法手順メモ | oki2a24
  2. cURL を使って Basic 認証が必要な PHP へ JSON データを POST する手順メモ | oki2a24
  3. AngularJS を使って PHP へ JSON データを POST する方法 | oki2a24
  4. AngularJS を使って Basic 認証が必要な PHP へ JSON データを POST できません>< | oki2a24
  5. AngularJS を使って Basic 認証が必要な PHP へ JSON データを POST するサンプルコード! | oki2a24

追記終わり!

AngularJS を使用してウェブブラウザのページでボタンを押すと、サーバへ JSON データを POST して PHP で受け取ってファイルに出力したい。

AngularJS を使用してウェブブラウザのページでボタンを押すと、サーバへ JSON データを POST して PHP で受け取ってファイルに出力してみようと試みました!

苦労しましたので、記録を残しますわ♪

ポイント

  • AngularJS で サーバに JSON をポストしたところエラーとなった。
    • フロント側では、Access-Control-Allow-Origin のエラーが発生していた。
    • サーバ側では method が POST ではなく、OPTIONS となっていた。
  • クロスドメイン問題が原因だった。
    • ちなみに、異なるドメインのデータにアクセスすることを、クロスドメインという。
  • フロント側、サーバ側の両方で対応する必要がある。
    • フロント側では、config で $httpProvider の Content-Type で x-www-form-urlencoded を設定する。
    • サーバ側では、header(‘Access-Control-Allow-Origin: *’); を設定してやる。

エラーが発生した AngularJS のコード抜粋