在 Chrome 中的 ajax restful ws 调用期间访问 CORS答案

【问题标题】：access CORS during ajax restful ws call in Chrome在 Chrome 中的 ajax restful ws 调用期间访问 CORS
【发布时间】：2018-04-15 06:40:27
【问题描述】：

我有一个完全用 jquery 和 js 编写的基于 Web 的项目。在客户端，我通过这样的 ajax 调用宁静的网络服务

 $.ajax({
    type: 'GET',
    timeout: 1000000000,
    headers: { 'Access-Control-Allow-Origin': '*' },
    url: serverName + '/getAlerts/',
    data: {}, 
    dataType: "text", 
    success: function (data) {
        $scope.alerts = JSON.parse(data);
        $scope.$apply();
    },
    error: function (data) {
        alert(errServiceCall); 
    }
});

在服务器端，在 Spring 中创建的 RESTful Web 服务。示例函数是这样的

@RequestMapping(value = "/services/getAlerts", method = RequestMethod.GET, produces = "application/json; charset=UTF-8")
@ResponseBody
public String getAlerts(HttpServletRequest request) throws JSONException, IOException, SQLException {
    return "hello it's me";
}

在这种情况下，当我尝试在 Chrome 上调用该函数时，我收到以下错误

(index):374 拒绝连接 'http://servername/services/getAlerts/' 因为它违反了遵循内容安全策略指令：“connect-src 'self'”。

如果我将restful url（http://servername/services/getAlerts）粘贴到chrome地址栏中，它会成功返回结果。

我建议是关于 CORS（跨域资源共享），所以我添加了代码

headers: { 'Access-Control-Allow-Origin': '*' },

在我的 ajax 代码块中。但它不起作用。

所以我尝试像这样在服务器端的函数上方添加@CrossOrigin参数

@CrossOrigin
@RequestMapping(value = "/services/getAlerts", method = RequestMethod.GET, produces = "application/json; charset=UTF-8")
@ResponseBody
public String getAlerts(HttpServletRequest request) throws JSONException, IOException, SQLException {
    return "hello it's me";
}

但在这种情况下，我在编译时收到以下错误（Java 版本 1.6 + spring 版本 4.3.12）

注解 org.springframework.web.bind.annotation.CrossOrigin 是缺少

如何以最短的方式解决 CORS 问题？

P.S：当我从 Internet 选项 -> 安全 -> 自定义级别 -> 杂项 -> 跨域访问数据源（设置启用）打开 CORS 时，所有进程在 IE 中都能完美运行

【问题讨论】：

headers: { 'Access-Control-Allow-Origin': '*' }, 你不能在 JavaScript 中设置它......必须在服务器上完成。
我在哪里可以在服务器端设置该属性？ @epascarello
尝试将您的 JDK 更新到 1.8 或至少 1.7
1.7 无效。由于其他原因，1.8 对我来说是不可能的。

标签： javascript java ajax spring cors

【解决方案1】：

你添加了吗

$.ajax({
    ....
    xhrFields: {withCredentials: true},
    ....
}

在ajax方法中

【讨论】：

【解决方案2】：

我将以下代码添加到 unix WAS 请求服务器中的虚拟主机配置文件中，其中包括在 spring 框架中创建的 restful webservices，它解决了我的问题。现在无需任何浏览器配置，我可以在客户端调用 ajax 函数而不会出现 CORS 问题。

Header always set Access-Control-Allow-Origin "*"
Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS"
Header always set Access-Control-Max-Age "1000"
Header always set Access-Control-Allow-Headers "x-requested-with, Content-Type, origin, authorization, accept, client-security-token, x-csrftoken"
Header always set Access-Control-Allow-Credentials "true"

如果您想深入了解该配置，可以访问that page，这很有帮助。

【讨论】：