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

简介: 首先我上线时可以http访问也可以https访问,那么配置如下: nginx.conf

首先我上线时可以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


var https = require('https');
var fs=require("fs");
var express = require('express');
var ws=require("socket.io");
var path=require("path");
var _ = require('underscore');
var usocket = [];
var usocket1 = [];
var pass=[];
var data=[];
var hashName = {};
var onlineCount = 0;
var app = express();
app.all("*", function (req, res, next) {
    //设置允许跨域的域名,*代表允许任意域名跨域
    res.header("Access-Control-Allow-Origin", "*");
    //允许的header类型
    res.header("Access-Control-Allow-Headers", "content-type");
    //跨域允许的请求方式 
    res.header("Access-Control-Allow-Methods", "DELETE,PUT,POST,GET,OPTIONS");
    if (req.method.toLowerCase() == 'options')
        res.send(200); //让options尝试请求快速结束
    else
        next();
})
//你的证书
var options = {
    key: fs.readFileSync('./2_www.maomin.club.key'),
    cert: fs.readFileSync('./1_www.maomin.club_bundle.crt')
}
// 静态文件识别
app.use(express.static('./public'));
var server = https.createServer(options,app)
function get_file_content(filepath) {
    return fs.readFileSync(filepath);
}
// 获取在线
function broadcast() {
    io.sockets.emit("dataval", hashName);
}
// 提供私有socket
function privateSocket(toId) {
    return (_.findWhere(io.sockets.sockets, {
        id: toId
    }));
}
// 封装删除
function removeByValue(arr, val) {
    for (var i = 0; i < arr.length; i++) {
        if (arr[i] == val) {
            arr.splice(i, 1);
            break;
        }
    }
}
// 连接socket
var io=ws(server);
io.on("connection",function(socket){
// 写入成功后读取测试
fs.readFile('./user.xls', 'utf-8', function (err, data) {
    if(data!=null){
    var value = data.split('\n');
     io.sockets.emit("users", value); 
    }
});
// 写入成功后读取测试
fs.readFile('./password.xls', 'utf-8', function (err,data) {
    if(data!=null){
    var pass1=data.split('\n');
    io.sockets.emit("pass", pass1);
    }
});
    broadcast();
// 生成名字
socket.on('setName', function (data) {
    var name = data;
    hashName[name] = socket.id;
    // console.log(hashName[name]);
    broadcast();
});
// 私聊发送
socket.on('sayTo', function (data) {
    var toName = data.to;
    var toId;
    console.log(toName);
    if (toId = hashName[toName]) {
        privateSocket(toId).emit('message1', data);
    }
});
// 群发
socket.on("message",function(mes){
        // console.log(mes);
        io.emit("message", mes);
    });
// 离开
socket.on('disconnect', function (name) {
         io.emit('disconnected', --onlineCount);
         name=this.i2;
         io.emit("disconnect", name);
         removeByValue(data, name);
         io.sockets.emit("dataval", data);
    })
// 在线
socket.on('time', function (val) {
        // console.log(val);
   })
// 注册
socket.on("reg", function (name) {
          usocket[name] = socket;
          this.i1=name;
          io.emit("reg", name);
          var myname =this.i1+"\n";
          fs.writeFile('./user.xls', myname, {
              'flag': 'a'
          }, function (err) {
              if (err) {
                  throw err;
              }
              // 写入成功后读取测试
              fs.readFile('./user.xls', 'utf-8', function (err,data) {
                  if (err) {
                      throw err;
                  }
              });
          });
    })
// 加入
io.emit('connected', ++onlineCount);
    // console.log(data);
    io.sockets.emit("array", data);
    socket.on("join", function (name) {
        usocket1[name] = socket;
        this.i2 = name;
        io.emit("join", name);
        data.push(name);
         io.sockets.emit("dataval", data);
    })
// 密码
socket.on("pass",function(val){
      pass[val]=socket;
      this.i2=val;
      io.emit("pass", val);
      var password=this.i2+"\n";
       fs.writeFile('./password.xls', password, {
              'flag': 'a'
          }, function (err) {
              if (err) {
                  throw err;
              }
          });
    })
});
server.listen(5000)
console.log("服务器运行中");


最后呢,你需要在前台js中修改如下:index.js


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


这样你就可以使用https访问了。


微信截图_20220429141443.png

相关实践学习
基于函数计算快速搭建Hexo博客系统
本场景介绍如何使用阿里云函数计算服务命令行工具快速搭建一个Hexo博客。
相关文章
|
2月前
|
前端开发
webpack如何设置devServer启动项目为https协议
webpack如何设置devServer启动项目为https协议
149 0
|
3月前
|
弹性计算 应用服务中间件 Apache
ECS配置问题之输入ip无法访问如何解决?
ECS配置指的是对阿里云Elastic Compute Service(弹性计算服务)实例的硬件和软件资源进行设置的过程;本合集将详述如何选择合适的ECS配置、调整资源配比以及优化实例性能,以满足不同应用场景的需求。
|
5月前
|
JSON JavaScript 前端开发
Nodejs 第二十五章(http)
Nodejs 第二十五章(http)
33 0
|
5月前
|
JavaScript
如何让Vue项目本地运行的时候,同时支持http://localhost和http://192.168.X.X访问?
如何让Vue项目本地运行的时候,同时支持http://localhost和http://192.168.X.X访问?
|
13天前
|
前端开发 应用服务中间件 网络安全
nginx配置SSL证书配置https访问网站 超详细(附加配置源码+图文配置教程)
nginx配置SSL证书配置https访问网站 超详细(附加配置源码+图文配置教程)
42 0
|
13天前
|
Ubuntu 应用服务中间件 Linux
nginx 配置代理ip访问https的域名配置
nginx 配置代理ip访问https的域名配置
|
14天前
|
应用服务中间件 网络安全 Apache
解决跨域和https不能访问的问题
【4月更文挑战第10天】解决跨域和https不能访问的问题
57 2
解决跨域和https不能访问的问题
|
24天前
|
应用服务中间件 网络安全 nginx
nginx配置https访问
nginx配置https访问
45 0
|
2月前
|
应用服务中间件 nginx
nginx配置https和直接访问静态文件的方式
nginx配置https和直接访问静态文件的方式
31 3
|
4月前
|
缓存 前端开发 应用服务中间件
https证书已经部署到宝塔,但访问网站还显示不生效问题解决
https证书已经部署到宝塔,但访问网站还显示不生效问题解决
67 0