首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >使用嵌入式google表单绕过CORS

使用嵌入式google表单绕过CORS
EN

Stack Overflow用户
提问于 2017-05-17 05:55:05
回答 1查看 3.8K关注 0票数 8

我正在尝试通过嵌入式表单将表单数据发送到google。

我发现这个post似乎可以回答我的问题,但是我得到了CORS错误。有没有办法解决这个问题?

其他帖子似乎说CORS不是问题,但我得到了错误。

下面是我的代码:

-JS-

代码语言:javascript
复制
function ajax_post() {
  var field1 = $('#email').val();

  $.ajax({
      url: "https://docs.google.com/forms/d/e/xxxxxxxxxxxxxxxxxxxxxx/formResponse",
      data: {"entry.xxxxxxxxxx": field1},
      type: "POST",
      dataType: "xml",
      statusCode: {
          0: function() {
          //Success message
          },
          200: function() {
          //Success Message
          }
      }
  });
}

-HTML-

代码语言:javascript
复制
<form id="emailForm" target="_self" onsubmit="" action="javascript: ajax_post()">
    <input id="email" type="text" autocomplete="off" tabindex="0" name="entry.xxxxxxxxxx" required>
    <button id="send" type="submit">Submit</button>
</form>
EN

回答 1

Stack Overflow用户

发布于 2020-04-22 15:58:15

我发现,实际上只使用隐藏的iframe作为目标来发布表单,并在提交响应时捕获该iframe重新加载会更容易。

例如,如果这是您的表单:

代码语言:javascript
复制
<form id="my-form" target="my-response-iframe" action="https://docs.google.com/forms/u/1/d/e/<YOUR-ID>/formResponse" method="post">
  <input type="text" name="entry.12345678" value="" required>
  <input type="submit">
</form>

然后在同一页上包含一个iframe,其id和名称与您在表单中输入的目标相同:

代码语言:javascript
复制
<iframe id="my-response-iframe" name="my-response-iframe"></iframe>

当表单提交时,它应该重新加载该iframe,并显示“您的响应已被记录”。来自谷歌的页面。我们可以用JavaScript捕捉重新加载,所以在你的表单和iframe后面加上这个:

代码语言:javascript
复制
<script type="text/javascript">
   // set the target on the form to point to a hidden iframe
   // some browsers need the target set via JavaScript, no idea why...
   document.getElementById('my-form').target = 'my-response-iframe';
   // detect when the iframe reloads
   var iframe = document.getElementById('my-response-iframe');
   if (iframe) {
     iframe.onload = function () {
       // now you can do stuff, such as displaying a message or redirecting to a new page.
     }
   }
</script>

你不能检查响应是否被正确提交,因为你不能检查跨源iframe的内容(这将是一个巨大的安全风险),所以只要假设如果这个iframe重新加载,响应是ok的。

您可以使用以下CSS隐藏iframe:

代码语言:javascript
复制
visibility: hidden
height: 1px;

如果你问我,我觉得干净多了,没有控制台错误或失败的请求。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/44012261

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档