为什么我在此URL https://davedevzone.com/chat/上而不是直接从端口https://davedevzone.com:3001

时间:2019-02-18 05:53:56

标签: node.js nginx socket.io

嗨,我在设置nodejs应用程序的路径时遇到麻烦,但是我不确定它是否与配置nginx的方式或设置应用程序的方式有关。

基本上,我想提供以下服务:https://davedevzone.com:3001/

作为格式精美的网址,不带端口,例如:https://davedevzone.com/chat/

但是,当我尝试转到最后一个URL时,如您所见,它在尝试加载的每个资源(css文件和js文件)上崩溃并出现404错误

我注意到,如果我用完整的URL(包括端口)替换每个资源标签的本地路径,则可以解决此问题。例如:

https://davedevzone.com:3001/css/site.css

加载正常。但是我不确定这是否是正确的处理方式,或者将来是否会给我带来任何麻烦。对我来说,这感觉就像是简单的出路,而从我的经验来看,这通常都是不好的。

这是我应用的完整代码:

index.js(服务器端)

var port = 3001; // app's port
var fs = require('fs');
var https = require('https');
var express = require('express');
var app = express();
//var http = require('http').Server(app);
var server = https.createServer({
    key: fs.readFileSync('privkey.pem'),
    cert: fs.readFileSync('fullchain.pem')
},app);

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


app.use('/css', express.static('css'));
app.use('/js', express.static('js'));

app.get('/', function(req, res){
    res.sendFile(__dirname + '/index.html');
});

io.on('connection', function(socket){
    console.log('a user connected');
    socket.on('disconnect', function(){
        console.log('user disconnected');
    });
    socket.on('chat message', function(msg){
        console.log('message: ' + msg);
        socket.broadcast.emit('chat message', msg);
    });
});


server.listen(port, function(){
    console.log('listening on *:' + port);
});

index.html(客户端)

<!doctype html>
<html>
  <head>
    <title>Socket.IO chat</title>
    <link rel="stylesheet" type="text/css" href="/css/site.css" />
  </head>
  <body>
    <ul id="messages"></ul>
    <form action="">
      <input id="m" autocomplete="off" /><button>Send</button>
    </form>
    <script src="/socket.io/socket.io.js"></script>
    <script src="/js/jquery-1.11.1.js"></script>
    <script>
        var socket = io();

        $('form').submit(function(e){
            e.preventDefault();
            var msg = $('#m').val();
            socket.emit('chat message', msg);
            $('#messages').append($('<li>').text(msg));
            $('#m').val('');
            return false;
        });

        socket.on('chat message', function(msg){
            $('#messages').append($('<li>').text(msg));
        });

        console.log("from nodeprojects folder");
    </script>
  </body>
</html>
/p/nginx/sites-available/davedevzone.com中的

我的 nginx配置文件

server {
    listen 80;

    index index.html index.html index.nginx-debian.html;

    server_name davedevzone.com www.davedevzone.com;

    location /sample/ {
        proxy_pass http://127.0.0.1:3000/;
    }

    location /chat/ {
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $http_host;
        proxy_set_header X-NginX-Proxy true;

        proxy_pass https://127.0.0.1:3001/;
        proxy_redirect off;

        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    } 


    listen [::]:443 ssl ipv6only=on; # managed by Certbot
    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/davedevzone.com/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/davedevzone.com/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot


}

1 个答案:

答案 0 :(得分:0)

更改

<link rel="stylesheet" type="text/css" href="/css/site.css" />

<link rel="stylesheet" type="text/css" href="/chat/css/site.css" />

并对/socket.io/socket.io.js/js/jquery-1.11.1.js执行相同的操作。 然后,它从反向代理到端口3001的聊天URL请求它们。