如何使用Nginx服务器配置Web套接字?

时间:2019-05-31 02:37:54

标签: javascript node.js nginx websocket

我正在使用Nginx服务器40.115.176.82运行node.js和socket.io。  这是我的/etc/nginx/conf.d/site.conf:

server {
   listen 443;
   server_name localhost;

   client_max_body_size 20M;

   # smart-shingi log_format data >>
   if ($http_token ~ "(\S{10})$") {
       set $h_token $1;
   }
   # << smart-shingi log_format data

   error_page  500 502 503 504  /50x.html;
   location = /50x.html {
       root  /usr/share/nginx/html;
   }

   location / {
       deny  all;
   }

   location ~ /\. {
       deny  all;
   }

   location = /favicon.ico {
       error_page     404 = @favicon;
       access_log     off;
       log_not_found  off;
   }

   location @favicon {
       empty_gif;
       access_log     off;
       log_not_found  off;
   }

   location /drive/ {
       root   /usr/share/nginx/webapp;
       index  login.html;
       allow  all;
   }


   location /websocket/ {
               root home/its05/SSSChat/ChatWithSocket;
               index index.html index.htm index.nginx-debian.html;
               proxy_pass http://localhost:4000;
               proxy_http_version 1.1;
               proxy_set_header Upgrade $http_upgrade;
               proxy_set_header Connection 'upgrade';
               proxy_set_header Host $host;
               proxy_cache_bypass $http_upgrade;
 }

   location ~ \.txt {
       root    /usr/share/nginx/androidApp;
   }
}

这是我的/home/its05/SSSChat/ChatWithSocket/index.js:

var express = require('express');
var socket = require('socket.io');

// App setup
var app = express();
var server = app.listen(4000, function(){
    console.log('listening for requests on port 4000,');
});

// Static files
app.use(express.static('public'));

//Socket setup
var io = socket(server);

io.on('connection', function(socket){
    console.log('made socket connection', socket.id);

    //Show diconnect log when we refresh page
    socket.on('disconnect', function(){
        console.log('The socket disconnected');
    }); 

    // Handle chat event
    socket.on('chat', function(data){
        // console.log(data);
        io.sockets.emit('chat', data);
    });

    // Handle typing event
    socket.on('typing', function(data){
        socket.broadcast.emit('typing', data);
    });
});

这是我的/home/its05/SSSChat/ChatWithSocket/public/chat.js:

// Make connection
var socket = io.connect('http://localhost:4000');

// Query DOM
var message = document.getElementById('message'),
      handle = document.getElementById('handle'),
      btn = document.getElementById('send'),
      output = document.getElementById('output'),
      feedback = document.getElementById('feedback'),
      chatWindow = document.getElementById('chat-window');
......................................................

home /文件夹和etc /文件夹处于同一级别。

我不能使用地址https://40.115.176.82/websocket/跑步。我遵循了许多有关Nginx + WebSocket的在线指南,但是我不知道我在哪里犯了错误。请帮助我。

1 个答案:

答案 0 :(得分:1)

使用此配置,然后重试。您不需要更新proxy_pass localhost:4000-> proxy_pass 40.115.176.82:4000。这是不正确的。问题出在客户身上。

map $http_upgrade $connection_upgrade {
  default upgrade;
  ''      close;
}

server {
   listen 443;
   server_name localhost;

   client_max_body_size 20M;

   # smart-shingi log_format data >>
   if ($http_token ~ "(\S{10})$") {
       set $h_token $1;
   }
   # << smart-shingi log_format data

   error_page  500 502 503 504  /50x.html;
   location = /50x.html {
       root  /usr/share/nginx/html;
   }

   location / {
       deny  all;
   }

   location ~ /\. {
       deny  all;
   }

   location = /favicon.ico {
       error_page     404 = @favicon;
       access_log     off;
       log_not_found  off;
   }

   location @favicon {
       empty_gif;
       access_log     off;
       log_not_found  off;
   }

   location /drive/ {
       root   /usr/share/nginx/webapp;
       index  login.html;
       allow  all;
   }


   location /websocket/ {
    proxy_pass http://localhost:4000;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header Host $host;  # pass the host header - http://wiki$
    proxy_http_version 1.1;  # recommended with keepalive connections $

    ### WebSocket proxying - from http://nginx.org/en/docs/http/websocke$
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection $connection_upgrade;
}

   location ~ \.txt {
       root    /usr/share/nginx/androidApp;
   }
}

在客户端中尝试

// Make connection
var socket = io('https://40.115.176.82', {path: ' /websocket/'})

// Query DOM
var message = document.getElementById('message'),
      handle = document.getElementById('handle'),
      btn = document.getElementById('send'),
      output = document.getElementById('output'),
      feedback = document.getElementById('feedback'),
      chatWindow = document.getElementById('chat-window');

还要检查您使用的是哪个版本的套接字。

相关问题