跨域 ajax 表单发布 --- 这是如何允许的？答案

【问题标题】：cross domain ajax form post --- How is this allowed?跨域 ajax 表单发布 --- 这是如何允许的？
【发布时间】：2015-06-23 00:55:26
【问题描述】：

我正在使用 jQuery 和 jQuery form plugin

jQuery 表单插件 ajaxSubmit 中有一个方法。你传递一个表单，然后它通过 ajax 提交它，你得到一个响应。我想知道这是怎么可能的，因为表单与网页位于不同的服务器上。（不同的域）。它似乎有效，我得到了我可以处理的回复。这是如何工作的？

域表单托管在 (http://example.com)

表单网址：127.0.0.1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <title>PHP Point Of Sale</title>
    <script src="<?php echo base_url('/assets/js/jquery.js'.'?'.APPLICATION_VERSION); ?>"></script>
    <script src="<?php echo base_url('js/jquery.form.js'.'?'.APPLICATION_VERSION); ?>"></script>
</head>

<body>

    <form id="formCheckout" method="post" action="<?php echo $form_url; ?>">
        <?php foreach($post_data as $key=>$value) { ?>
            <?php echo form_hidden($key, $value);?>
                <?php } ?>
    </form>

    <script>
        $("#formCheckout").ajaxSubmit({
            success: function(response) {
                console.log(response);
            }
        });
    </script>
</body>

</html>

【问题讨论】：

CORS 标头？ developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

标签： jquery ajax

【解决方案1】：

如果服务器有一个'Access-Control-Allow-Origin': '*'或类似的响应头，它会返回一个响应。

总之，这与jQuery无关，与服务器有关。

在上面的例子中，* 是代表所有来源的通配符。但它也可以指定来源列表。

请记住，即使在 CORS 请求中，您始终可以向服务器发送请求，而服务器将始终接收它。如果它愿意，它只会返回一个响应（在这种情况下，它会使用访问控制标头。）

如果服务器没有该标头，那么您将在控制台中看到常见错误，即 XMLHTTPRequest could not complete because the server does not allow cross-origin communication 或它所说的任何内容。

这取决于服务器使用的架构，但如果它是使用 Express 的 Node.js 服务器（例如），您会看到类似于 server.js 文件或任何地方的内容：

app.use(function(req, res) { res.header('Access-Control-Allow-Origin', '*') });

这种方法在不同的服务器架构（如 Apache）上会有很大的不同，但标头作为 HTTP 的一部分是标准化的，所以这部分保持不变。

有关示例，请参阅 AJAX Cross Domain。

【讨论】：

就是这样。我无权访问服务器，所以我想知道它是如何工作的，并且它具有您在答案中指定的响应标头。