jquery - XAMPP : JQuery Ajax - Access-Control-Origin error

标签 jquery ajax cross-domain

我正在尝试使用 JQuery ajax 来从不同域上的源检索数据。

我收到请求的资源上不存在“Access-Control-Allow-Origin” header 。因此,不允许访问来源“null”。

例如我想检索整个 DOM,例如堆栈溢出主页。

    $(document).ready(function() {
      $.ajax({
        url: "http://stackoverflow.com/",
        success: function(data) {
          console.log(data);
          $("h1").text("Success => check console");
        },
        error: function(data) {
          console.log(data);
          $("h1").text("Error => check console");
        }
      });
    });
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>

<head>
  <meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" />
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta charset='utf-8'>
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Test</title>
  <script src="https://code.jquery.com/jquery-1.11.3.js"></script>
</head>

<body>
  <h1></h1>
</body>

</html>

我尝试过的:

  • 我在我的 Apache 服务器 (XAMPP) 上运行它。发现我需要设置 .htaccess 需要 header 添加 Access-Control-Allow-Origin "*" (出于安全原因,Kleene 星号应替换为所需的 URI)。我经常使用不同的 .htaccess
  • 所以现在我尝试在后端没有服务器的情况下检索它,纯粹使用我在代码片段中提供的代码(从 file:///C:/运行它)

编辑

解决了问题(也接受了我的回答,除非有更熟练的人提出更好的解释)并从实际的角度了解情况。

脚注:这个例子只是为了说明问题。在最终的解决方案中,我只想使用 AJAX 将 REST 请求发送到 VLAN 中运行服务器的另一台 PC。

最佳答案

TL;博士:

  • 如果我托管 API,我需要允许跨源请求。
  • 如果我想访问 API,托管该 API 的服务器需要允许 跨域请求。
  • 代码没有问题,我也没有从 file://运行它,代码片段工作正常

用外行术语进行更长的解释:

  • 在托管服务器时,如果您想要托管 API,则需要允许 服务器上的访问控制允许来源 header 。您可以指定允许哪些服务器访问API。

    如果我正在运行 APACHE 服务器并且我想在其上提供一些数据 REST请求,我需要指定允许访问的客户端 我提供的服务。这是通过在 .htaccess 中添加以下内容来完成的:

    header 添加 Access-Control-Allow-Origin *

    为了更安全,可以只允许特定来源:

    header 设置 Access-Control-Allow-Origin http://www.specific_origin.com

  • 另一方面,如果另一台服务器在其域上托管 API,则 服务器的管理员需要允许他们接受请求的来源 来自(这是我的情况)。例如,包含API的服务器 是用python编写的,所以代码如下:

    self.set_header('Access-Control-Allow-Origin', '*')

  • 一旦设置完毕,即使是来自所提供的脚本的请求 仅通过访问"file"地址即可很好地工作,例如 文件:///C:/tasks/crawler/index.html

关于jquery - XAMPP : JQuery Ajax - Access-Control-Origin error,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36764325/

相关文章:

ruby - 无法通过 Ajax 将表单发布到不同的子域(警告 : Can't verify CSRF token authenticity)

javascript - JS/jQuery - 使用复选框过滤 div

javascript - 有没有办法用 jquery ui 实现这种可拖动的效果?

jquery - 如何将焦点返回到同一文本框

java - 使用 guice 将 CrossOriginFilter 添加到 dropwizard

javascript - 插入跨域表单、iframe 或 javascript?

javascript - 从 html 表格中删除下拉列表

javascript - Angularjs 邮件应用程序的长轮询

javascript - 将监听器附加到按钮以使用 AJAX 发送表单数据与使用标准 HTML 表单有什么区别?

Javascript/Ajax - 手动从 Sys.EventHandlerList() 中删除事件处理程序