将Websocket流量从Nginx代理到Socket.io（不使用SSL）

Question

截至昨天，nginx开始支持websocket连接，因此我试图让我的nginx-nodejs-socket.io应用程序在没有harproxy的情况下工作（不过并不太成功）。

我想要实现的是，nginx仅将websocket连接请求发送到后端服务器或websocket服务器，更确切地说是socket.io，同时nginx将提供php文件和所有静态内容，包括html文件。如果可能的话，我不希望express提供静态内容。

以下是我的nginx.conf文件。

#user  nobody;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;
events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;

    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';

    #access_log  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    gzip  on;

    upstream backend {
        server 127.0.0.1:8080;
    }

    server {
        listen       80;
        server_name  localhost;

        charset UTF-8;

        #access_log  logs/host.access.log  main;

        location / {
            root   /website/html_public;
            index  index.php index.html index.htm;
        }       
        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   /website/html_public;
        }

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        location ~ \.php$ {
        root           /website/html_public;
        try_files      $uri =404;
        fastcgi_pass   unix:/tmp/php5-fpm.sock;
        fastcgi_index  index.php;
        fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;
        include        fastcgi_params;
        }

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        location ~ /\.ht {
            deny  all;
        }

         location /connection {
         proxy_pass http://backend;  
         proxy_http_version 1.1;
         proxy_set_header Upgrade $http_upgrade;
         proxy_set_header Connection "upgrade";
             }
       }

    # another virtual host using mix of IP-, name-, and port-based configuration
    #
    #server {
    #    listen       8000;
    #    listen       somename:8080;
    #    server_name  somename  alias  another.alias;

    #    location / {
    #        root   /website/html_public;
    #        index  index.php index.html index.htm;
    #    }
    #}
}

这是我的node中的server.js文件。

var express = require('express');
var app     = express();
var port    = 8080;

/* HTTP Server*/

server = require('http').createServer(app);
server.listen(port);
app.use(express.logger(':remote-addr - :method :url HTTP/:http-version :status :res[content-length] - :response-time ms'));
app.use(express.static(__dirname + '/html_public'));
app.use(express.favicon());

app.set('view engine', 'jade');
app.set('view options', { layout: false });
app.set('views', __dirname + '/views');

app.get('/', function(req, res){
    res.render('index.html');

});

/*
* Web Sockets
*/
io   = require('socket.io').listen(server),
io.configure('production', function(){
io.enable('browser client etag');
io.set('log level', 1);
io.set('transports', [ 'websocket', 'htmlfile', 'xhr-polling', 'jsonp-polling' ]);
});


console.log('Chat Server started with Node '+ process.version +', platform '+ process.platform + 'to port %d',port); 

我尝试从我的客户端这样连接：

socket = new io.connect('http://localhost/connection');

现在的问题是，当我尝试正常连接时，在Chrome控制台上会看到以下内容：**GET http://localhost/socket.io/socket.io.js 404 (未找到)**，并且当在浏览器中输入http://localhost/connection时，我收到"无法获取/connection"的消息，这告诉我nginx在当前配置下不能正常代理websockets。谢谢您提前的回答。

- Skeptic

---

为什么要通过Apache提供静态内容？这是一种额外的负担。Nginx也可以很好地完成它参见此问题。 - Mustafa

@Mustafa 你误解了，我不想让Apache做任何事情，因为它在我的项目中根本不存在，我只使用Nginx，我认为你没有仔细阅读我的问题，我展示了我的nginx.conf文件。 - Skeptic

你的后端是否响应 GET /connection 请求？你的服务器上是否有 /website/html_public/socket.io/socket.io.js 文件？ - VBart

我的后端不响应 GET /connection 请求，服务器上有 socket.io.js，但仅在我键入 localhost:8080 时加载，当简单键入 localhost 时无法加载资源（我猜是因为 nginx 没有代理 websocket）。 - Skeptic

但是你没有将nginx配置为代理localhost:8080。相反，你已经将nginx配置为代理localhost:8080/connection。如果你输入localhost:8080/connection会发生什么？ - VBart

Answer 1

让我猜猜，你想要：

location /connection {
    proxy_pass http://backend/;
    ...
}

但是你有：

location /connection {
    proxy_pass http://backend;
    ...
}

http://nginx.org/r/proxy_pass

- VBart

---

我按照你的建议更改了nginx配置，但是当我输入“localhost:8080/connection”时仍然收到“无法获取/连接”的消息。我注意到当我只在浏览器中输入IP地址时，socket.io无法加载，但是当我输入ip:8080时它可以正确加载。也许是我的server.js出了问题，而nginx干扰了express提供socket.io.js文件的服务？我很迷茫！ - Skeptic

你在Chrome控制台中仍然看到GET http://localhost/socket.io/socket.io.js 404 (Not Found)吗？ - VBart

很不幸，是的。只有当我将浏览器指向localhost:8080（并且从客户端也是localhost:8080）时，socket.io.js才能正常解析 :/ - Skeptic

socket.io.js 正在从 index.html 中这样被调用：<script type="text/javascript" src="./socket.io/socket.io.js"></script> 当渲染时，其源是 localhost:8080/socket.io/socket.io.js，它是从 socket.io 自身动态调用的。你觉得我应该直接将它包含在我的脚本文件夹中吗？ - Skeptic

src="./socket.io/socket.io.js" 的意思是浏览器必须从服务器加载此脚本。这并不神奇。 - VBart

Answer 2

为了确保，您是否拥有Nginx版本1.3.13？（例如，Nginx的PPA尚未拥有该版本。）

- El Toro

---

是的，我昨天编译了它，这是链接，供有兴趣的人使用： http://nginx.org/download/nginx-1.3.13.tar.gz - Skeptic