我有一个页面,用于amp-list使用 JSON 文件动态列出产品。我的目录结构如下:*root*/amp/product-name/然后在该product-name目录中,我有一个index.html包含 AMP HTML 的目录,以及一个products.json包含我在页面上显示的产品数据的目录。如果我直接访问该页面,一切都会按预期工作:
https://example.com/amp/product-name/
当我从 ampproject.org CDN 访问时,问题就出现了。
这是实际页面,如果您访问控制台,您可以看到存在 CORS 错误。我该如何处理这个问题?文档并不清楚如何准确处理,只是一个非常模糊的概述,因此对于新手来说,这对我来说没有意义,我不能凭直觉知道如何做到这一点。我知道我需要一个某种类型的请求处理程序,我通过从他们在文档中链接到的 AMP 自己的 app.js 复制代码来部分制作该请求处理程序。在amp-list元素中,我之前将 src 直接指向 JSON 文件,但现在我发现我需要指向一个处理程序(如 JS 文件),然后让处理程序设置请求标头,然后输出正确的 JSON 。
这是我为请求处理程序准备的内容:
/**
* @param {string} url
* @param {string} param
* @param {*} value
* @return {string}
*/
function addQueryParam(url, param, value) {
const paramValue = encodeURIComponent(param) + '=' + encodeURIComponent(value);
if (!url.includes('?')) {
url += '?' + paramValue;
} else { …Run Code Online (Sandbox Code Playgroud)