POST 到外部 URL（webhook）但重定向到不同的 URL答案

【问题标题】：POST to external URL (webhook) but redirect to different URLPOST 到外部 URL（webhook）但重定向到不同的 URL
【发布时间】：2017-03-03 03:35:40
【问题描述】：

在我的表单中，我将数据发布到一个外部 url，它是一个 webhook。在用户提交并将数据传递给 webhook 后，我想将用户重定向到确认页面。

我下面的代码有问题。当用户提交表单时，jQuery 确实将用户带到了确认页面，但表单数据不会触发 webhook（不会收集数据）。有人可以帮忙解决我哪里出错了吗？

这是我的代码：

HTML

<form action="https://externalurl.com/webhook" method="POST">
     <input id="email" name="email">
     <input id="firstname" name="firstname">
     <input id="lastname" name="lastname">
     <button type="submit">Submit</button>
</form>

jQuery

    $('form').submit(function() {
    $.ajax({
        type: 'POST',
        url: $(this).attr('action'),
        dataType: 'json',
        success: function(json) {
           window.location.href = "https://www.mypage.com/confirmation";
          }
    });
    return false;
});

提前致谢

【问题讨论】：

您是否发布到与包含表单的域相同的域？如果您违反同源政策 (developer.mozilla.org/en-US/docs/Web/Security/…)，您的 POST 将失败

标签： javascript jquery forms post get

【解决方案1】：

表单中有提交按钮吗？

【讨论】：

是的，很抱歉，我忘记将它包含在我的示例代码中，但它现在已更新。

【解决方案2】：

您没有向 webhook 发送任何数据。试试……

$('form').submit(function() {
$.ajax({
    type: 'POST',
    url: $(this).attr('action'),
    data: {
        "email": document.getElementById('email').value
        // get other fields
    },
    dataType: 'json',
    success: function(json) {
      }
});
return false;
});

或者，如果您的实际表单更大，那么有办法将整个表单的数据序列化为 json。

编辑：如果你想调试你的 ajax 调用，那么 chrome 开发者工具的网络选项卡会让你准确地看到你发送到服务器的内容，以及它的响应。

【讨论】：

【解决方案3】：

如果 web 与 webhook 不在同一个域中，则必须在 webhook 服务器中配置 CORS 策略或使用 jsonp 等替代方案。

【讨论】：