サーバー PHP

ajaxを使うとAccess-Control-Allow-Originエラーが発生

少し前までは通常に使えてたajaxが急に動かなくなりました。

エラー内容を見てみると

XMLHttpRequest cannot load http://kaede.jp/***.php Origin https://kaede.jp is not allowed by Access-Control-Allow-Origin.

というエラーが発生していました。

Access-Control-Allow-OriginエラーはAjaxにて別ドメイン(クロスドメイン)のデータを取得する際、別ドメインのヘッダー情報にAccess-Control-Allow-Origin情報がないと実行できないようになったようです。

別ドメインならまだしも同一ドメインでもSSLとそうじゃない場合だとエラーになるようです。

httpsのサイトからhttpsのサイト情報を取得するとエラーになるとは……

解決策としては二つ

①phpにAccess-Control-Allow-Originを埋め込む

[php]
header('Access-Control-Allow-Origin:https://kaede.jp');//特定ドメインのみ許可する場合
header('Access-Control-Allow-Origin:*');//全ドメイン許可する場合
[/php]

②サイト全体にAccess-Control-Allow-Originを埋め込む

nginxの場合

[text]
server{
#特定ドメインのみ許可する場合
add_header Access-Control-Allow-Origin https://kaede.jp;
#全ドメインを許可する場合
add_header Access-Control-Allow-Origin *;



[/text]

apacheの場合

[text]
<Virtualhost :80>



<Directory>
#特定ドメインのみ許可する場合
Header set Access-Control-Allow-Origin "https://kaede.jp"
#全ドメインを許可する場合
Header set Access-Control-Allow-Origin "
"



[/text]

これでエラー発生することなく取得することができると思います。

相手のサーバーにAccess-Control-Allow-Originヘッダー情報がない場合はphp等を噛ましてローカルで読み込ますようにしないといけないですね。

-サーバー, PHP
-, , ,

© 2020 かえでBlog