CORS保持在SecurityError上：操作不安全[关闭]

Posted 2023-03-04

【中文标题】CORS保持在SecurityError上：操作不安全[关闭]

【英文标题】：CORS remain on SecurityError: The operation is insecure [closed]

【发布时间】：2016-09-10 20:48:34

【问题描述】：

我有一个在 nodejs 中使用 Express 开发的 http 服务器。 服务器在 3000 端口本地运行。

提供了一个 html 页面 (index.html)，它调用 ajax GET 内容（作为 html 内容类型）。 这些 ajax 内容也在同一个端口、同一个 http 协议中由同一个服务器提供。

在节点服务器应用程序中，我添加了 Cors Same Origin 标头，但是 index.html 在控制台中仍然出现错误：“安全错误：操作不安全”。

在浏览器控制台中，我成功地从节点 Express 应用程序中看到了有关“Access-Control-Allow-Origin”等的标题...

此外，同一个应用程序也在为另一个页面提供服务，并且 index.html 可以成功获取数据而没有任何安全错误。

你还有什么建议吗？

function getData(url, type, CType, id) 
  //var xhr = new XMLHttpRequest();
  //xhr.open(type, url, true);
  //xhr.withCredentials = true;
  //xhr.onload = function () 
  //console.log(xhr.responseText);
  //if(CType == 'text/html')  $(id).append(xhr.responseText); 
  //;
  //xhr.send();

$.ajax(
  url: url,
  type: type,
  crossDomain:true,
  cors:true,
  success: function(data) 
    $(id).append(data);
  ,
  error: function(data) 
    console.log('ERROR '+url);
    console.log(data);
  $(id).append(getError(url));
  
);


getData(location.protocol+'//'+location.hostname+(location.port ? ':'+location.port: '')+'/modules/mymodule', 'text/html', 'GET', '#content');

【问题讨论】：

看起来这两个请求都是 HTTP 或 HTTPS（不是混合的）。是这样吗？是否涉及任何重定向？ （实际上，您似乎正在向 same 源发出请求，为什么只使用相对 URL？）

你测试的是什么浏览器？如果您尝试使用不同的浏览器，您会收到不同的（或许更有启发性的）错误消息吗？

> 为什么只使用相对 URL？嗯..这是一个很好的问题..而且没有理由...只是相对测试：getData('/modules/mymodule', 'text/html', 'GET', '#content');我得到了同样的结果。

最初用 Firefox 44.0.2 和 Chromium 48.0.2564.82 测试给出：“SyntaxError: 无法在 'XMLHttpRequest' 上执行 'open': 'TEXT/HTML' 不是有效的 HTTP 方法。”

【参考方案1】：

最初用 Firefox 44.0.2 和 Chromium 48.0.2564.82 测试给出：“SyntaxError: 无法在 'XMLHttpRequest' 上执行 'open'：'TEXT/HTML' 不是有效的 HTTP 方法。”

你的中间两个论点倒过来了。

getData(location.protocol+'//'+location.hostname+(location.port ? ':'+location.port: '')+'/modules/mymodule', 'text/html', 'GET', '#content');

第二个参数应该是"GET"，第三个参数应该是"text/html"。

【讨论】：

ohhhh....亲爱的...我感觉很...愚蠢...

【参考方案2】：

尝试在从客户端到服务器的 ajax 调用中添加这三个参数

  crossDomain:true,
  cors:true,
  contentType:"application/json;charset=utf-8",

编辑过的：

 $.ajax(
   url: url,
   type: type,
   method:"GET",
   crossDomain:true,
   cors:true,
   contentType:"application/html;charset=utf-8"
   success: function(data) 
     $(id).append(data);
   ,
  error: function(data) 
    console.log('ERROR '+url);
    console.log(data);
   $(id).append(getError(url));
  
);

此外，如果您没有正确使用此方法，请尝试以下操作：

Add Header in AJAX Request with jQuery

【讨论】：

不幸的是，它以同样的错误结束。

crossDomain:true, 导致 jQuery 抑制它通常添加到相同来源的 XHR 请求的自定义 HTTP 标头，以防它获得到不同来源的 HTTP 重定向。如果这是问题所在，则错误将抱怨 Access-Control-Allow-Headers 标头。

cors:true, 不是 ajax 函数支持的选项。它将被忽略。

contentType:"application/json;charset=utf-8", 完全没有意义。 OP 正在发出 GET 请求，没有请求正文来描述其内容类型。

是的，它没有意义，因为您的返回数据类型是 html