skillup

技術ブログ

JavaScript サーバー・ネットワーク

クロスドメインがらみのajax

投稿日:2019年2月23日 更新日:

ajaxで別ドメインに対して、プログラムを実行したい時に注意すべきことなどを。

ログ、レスポンスヘッダをとにかく追う

アクセス先のログやブラウザのレンポンスヘッダーを注意深くみてどういう結果が帰ってきているのかをしっかり追うようにしましょう。その上で下記のような対策が必要になってきます。

特定ドメインからの許可

ajaxから直で他サーバーにアクセスをする場合ですが、下記のようなエラーメッセージが出て弾かれる場合が多いかと思います。

通常ですとクロスドメインからのリクエストが許可されていないことが多いため、弾かれます。

この場合、APIを受けとる側での.htaccessなどに下記のような設定を書いておけば許可することができます。

アスタリスクは全許可ですが、POST,GETなどのメソッド単位でのコントールやHearderでのControlもできるでしょう。

*ただしmod_headerがインストールされていることが前提のようです。

フレームワーク側での認証ロジック(フレームワークによる)

上記のような対策をしてもエラーが返ってきてしまうということは多いかと思います。その場合、302エラーの場合、フレームワークの認証ロジックを疑ってみましょう。

私の場合、Laravelだったのですが、Routeでコントロールできる通常の認証以外にも、認証をコントールしている場合があるので、その部分を調べてみましょう。

CSRF対策(フレームワークによる)

Laravelの場合、上記の対策がディフォルトで組み込まれているので、通常認証をクリアできても500エラーが返ってきます。その場合、MiddleWare内でIP制限などをすると良いと思います。

一例として下記のような書き方ができます。

500エラー対策

実際のAPIまで処理が飛んでいればあと一歩かと思いますが、500エラーで返ってきてしまう場合はプログラムのどこかで落ちているため、とにかくこまめにログを追うしかないと思います。

API時の実装時に注意しておきましょう。

ajax側のHTTPヘッダ

ajax側のHTTPリクエストが適切でない場合、配列を送っているのに、内容がからということがあります。その場合、ajaxのheadをapplication/jsonにするかJSON.stringifyでPOST内容を文字列化しましょう。

ちなみにブラウザでajaxを飛ばして直接アクセスするより、ローカルのPHPにajaxにアクセスをして、PHP側からサーバーを通してAPIにアクセスした方がテストも簡単で実行しやすいです。(CurlよりはGuzzleなどのライブラリを使いましょう。)

参考リンク

サーバサイドのCORS対応

XHR2でサブドメインのワイルドカードOriginに対してCORSを許可する設定、他。

Laravel5.5 で Cross Domain する

今時のPHP HTTPクライアントのGuzzleを使ってみた

 

-JavaScript, サーバー・ネットワーク
-,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

Dockerfile作成での気づきなど(php+webサーバー)

実務で、Dockerfileを色々いじっていたんのでそこで得た気づきなどを。 Contents1 基本的な構成の考え2 アプリに関して 基本的な構成の考え 以前はCentOSを入れてその中にphp、M …

no image

サーバー構築(ゼロからの準備編)

VPSのサーバーを入れるときにほぼ確実にインストールするパッケージなどを。 Contents0.1 update&言語表記0.2 基本ライブラリ0.3 sudoユーザーの設定0.4 apache0.5 …

no image

JSF+ajax

JSFでajaxを使うときにいろいろと調べたのでメモ。 やろうとしたことはWEB上で給与明細の計算をしたくて、プルダウンで月の変更したら自動的に経費が該当月に替わるというシステムです。 ajaxを使う …

no image

途中入力離脱防止処理 JavaScript

WordPressの入力画面なんかでは実装されていますが、途中で文字入力をしてページりだすをしようとするとブラウザのアラートがでます。これも一般のお問い合わせフォームなんかでも実装可能です。 この場合 …

no image

yumのリポジトリについて

CentOSでは様々なパッケージが用意されていますが、標準で使えるもの以外にもさまざまなリポジトリがあります。 Contents1 リポジトリ一覧2 有効、無効や指定してのインストールについて リポジ …

アーカイブ