为什么 CORS 发布请求在一种情况下有效，但在另一种情况下无效答案

【问题标题】：Why does CORS post request, works in one case but not another为什么 CORS 发布请求在一种情况下有效，但在另一种情况下无效
【发布时间】：2018-10-17 20:13:46
【问题描述】：

我正在尝试将电子邮件添加到 mailchimp 帐户，但我也在尝试在收集电子邮件后使用 javascript 做一些其他事情，这是我的 javascript：

function addEmail(){  
  var request = new XMLHttpRequest();
  request.open('POST', 'https://EXTERNAL_URL', true);
  var data = document.getElementById("mce-EMAIL").value;
  request.send("EMAIL=" + data);
}

我得到了标准 No 'Access-Control-Allow-Origin' header is present on the requested resource。'错误

但是当我通过 HTML 表单提交时，我没有收到错误，下面是我的 HTML：

<form action="https://EXTERNAL_URL" method="POST" id="mc-embedded-subscribe-form" 
name="mc-embedded-subscribe-form">
  <div id="mc_embed_signup_scroll" class="info-title-small">
    <input type="email" name="EMAIL" id="mce-EMAIL">
    <div style="position: absolute; left: -5000px;">
      <input type="text" name="b_77582e128704b86e538075b23_47bb2d7f84" tabindex="-1">
    </div>
    <div class="clear">
      <input type="submit" value="add me" name="subscribe" id="mc-embedded-subscribe">
    </div>
  </div>
</form>

发生了什么事？

【问题讨论】：

使用服务器端代理将数据发布到远程服务器（mailchimp）。然后您会收到回复，而不必提交表单。然后，您的 ajax 将发布到您的代理
表单不会像 ajax 那样向脚本返回值，这就是导致违反 SOP 的原因。任何表单都可以在任何地方提交，但您只能通过 ajax 从您的网站或 w/cors 加载数据
在stackoverflow.com/questions/48260752/…查看相关答案。

标签： javascript html cors

【解决方案1】：

same-origin policy 主要关注 JavaScript（或其他浏览器端编程语言）读取服务器对客户端请求的响应。您的表单提交不违反同源政策，也不会因为不处理服务器响应而被阻止。

根据MDN：

通常允许跨域写入。例如链接、重定向和表单提交。某些很少使用的 HTTP 请求需要预检。

通常允许跨域嵌入。

跨域读取通常不允许，但读取访问权限通常会因嵌入而泄露。例如，您可以读取嵌入图像的宽度和高度、嵌入脚本的操作或嵌入资源的可用性。

【讨论】：