AMP 表单始终显示提交错误,即使响应代码为 200

AMP Form always showing submit-error, even on response code 200

我正在使用 AMP 表单将数据发送到我的 Golang 服务器。即使我跳过所有已发送数据的处理,只是按照 AMP 表单参考中所述使用代码 200 编写响应,我仍然会看到提交错误模板。

这是我的表格(我跳过了字段,因为它太长了)

<form action-xhr="/contactus" method="POST" class="contactForm" target="_top" custom-validation-reporting="show-all-on-submit" id="contactForm">
    <fieldset>
        <!-- divs with input and submit button -->
    </fieldset>
    <div submit-success>
        <template type="amp-mustache">
            Success! 
        </template>
    </div>
    <div submit-error>
        <template type="amp-mustache">
            Error! 
        </template>
    </div>
</form>

这是服务器响应的示例:

HTTP/1.1 200 OK
Content-Encoding: gzip
Vary: Accept-Encoding
Date: Sun, 23 Sep 2018 21:48:15 GMT
Content-Length: 23
Content-Type: application/x-gzip

会不会是服务器端的问题? 我想不通...非常感谢任何想法

我觉得很尴尬。 经过几天的思考并回到这个问题上,当我最终决定 post 一个问题时,一个想法在我做完之后突然出现了......

问题出在 header Content-type。必须设置为 JSON:

Content-type: application/json

确保您实施了 AMP CORS headers。

参考:https://amp.dev/documentation/guides-and-tutorials/learn/amp-caches-and-cors/amp-cors-requests?referrer=ampproject.org

如果请求是针对您自己的来源(您的域而不是 amp 缓存服务器),那么您可以设置以下 headers-

if (req.headers['amp-same-origin'] === 'true') {
    origin = req.query.__amp_source_origin;
    sourceOrigin = origin;
}

res.set({
    'Access-Control-Allow-Origin': origin,
    'AMP-Access-Control-Allow-Source-Origin': sourceOrigin,
    'Access-Control-Allow-Source-Origin': 'AMP-Access-Control-Allow-Source-Origin',
    'Access-Control-Expose-Headers': 'Access-Control-Allow-Origin' + ', AMP-Access-Control-Allow-Source-Origin' + ', Access-Control-Allow-Source-Origin'
});