Question

尝试打开从浏览器到运行在localhost：9000上的服务器的WebSocket连接，这是我的JS代码：

$( document ).ready(function() {

    var url = "ws://localhost:9000/myapp";
    var connection = new WebSocket(url);

    connection.onopen = function() {
        console.log('WebSocket Open');
    };
    connection.onerror = function(error) {
        console.log('WebSocket Error ', error);
    };
    connection.onmessage = function(event) {
        console.log('WebSocket Msg ', event);
    }

});

但是由于内容安全策略，浏览器拒绝接受连接：

内容安全政策：网页设置阻止加载资源在ws：// localhost：9000 / myapp（＆＃34; default-src http://localhost:9000＆＃34;。）

我认为打开一个websocket连接到＆＃34; self＆＃34;在这种情况下＆＃34; localhost＆＃34;可以接受，但Chrome和FF都拒绝连接。我想放置

<meta http-equiv="Content-Security-Policy" content="default-src http: ws: connect-src ws:">

但它没有解决问题。

这些是服务器返回的标头：

HTTP/1.1 200 OK
Referrer-Policy: origin-when-cross-origin, strict-origin-when-cross-origin
X-Frame-Options: DENY
X-XSS-Protection: 1; mode=block
X-Content-Type-Options: nosniff
Content-Security-Policy: default-src 'self'
X-Permitted-Cross-Domain-Policies: master-only
Date: Sat, 24 Jun 2017 03:39:10 GMT
Content-Type: text/html; charset=utf-8
Content-Length: 2130

什么可能导致连接拒绝？

Answer 1

似乎该页面必须使用Content-Security-Policy响应标头提供，其标头值为default-src http://localhost:9000。

鉴于你永远不能在某个地方使用CSP指令来应用比其他地方更宽松的策略，如果你在CSP头中有一个严格的default-src http://localhost:9000策略，它将被应用而不是您可能使用文档中的meta元素指定的任何更自由的策略。

请参阅the discussion about multiple policies in the CSP spec：

影响是将额外策略添加到要实施的策略列表中只会进一步限制受保护资源的功能。

所以我认为您可能需要更改Content-Security-Policy标头的值才能default-src http: ws: connect-src ws:。仅使用meta元素无法实现此目的。

Javascript创建WebSocket连接被拒绝 - 内容安全

1 个答案: