我正在制作一封包含两种形式的动态电子邮件,第一种形式有一个按钮和一个带有预定义值(主干)的隐藏字段,该字段将发布到后端并发送特定用户的 OTP。第一个表单成功提交后,我取消隐藏第二个表单以接受已验证的 OTP,如果将 OTP 发布到后端,则该特定客户的积分将被兑换。问题是表单提交在操场上工作正常,但是当我将相同的 HTML 发送到 gmail 时,它包装了我的原始请求并且没有到达我的服务器。
这是我的 Html,
`<!doctype html>
<html amp4email data-css-strict>
<head>
<meta charset="utf-8">
<script async src="https://cdn.ampproject.org/v0.js"></script>
<script custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-0.1.js" async></script>
<!--<script custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js" async></script>-->
<script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>
<meta name="a" content="width=device-width">
<style amp4email-boilerplate>body{visibility:hidden}
</style>
</head>
<body>
<form method="post"
action-xhr="action"
on="submit-success:form2.show,form1.hide,AMP.setState({'otpReference': event.response.Data.OtpReference})" id="form1">
<input type=hidden value="wdDDiFCG" name="stem">
<input type="submit" value="Redeem Now!">
</form>
<form id="form2" method="post" action-xhr="action" hidden>
<input type=hidden value="wdDDiFCG" name="stem" >
<input type=hidden [value]="otpReference" name="otpReference" >
<fieldset>
<label>
<span>Please enter OTP:</span>
<input type="text"
name="otp"
required>
</label>
<input type="submit"
value="Submit & Redeem">
</fieldset>
<button on="tap:form1.show,form2.hide">Back</button>
</form>
</body>
</html>`
我在 Google Chrome 控制台中收到以下错误。
[amp-form] Failed to parse response JSON: SyntaxError: "undefined" is not valid JSON. [amp-form] Form submission failed: 404.
我在网上搜索了解决方案,但没有找到满意的解决方案。我不知道究竟是什么阻止了我的表单从 Gmail 发布。
我配置“CORS”设置如下:
<add name="Access-Control-Allow-Headers" value="Content-Type" /> <add name="Access-Control-Max-Age" value="600" /> <add name="Access-Control-Allow-Origin" value="https://mail.google.com" /> <add name="AMP-Access-Control-Allow-Source-Origin" value="https://mail.google.com/dynamic-email/relay/v2/index.html" /> <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" /> <add name="Access-Control-Expose-headers" value="AMP-Access-Control-Allow-Source-Origin" /> <add name="AMP-Email-Allow-Sender" value="[email protected]"/>
我还将 AMP-Access-Control-Allow-Source-Origin 值设置为“https://mail.google.com”。但它没有用。
Access-Control-Allow-Origin的值也设置为“*”,但还是不行