javascript - post API调用和使用post方法提交表单有什么区别？

Question

我想调用支付网关，支付网关是通过表单提交调用的，方法为post。我可以使用 Node js HTTP 模块的 post API 调用来调用同一个网关吗？我很困惑，因为如果我使用 post API 调用网关，它不会重定向到新页面，而表单有 method 和 action 可以通过 post 调用重定向到新页面。

Answer 1

有多种方法可以从浏览器提交表单:

1. HTML 表单，提交按钮，用户按下提交按钮，不涉及 JavaScript。
2. 页面中的 HTML 表单，Javascript 获取表单的 DOM 元素并调用表单对象上的 .submit() 方法。
3. 使用 XMLHttpRequest 接口(interface)和 POST 方法进行 Ajax 调用，并手动发送适当的表单数据。
4. 使用 POST 方法进行 Ajax Fetch 调用并手动发送适当的表单数据。

使用#1或#2，浏览器发送表单，浏览器将注意重定向，并将在浏览器中显示表单响应(无论是否重定向)。

使用 #3 和 #4，表单通过 Javascript 发送，响应返回到您的 Javascript。 #3 不处理重定向。 #4 有一个处理重定向的选项。以下是有关上述每个选项的更多信息。 #3 和 #4 不会影响浏览器显示 根本不会受到影响，除非您编写自己的 Javascript 来处理请求并影响浏览器显示(通过插入内容或将 window.location 设置为新 URL。

<小时/>

以下是有关上述方案的更多信息:

使用 XMLHttpRequest 的编程 Ajax 调用不会以任何方式处理重定向或来自 Ajax 调用的响应。他们只是将该响应返回给您的 Javascript。请记住，重定向只是您可以从 Ajax 调用返回的一种特定类型的响应。这与浏览器提交表单 POST 不同。

使用 fetch() 接口(interface)进行编程 Ajax 调用提供了自动跟踪重定向的选项。请参阅重定向选项here 。但是，即使在这种情况下，fetch() 接口(interface)所做的只是获取重定向 URL 的内容。它不会导致浏览器页面发生更改。为此，您必须编写自己的 Javascript 代码才能查看 3xx 重定向响应，然后将 window.location 设置为新的重定向 URL。或者，您必须让界面自动遵循重定向，然后对新的重定向内容执行某些操作，并将其返回到您的 Javascript。

这些编程请求与让浏览器为您提交表单不同。在浏览器提交的情况下(不使用 Javascript 提交表单)，浏览器遵循重定向并根据表单响应返回的任何内容更新浏览器中的显示。

当您通过 Ajax 提交表单时，浏览器不会自动对服务器响应执行任何操作。该响应返回到您的 Javascript，然后您的脚本决定如何处理它。如果您希望脚本遵循重定向，则必须检查响应，看看它是否为 3xx 状态，从相应的 header 获取新 URL，并将 window.location 设置为该新 URL。这将导致浏览器显示重定向页面。但是，您必须自己编写程序，或者找到一个提供实现此功能的功能的 Ajax 库。标准 Ajax 调用只是将表单 POST 响应返回到您的 Javascript - 仅此而已。您的脚本必须处理该响应并决定下一步做什么。

I am confused, that I cannot call gateway using post API cause it won't redirect to new page

你可以。您只需编写自己的 Javascript 来处理来自编程 API 调用的响应，如果是 3xx 重定向，则将 window.location 设置为新 URL，以指示浏览器加载新的重定向页面。