iOS 下多次调用支付宝一直支付第一笔订单的问题

• 问题：
  在 iOS Safari 环境下，在订单支付的时候选择支付宝，再取消支付，然后再去用支付宝支付别的订单，发现支付的是第一笔订单。

• 原有代码的核心逻辑：

  const div = document.createElement('divform');
  div.innerHTML = res.data.data;
  document.body.appendChild(div);
  document.forms[0].submit();
  

• 后端返回的是一个 form 表单，通过提交该表单跳转到支付宝进行唤醒支付。

• 在 Android 环境下正常，在 iOS 平台实测，提交表单跳转到支付宝选择返回后，会复用原来的页面，而不是重新加载，这时候再次调用支付宝支付就会重走上面的逻辑。

• 此时 document.forms​ 获取表单会获取到 n​ 个， 不过索引一直取的是 0，提交的表单还是原本订单的表单。

• 修复后的代码：

  const div = document.createElement('divform');
  div.innerHTML = res.data.data;
  document.body.appendChild(div);
  let lastFormIndex = document.forms.length - 1;
  document.forms[lastFormIndex].submit();
  

• 这样修复后的一个小问题是在用 vConsole​ 进行调试的时候会发生冲突，因为 vConsole​ 在页面的最底部插入的元素有两个 form 表单。这样获取到的最后一个 form 表单其实是 vConsole​ 的表单。

• 现有的业务逻辑没有 form 表单，可以这么处理，简单好使。
  不然只能精细处理了，核心思想都一样：获取到最后一个插入的那个表单，提交它。