web-dev-qa-db-ja.com

AMPアクセス制御でソースの発信元ヘッダーを許可する問題

以下のエラーを解決するにはどうすればよいですか。

リソースの読み込みに失敗しました：サーバーは500（内部サーバーエラー）のステータスで応答しましたcdn.ampproject.org/v0.js:68応答にはAMP-Access-Control-Allow-Source-OriginヘッダーYd @ cdn.ampprojectが含まれている必要があります.org/v0.js：68 cdn.ampproject.org/v0.js:68フォームの送信に失敗しました：エラー：応答にはAMP-Access-Control-Allow-Source-Originヘッダーが含まれている必要があります報告

CORSのAMP GitHubページ のすべての指示に従いました。

以下は、サーバーサイドのmy PHPコードのスクリーンショットで、ブラウザーのコンソールにエラーがあります。

enter image description here

phpcorsamp-html
6
Asim Khan

次のコードでお試しください

if(!empty($_POST)){
        $domain_url = (isset($_SERVER['HTTPS']) ? "https" : "http") . "://$_SERVER[HTTP_Host]";
        header("Content-type: application/json");
        header("Access-Control-Allow-Credentials: true");
        header("Access-Control-Allow-Origin: ". str_replace('.', '-','https://example.com') .".cdn.ampproject.org");
        header("AMP-Access-Control-Allow-Source-Origin: " . $domain_url);
        header("Access-Control-Expose-Headers: AMP-Access-Control-Allow-Source-Origin");
        header("AMP-Redirect-To: https://example.com/thankyou.amp.html");
        header("Access-Control-Expose-Headers: AMP-Redirect-To, AMP-Access-Control-Allow-Source-Origin"); 
        echo json_encode(array('successmsg'=>'data post'));
        exit;
}

ドメインURLがhttpsであることを確認してください

https://example.com/ を目的のURLに置き換えます

8
Bachcha Singh

OPはPHPを使用していますが、JavaScriptの覗き見のためにここに投稿しています。

node expressサーバーの場合、ミドルウェアを提供する amp-toolbox-cors を使用できます。

const express = require('express');
const ampCors = require('amp-toolbox-cors');

const app = express();

// That's it!
app.use(ampCors());
...

デフォルトでは、AMP CORSミドルウェアは https://cdn.ampproject.org/caches.json にリストされているAMPキャッシュからのリクエストのみを許可します（bing-amp.comを追加）。

他のすべてのオリジンは403応答を受け取ります。

したがって、localhostまたは開発者向けのテストの場合、おそらく以下も追加する必要があります。

app.use(ampCors({
  verifyOrigin: false
}));

さらに詳しく知りたい方のために、 AMP CORS に準拠する方法に関する公式ドキュメントへのリンクを示します。

1
Truchainz