关于全栈项目【臻美Chat】https访问遇到的问题【技术栈：Nodejs】

r囧r小猫 2021-10-01 07:50 281阅读 0赞

首先我上线时可以http访问也可以https访问，那么配置如下：  
**nginx.conf**

user root;
    worker_processes auto;
    error_log /var/log/nginx/error.log;
    pid /run/nginx.pid;
    
    # Load dynamic modules. See /usr/share/nginx/README.dynamic.
    include /usr/share/nginx/modules/*.conf;
    
    events {
        worker_connections 1024;
    }
    
    http {
        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  /var/log/nginx/access.log  main;
    
        sendfile            on;
        tcp_nopush          on;
        tcp_nodelay         on;
        keepalive_timeout   65;
        types_hash_max_size 2048;
    
        include             /etc/nginx/mime.types;
        default_type        application/octet-stream;
    
        # Load modular configuration files from the /etc/nginx/conf.d directory.
        # See http://nginx.org/en/docs/ngx_core_module.html#include
        # for more information.
        include /etc/nginx/conf.d/*.conf;
        server {
            listen       80 default_server;
            listen       [::]:80 default_server;
            listen 443 ssl ;
            server_name  '域名';
            #ssl on; 
            ssl_certificate cert/1_www.maomin.club_bundle.crt;
    
            ssl_certificate_key cert/2_www.maomin.club.key;
    
            ssl_session_timeout 5m;
            ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
            ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
            ssl_prefer_server_ciphers on;
            # Load configuration files for the default server block.
            include /etc/nginx/default.d/*.conf;
            location / {
               root /root/www/;
              index index.html index.htm;
            }
            location /chat3/ {
            proxy_pass https://你的外网ip:3003/;
            proxy_redirect off;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            }
            location /chat/ {
            proxy_pass https://你的外网ip:5000/;
            proxy_redirect off;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            }
            location /mes/ {
            proxy_pass http://你的外网ip:3011/;
            proxy_redirect off;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            }
            location /upload/ {
            proxy_pass http://172.16.0.4:8083/;
            proxy_redirect off;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            }
    		error_page 404 /404.html;
                location = /40x.html {
            }
            error_page 500 502 503 504 /50x.html;
                location = /50x.html {
            }
          }

以上是nginx.conf的配置。一般配置https都会这样配置，但是如果你想http也可以访问那么加上以下代码

listen       80 default_server;
            listen       [::]:80 default_server;

这里注意的是，需要注释

#ssl on;

这样才能两者都可以访问。

还有在配置nginx.conf，需要注意

location /chat/ {
            proxy_pass https://你的外网ip:5000/;
            proxy_redirect off;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            }

这处至关重要，我用了3天才解决https访问问题，就是因为这处。所以当你使用node的https服务的时候，不妨根据我上面那段代码。`proxy_pass https://你的外网ip:5000/;`这里是关键。

然后呢，我使用的是node服务端，因为要使用https访问，所以要引入https服务。  
以下是我的项目实例：  
**nodejs**

最后呢，你需要在前台js中修改如下：  
**index.js**

var socket = io.connect("https://域名:5000/");

这样你就可以使用https访问了。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MDQ1NjQ1_size_16_color_FFFFFF_t_70]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MDQ1NjQ1_size_16_color_FFFFFF_t_70]: /images/20210812/d00d1fb3f45d451b90a954a8891c33f7.png