Heroku - Socket.IO 客户端总是连接到本地主机答案

【问题标题】：Heroku - Socket.IO Client Always Connects To LocalhostHeroku - Socket.IO 客户端总是连接到本地主机
【发布时间】：2016-10-22 21:36:33
【问题描述】：

我正在尝试将基于 Node.js、Express.js、Socket.IO 和 React 的应用程序部署到 Heroku。

但在客户端，socket.io-client 似乎总是连接到本地主机，即使我在连接时从未指定本地主机。

我在浏览器控制台中收到此错误：

bundle.js:208 Mixed Content: The page at 'https://test.herokuapp.com/#/test?_k=v7l28t' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://localhost:3000/socket.io/?EIO=3&transport=polling&t=LLobEYP'. This request has been blocked; the content must be served over HTTPS.

如果我尝试在 http 上打开它，我会收到连接被拒绝错误：

bundle.js:208 GET http://localhost:3000/socket.io/?EIO=3&transport=polling&t=LLpAsLm net::ERR_CONNECTION_REFUSED

这是我的服务器套接字的样子：

var express = require('express');
var app = express();
var server = http.createServer(app);
var io = require('socket.io')(server);
server.listen(port);
io.on('connection', function(socket) {
  socket.on('news', function(message) {
    console.log("Responding with news");
    io.sockets.emit('news', 'news');
  });
});

这是客户端代码：

var io = require('socket.io-client');
var socket = io.connect();
socket.on('connect', function() {
  console.log('connected to server');
  socket.emit('news', 'news');
});

加上package.json：

{
  "name": "test-socket",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "dev-server": "nodemon ./bin/www",
    "dev-client": "watchify -t [ envify --NOVE_ENV development ] -t [ babelify --presets [ react es2015 ] ] public/javascripts/index.js -o public/javascripts/build/bundle.js -v",
    "dev": "concurrently \"npm run dev-server\" \"npm run dev-client\"",
    "build": "browserify -t [ envify --NOVE_ENV production ] -t [ babelify --presets [ react es2015 ] ] -g uglifyify public/javascripts/index.js -o public/javascripts/build/bundle.js",
    "start": "node ./bin/www"
  },
  "dependencies": {
    "body-parser": "~1.13.2",
    "cookie-parser": "~1.3.5",
    "debug": "~2.2.0",
    "express": "~4.13.1",
    "fakeredis": "^1.0.3",
    "jade": "~1.11.0",
    "lodash": "^4.11.1",
    "material-ui": "^0.15.0-beta.2",
    "mongoose": "^4.5.0",
    "morgan": "~1.6.1",
    "passport": "^0.3.2",
    "passport-http": "^0.3.0",
    "passport-local": "^1.0.0",
    "react": "^15.0.1",
    "react-bootstrap": "^0.28.5",
    "react-dom": "^15.0.1",
    "react-router": "^2.4.1",
    "react-tap-event-plugin": "^1.0.0",
    "redis": "^2.6.2",
    "serve-favicon": "~2.3.0",
    "socket.io": "^1.4.6",
    "socket.io-client": "^1.4.6",
    "whatwg-fetch": "^0.11.0"
  },
  "devDependencies": {
    "babel-preset-es2015": "^6.6.0",
    "babel-preset-react": "^6.5.0",
    "babelify": "^7.2.0",
    "browserify": "^13.0.0",
    "concurrently": "^2.1.0",
    "envify": "^3.4.0",
    "nodemon": "^1.9.2",
    "uglifyify": "^3.0.1",
    "watchify": "^3.7.0"
  },
  "description": "",
  "main": "app.js",
  "author": "Harsha Bhat",
  "license": "ISC"
}

如果我在这里做错了什么，请告诉我。感谢您的帮助:)

【问题讨论】：

你能把你的package.json贴上来吗？我相信可能有一个脚本调用本地主机服务器
当然。添加了相同的内容。
打开您网站的 http 版本，http://test.herokuapp.com，它应该可以工作
即使套接字尝试连接本地主机，但我收到连接被拒绝错误：bundle.js:208 GET localhost:3000/socket.io/… net::ERR_CONNECTION_REFUSED

标签： javascript node.js heroku socket.io

【解决方案1】：

如果我用于客户，这对我有用：

const socketURL =
  process.env.NODE_ENV === 'production'
    ? window.location.hostname
    : 'https://localhost:5000';

const socket = io.connect(socketURL, {secure: true});

【讨论】：

【解决方案2】：

您的网站在 https 上运行，但在 http 上运行套接字。使用安全 URL 进行初始连接，即使用 "http://" 代替 "https://"

var socket = io.connect('https://test.herokuapp.com', {secure: true});

或在http://test.herokuapp.com（无 ssl）打开您的网站

【讨论】：

即使我在 http 上打开它仍然指向 localhost:3000 并且我收到此错误：net::ERR_CONNECTION_REFUSED
您可能在某处获得了硬编码的 url，请检查项目中是否还有其他 io.connect 调用。至少为了测试目的明确写下 url