vue的history模式部署到Nginx切换路由出现404的问题 和 node反向代理配置以及HTTPS配置

vue的history模式的Nginx配置

主要成因:单页面应用的路由切换实际上是需要Nginx始终定义到index.html页面的

    server {
        listen       80;
        server_name  www.abc.cn;

        location / {
            try_files $uri $uri/ @router;
            index index.html index.htm;
       }
       location @router {
            rewrite ^.*$ /index.html last
       }

}

Node接口的反向代理

    server {
        listen       80;
        server_name  api.anc.cn;

        location / {
             proxy_pass http://127.0.0.1:5005;  //api端口
             root blog;
       }
}

Nginx 的HTTPS配置

server {
        listen 443;
        server_name api.abc.cn;      //需要配置成HTTPS的域名
        ssl on;
        ssl_certificate 1_api.caoxiaoyuan.cn_bundle.crt;   //证书
        ssl_certificate_key 2_api.caoxiaoyuan.cn.key;      //秘钥
        ssl_session_timeout 5m;
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2; 
        ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
        ssl_prefer_server_ciphers on;
        location / {
        	proxy_pass http://127.0.0.1:5005;    //接口
            root blog;
        }
    }