クロスドメインCORSリクエストを試行している簡単なPHPスクリプトがあります。
<?php
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Headers: *");
...
それでも、私はまだエラーを受け取ります:
要求ヘッダーフィールド
X-Requested-With
は、Access-Control-Allow-Headers
では許可されていません
不足しているものはありますか?
Access-Control-Allow-Headers
は、受け入れられる値として*
を許可しません。Mozillaドキュメント here を参照してください。
アスタリスクの代わりに、受け入れられたヘッダーを送信する必要があります(エラーが示すように最初のX-Requested-With
)。
CORSリクエストを適切に処理することは少し複雑です。これは、より完全に(そして適切に)応答する関数です。
/**
* An example CORS-compliant method. It will allow any GET, POST, or OPTIONS requests from any
* Origin.
*
* In a production environment, you probably want to be more restrictive, but this gives you
* the general idea of what is involved. For the nitty-gritty low-down, read:
*
* - https://developer.mozilla.org/en/HTTP_access_control
* - http://www.w3.org/TR/cors/
*
*/
function cors() {
// Allow from any Origin
if (isset($_SERVER['HTTP_Origin'])) {
// Decide if the Origin in $_SERVER['HTTP_Origin'] is one
// you want to allow, and if so:
header("Access-Control-Allow-Origin: {$_SERVER['HTTP_Origin']}");
header('Access-Control-Allow-Credentials: true');
header('Access-Control-Max-Age: 86400'); // cache for 1 day
}
// Access-Control headers are received during OPTIONS requests
if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']))
// may also be using PUT, PATCH, HEAD etc
header("Access-Control-Allow-Methods: GET, POST, OPTIONS");
if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
header("Access-Control-Allow-Headers: {$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}");
exit(0);
}
echo "You have CORS!";
}
同じエラーが発生し、バックエンドスクリプトで次のPHPを使用して修正しました。
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET, POST');
header("Access-Control-Allow-Headers: X-Requested-With");
インターネット全体の多くの説明では、Access-Control-Allow-Origin
を指定するだけでは不十分であることに言及していません。ここに私のために働く完全な例があります:
<?php
if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') {
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: POST, GET, DELETE, PUT, PATCH, OPTIONS');
header('Access-Control-Allow-Headers: token, Content-Type');
header('Access-Control-Max-Age: 1728000');
header('Content-Length: 0');
header('Content-Type: text/plain');
die();
}
header('Access-Control-Allow-Origin: *');
header('Content-Type: application/json');
$ret = [
'result' => 'OK',
];
print json_encode($ret);
私は単にこの修正(angularjs + phpバックエンド)で動作するドロップゾーンと他のプラグインを取得することができました
header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Credentials: true");
header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');
header('Access-Control-Max-Age: 1000');
header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token , Authorization');
これをupload.phpまたはリクエストの送信先に追加します(たとえば、upload.htmlがあり、upload.phpにファイルを添付する必要がある場合は、これらの4行をコピーして貼り付けます)。また、chrome/mozillaでCORSプラグイン/アドオンを使用している場合は、CORSを有効にするために、複数回切り替える必要があります。
PHPからCORSサービスを作成する場合、リクエストを処理するファイルの最初のステップとしてこのコードを使用できます。
// Allow from any Origin
if(isset($_SERVER["HTTP_Origin"]))
{
// You can decide if the Origin in $_SERVER['HTTP_Origin'] is something you want to allow, or as we do here, just allow all
header("Access-Control-Allow-Origin: {$_SERVER['HTTP_Origin']}");
}
else
{
//No HTTP_Origin set, so we allow any. You can disallow if needed here
header("Access-Control-Allow-Origin: *");
}
header("Access-Control-Allow-Credentials: true");
header("Access-Control-Max-Age: 600"); // cache for 10 minutes
if($_SERVER["REQUEST_METHOD"] == "OPTIONS")
{
if (isset($_SERVER["HTTP_ACCESS_CONTROL_REQUEST_METHOD"]))
header("Access-Control-Allow-Methods: POST, GET, OPTIONS, DELETE, PUT"); //Make sure you remove those you do not want to support
if (isset($_SERVER["HTTP_ACCESS_CONTROL_REQUEST_HEADERS"]))
header("Access-Control-Allow-Headers: {$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}");
//Just exit with 200 OK with the above headers for OPTIONS method
exit(0);
}
//From here, handle the request as it is ok
CORSの機能を正しく理解していなければ、CORSは頭痛の種になります。私はPHPでそれらを使用し、問題なく動作します。 ここを参照
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Credentials: true");
header("Access-Control-Max-Age: 1000");
header("Access-Control-Allow-Headers: X-Requested-With, Content-Type, Origin, Cache-Control, Pragma, Authorization, Accept, Accept-Encoding");
header("Access-Control-Allow-Methods: PUT, POST, GET, OPTIONS, DELETE");
クライアント側としてangular 4を使用し、サーバー側としてPHPを使用すると、この多くのコードが機能します。
header( "Access-Control-Allow-Origin:*");
これは動作するはずです
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Headers: X-Requested-With, Content-Type, Origin, Cache-Control, Pragma, Authorization, Accept, Accept-Encoding");