The whole process of deploying front-end vue to nginx and configuring https security certificate

        Explanation: I originally used docker to install nginx and deploy it through mounting, but there were many bugs (for example, it was still inaccessible after deploying the security certificate), so I was troubled for a long time, and finally changed to install nginx locally. Finally, after unremitting efforts I finally followed it and recorded it here.

        1: The whole process:

              1. Package the front-end project and a dist file will be generated (and don’t forget to modify the IP that calls the backend)

              2. Install nginx (local installation, not docker), and then put the files under dist into the html directory of nginx

              3. Configure nginx configuration file

              4. Install certificate (ssl)

            Install nginx, ssl reference: https://blog.csdn.net/oYingJie1/article/details/127700897

            Download and install SSL reference: https://blog.csdn.net/qq_42320934/article/details/120655799

        2: Attach key codes and instructions

                1.nginx configuration file

#user  nobody;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       mime.types;
    default_type  application/octet-stream;

    #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  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    #gzip  on;

    server {
        listen       80;
        server_name  localhost;
	   #将所有HTTP请求通过rewrite指令重定向到HTTPS。
	   rewrite ^(.*)$ https://$host$1;
        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            root   html;
            index  index.html index.htm;
        }

        location /undefined/  {
        proxy_pass http://s11.s100.vip:35053;
        proxy_redirect default;
	   rewrite ^/undefined/(.*) /$1 break;
    	   }

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}
    }




    # another virtual host using mix of IP-, name-, and port-based configuration
    #
    #server {
    #    listen       8000;
    #    listen       somename:8080;
    #    server_name  somename  alias  another.alias;

    #    location / {
    #        root   html;
    #        index  index.html index.htm;
    #    }
    #}


    # HTTPS server
    #
    server {
        listen       443 ssl;
        server_name  localhost;

        ssl_certificate      cert.pem;
        ssl_certificate_key  cert.key;

        ssl_session_cache    shared:SSL:1m;
        ssl_session_timeout  5m;

        ssl_ciphers  HIGH:!aNULL:!MD5;
        ssl_prefer_server_ciphers  on;

        location / {
            root   html;
            index  index.html index.htm;
        }

        location /undefined/  {
        proxy_pass http://s11.s100.vip:35053;
        proxy_redirect default;
	   rewrite ^/undefined/(.*) /$1 break;
    	   }
    }

}

        2. Previous docker configuration files

user  nginx;
worker_processes  auto;

error_log  /var/log/nginx/error.log notice;
pid        /var/run/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;

    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;

    keepalive_timeout  65;

    #gzip  on;

    include /etc/nginx/conf.d/*.conf;

    server {
    listen       80;
    listen  [::]:80;
    server_name  www.slgstu.top;
	#将所有HTTP请求通过rewrite指令重定向到HTTPS。
#    rewrite ^(.*)$ https://$host$1;
    #access_log  /var/log/nginx/host.access.log  main;

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
    }

    
    location /undefined/  {
        proxy_pass http://s11.s100.vip:35053;
        proxy_redirect default;
	   rewrite ^/undefined/(.*) /$1 break;
    }


    #error_page  404              /404.html;

    # redirect server error pages to the static page /50x.html
    #
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }

    # proxy the PHP scripts to Apache listening on 127.0.0.1:80
    #
    #location ~ \.php$ {
    #    proxy_pass   http://127.0.0.1;
    #}

    # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
    #
    #location ~ \.php$ {
    #    root           html;
    #    fastcgi_pass   127.0.0.1:9000;
    #    fastcgi_index  index.php;
    #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
    #    include        fastcgi_params;
    #}

    # deny access to .htaccess files, if Apache's document root
    # concurs with nginx's one
    #
    #location ~ /\.ht {
    #    deny  all;
    #}
}

server {
     #HTTPS的默认访问端口443。
     #如果未在此处配置HTTPS的默认访问端口，可能会造成Nginx无法启动。
     listen 443 ssl;
     
     #填写证书绑定的域名
     server_name www.slgstu.top;
 
     #填写证书文件名称
     ssl_certificate cert/www.slgstu.top.cer;
     #填写证书私钥文件名称
     ssl_certificate_key cert/www.slgstu.top.key;
 
     ssl_session_cache    shared:SSL:1m;
    ssl_session_timeout  5m;
 
     # 指定密码为openssl支持的格式
     ssl_protocols  SSLv2 SSLv3 TLSv1.2;
 
     ssl_ciphers  HIGH:!aNULL:!MD5;  # 密码加密方式
     ssl_prefer_server_ciphers  on;   # 依赖SSLv3和TLSv1协议的服务器密码将优先于客户端密码
 
 
    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
    }
}
    
}

                3. Explain the file function of nginx

                        cert: two files containing https certificates

                        conf: Some configuration files of nginx, mainly nginx.conf

                        html: By default, nginx will load index.html under the html file.

                        log: View success and error logs