AMP 表单发出正确提交后仍显示错误提示

AMP 表单在提交后显示错误提示，即使服务器响应代码为 200。经过调查，发现问题在于服务器响应标头中缺少正确的 "content-type"。将 "content-type" 设置为 "application/json" 并确保实施 AMP CORS 标头可以解决此问题。

我正在使用 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

问题可能出在服务器端吗？ 我不明白......任何想法都非常感激

解决方案

我感到很尴尬。 经过几天的思考并回到这个问题，当我最终决定发布一个问题时，一个想法在我这样做之后突然出现......

问题出在标头 content-type 上。必须设置为 json：

content-type: application/json

确保您实现 amp cors 标头。

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

如果请求是针对您自己的来源（您的域而不是 amp 缓存服务器），那么您可以设置以下标头 -

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'
});

今天带大家了解了的相关知识，希望对你有所帮助；关于Golang的技术知识我们会一点点深入介绍，欢迎大家关注golang学习网公众号，一起学习编程~