从浏览器托管的JavaScript应用到自定义服务器的跨域资源共享

Cross-Origin Resource Sharing from browser-hosted JavaScript app to custom server

本文关键字：服务器 自定义 资源共享 应用 浏览器 JavaScript      更新时间：2023-09-26

我正在寻找一种方法，允许浏览器托管的JS应用程序使请求服务器运行在不同的端口，可能，不同的机器比这是在第一个地方服务的JS应用程序。

我服务于一个简单的JavaScript (HTML5)应用程序从我的Mac OS X Apache web服务器。我希望能够在Windows、Android和OS x上尽可能多的浏览器上运行这个应用程序，但我将满足于每种浏览器一个。

我的JavaScript应用程序使用XMLHttpRequest向返回JSON的最小自定义服务器发出请求。

例如，我的JS应用程序可以访问http://10.0.1.3/poc/dashboard.html

和我的自定义服务器在同一台机器上运行，监听端口49379…像这样的请求http://10.0.1.3:49379/find?name=Fred将返回一组元组，其中'name'等于'Fred'。

如果我直接在导航工具栏中输入这个请求，那么我就得到了想要的结果。

如果我在JS中发出相同的请求，我会得到几个错误。

var theXHR = new XMLHttpRequest();
theXHR.onreadystatechange = onReadyStateHandler;
theXHR.open("GET", "http://" + ipAddress + ":49379/find?name=Fred", true);
theXHR.setRequestHeader("User-Agent", "XMLHTTP/1.0");
theXHR.send(null);

我得到这两个错误:

  1. 拒绝设置不安全的报头"User-Agent"

  2. XMLHttpRequest无法加载http://10.0.1.3:49379/find?name=Fred。原产地http://10.0.1.3不允许Access-Control-Allow-Origin .

我已经控制了Apache服务器，JavaScript和自定义服务器。这只是一个概念验证，将在孤立的网络上进行演示。所以，我不关心安全问题。

此外，我在Chrome, Firefox, Safari中运行。所有这些似乎都使用XMLHttpRequest2对象。

我找到了绕过CORS的方法是使用jsonp -这是带有回调函数的json -我从未将其与XMLHttpRequest一起使用，但它可以与jQuery ajax函数(如$.getJSON)一起使用。在url查询字符串中，只需添加参数jsoncallback=?，瞧，没有更多的CORS问题。$.getJSON动态地将其success参数赋值给回调函数

相关文章：