Question

在我的网站上，我想将POST数据发送到两个不同的URL，并稍微修改每个URL的数据。一个是输液软，另一个是我的另一个网站上的API。

注意＃1：我将使用示例文本将URL替换为我的个人API。

注意＃2：我必须设置内容类型，还是在发送表单数据之前还缺少其他标题/信息？如果是这样，为什么这一切都会从桌面上完美运行？这段代码一直都在jQuery中，但是效果不好，所以我试着在Vanilla JS中重写整个内容，只是为了解决依赖问题的想法。

注意＃3： No 'Access-Control-Allow-Origin' header is present on the requested resource.
^这适用于Infusion Soft和我的个人API。我假设，如果它甚至没有在Infusion Soft上设置它不是问题，特别是考虑到一切都在桌面上完美运行。

注意＃4：每个和所有选择器都匹配一个元素。没有拼写错误，再次，这在桌面上运行时达到100％ Windows 10 Home
Chrome Version 61.0.3163.100 (Official Build) (64-bit)

注意＃5：表单上的操作转到Infusion Soft。我停止默认发生，所以我可以使用数据，然后将其发送到我们的数据库。完成后我再次使用数据，然后让infusion Soft运行action属性 - 所有你在代码中都可以看到。

我的代码如下：

<script>

var form = document.getElementById('RequestADemo');
document.getElementById('submitButton').addEventListener('click', processData);

function processData(e){

  e.preventDefault();

  var phone = document.getElementById('inf_field_Phone1').value;

  var formData = new FormData(form);
  formData.append('action', 'insertLead');
  formData.append('inf_field_Phone', phone);

  var oReq = new XMLHttpRequest();
  oReq.open('POST', 'http://example.com/api.php', true);
  oReq.send(formData);

  var fullName = document.getElementById('inf_field_FirstName').value;
  var fullNameSplitted = fullName.split(' ');

  var firstName = fullNameSplitted[0];

  if (fullNameSplitted.length > 1) {
    var lastName = fullNameSplitted[1];
  }

  var formData2 = new FormData(form);
  formData2.delete('inf_field_FirstName');
  formData2.append('inf_field_FirstName', firstName);
  formData2.append('inf_field_LastName', lastName);

  var oReq2 = new XMLHttpRequest();
  oReq2.open('POST', form.getAttribute('action'), true);
  oReq2.send(formData2);

  form.reset();

  alert('Thanks! We will contact you shortly. Check your email for a confirmation.');

}

</script>

此代码在桌面上运行良好，并提交给我的个人API和Infusion Soft。在我们的API中，我们负责分割名字和姓氏，并将它们插入数据库中的单独字段。但是，对于Infusion Soft，我们需要在发送数据之前执行此操作，因为我们无法控制其API。这一切都按计划在桌面上运行。

在Safari中的iPhone7上，此代码按计划插入到我的个人数据库中，但甚至不能用于Infusion Soft。我用console.log();测试了一些东西并找到了

var FormData2 = new FormData(form);

是移动设备上断的行。

此行之前的所有内容都在移动设备上运行完美。

有什么想法吗？我真的很感激！

**更新：**

以下是我发送给Infusion Soft的第二个请求的新变量和代码：

  var email = document.getElementById('inf_field_Email').value;
  var company = document.getElementById('inf_field_Company').value;
  var phone = document.getElementById('inf_field_Phone1').value;

  var fullName = document.getElementById('inf_field_FirstName').value;
  var fullNameSplitted = fullName.split(' ');

  var firstName = fullNameSplitted[0];

  if (fullNameSplitted.length > 1) {
    var lastName = fullNameSplitted[1];
  }

  var formData2 = new FormData();
  formData2.append('inf_field_FirstName', firstName);
  formData2.append('inf_field_LastName', lastName);
  formData2.append('inf_field_Email', email);
  formData2.append('inf_field_Company', company);
  formData2.append('inf_field_Phone1', phone);

  var oReq2 = new XMLHttpRequest();
  oReq2.open('POST', form.getAttribute('action'), true);
  oReq2.send(formData2);

但是，这不适用于桌面或移动设备！ :( 然而，最终的警报确认即将到来。

Answer 1

<强>解决

作为评论中提到的@Barmar，我必须创建空的FormData并手动附加所有值。我这样做了，起初它没有用。我想到的是我将所有值想要发送到Infusion Soft，但解决方法是发送所有隐藏字段Infusion Soft为您提供了无格式的HTML表单及其值。

我只需要在表单中添加其他3个隐藏字段：

formData2.append('inf_form_xid', xid);
formData2.append('inf_form_name', isFormName);
formData2.append('infusionsoft_version', isVersion);

请注意，我已经将变量设置为此代码块之前的值。 Infusion Soft除非接收到这些值，否则不得接受数据，这是完全合理的。

Ajax将POST发送到两个URL

1 个答案: