Question

我有一个socket.io服务器正在运行，我无法通过我的Mac上的本地html文件连接到它。

错误：

无法加载 http://file/socket.io/?EIO=3&transport=polling&t=M6tFqlm：价值＆＃39; Access-Control-Allow-Origin＆＃39;响应中的标头一定不能通配符＆＃39; *＆＃39;当请求的凭据模式为＆＃39; include＆＃39;时。起源＆＃39; null＆＃39;因此不允许访问。凭据模式 XMLHttpRequest发起的请求由 withCredentials属性。

服务器：

var app = require('express')();
var server = app.listen(8080);
var cors = require('cors');

app.options('*', cors());
var io = require('socket.io').listen(server);

....

// think this is redudant
server.listen(8080);

本地HTML文件（没有运行它的本地服务器）

<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script>
</head>
<body>

  <script src="../socket.io-client/dist/socket.io.js"></script>
<script>
    // Create SocketIO instance, connect

    // var socket = new io.Socket();
    var socket = io();


    //var socket = io('https://example.com:8080', { transport : ['websocket'] });
    socket.connect('https://example.com:8080'); 

    // Add a connect listener
    socket.on('connect',function() {
      console.log('Client has connected to the server!');
    });
    // Add a connect listener
    socket.on('message',function(data) {
      console.log('Received a message from the server!',data);
    });
    // Add a disconnect listener
    socket.on('disconnect',function() {
      console.log('The client has disconnected!');
    });

    // Sends a message to the server via sockets
    function sendMessageToServer(message) {
      socket.send(message);
    };
</script>
  <div id="date"></div>
  <textarea id="text"></textarea>
</body>
</html>

Answer 1

根据MDN，您将 Access-Control-Allow-Credentials 标头设置为 include ，这需要服务器指定此域可以访问Cookie等 - 这是有道理的 - 您不希望仅向任何网站发送Cookie或凭据。

如果您只有一个不在任何地方托管的HTML文件，您只能禁用凭据，因此不会发送它们。我看过the internet，我认为你可以设置它：

var socket = io({
  extraHeaders: {
    'Access-Control-Allow-Credentials': 'omit'
  }
});

或者，您可以在浏览器中禁用CORS，但当然，这是最后的手段，可以解决安全问题。

Answer 2

我对CORS感到很痛苦

但你应该设置一个特定的域名，它会对你有所帮助。

var cors = require('cors')
var app = express()

var corsOptions = {
  origin: function (origin, callback) {
    if (any_logic_you_want) {
      //this is not tested, just copied from npm cors docs
      callback(null, true)
    } else {
      callback(new Error('Not allowed by CORS'))
    }
  }
}

app.use(cors(corsOptions));

访问控制允许来源＆＃39;响应中的标题不能是通配符＆＃39; *＆＃39;当请求的凭据模式是“包含”时

2 个答案: