Configuration nginx Configuration du certificat SSL Accès https au site super détaillé (code source de configuration supplémentaire + tutoriel de configuration graphique)

Récemment, j'ai acheté un serveur cloud sur Alibaba Cloud et je vais créer un ensemble de programmes Java. Lors de Nginxla configuration du certificat SSL, le frontal peut être ouvert normalement avec https une fois configuré, mais je ne peux pas accéder au back-end. Je sais clairement que c'est Niginxune configuration. Le problème, mais je ne sais pas ce qui ne va pas, le sentiment dans mon cœur à ce moment-là est vraiment indescriptible...

Il a été retrouvé après enquête 前端访问后端在nginx中做转发代理时,localhost ~^api 地址配置错了. Quelle est la raison spécifique, comme indiqué ci-dessous
 ? Remarque :本篇文章主要讲的是Nginx配置实现https的形式进行访问网站,如果有的博主遇到Nginx配置访问网站404、SSL证书在哪获取等问题,私信我,不收取任何费用,我会一一的教你如何去解决,欢迎大家打扰

Code source de configuration de Nginx

Regardons d'abord mon code source de configuration :
j'ai marqué les endroits qui doivent être modifiés dans ce code source. Avant de le configurer pour httpaccéder au nom de domaine via la méthode, il n'y a pas de problème, mais lorsque j'y accède https, il apparaît qu'il n'est pas accessible. Le problème du back-end, en fait, mon problème n'est pas dans la configuration de nginx, mais dans le code front-end lors de l'accès à l'API back-end, l'adresse est fausse
注意:如果你按照我的这种方式进行配置的,确保云服务器中已经添加配置了443和80端口,如果安装了宝塔,宝塔里面也需要添加配置一下这两个端口(不知道怎么配,或者不明白的,私信我!)

user  www www;
worker_processes auto;
error_log  /www/wwwlogs/nginx_error.log  crit;
pid        /www/server/nginx/logs/nginx.pid;
worker_rlimit_nofile 51200;

stream {
    
    
    log_format tcp_format '$time_local|$remote_addr|$protocol|$status|$bytes_sent|$bytes_received|$session_time|$upstream_addr|$upstream_bytes_sent|$upstream_bytes_received|$upstream_connect_time';
  
    access_log /www/wwwlogs/tcp-access.log tcp_format;
    error_log /www/wwwlogs/tcp-error.log;
    include /www/server/panel/vhost/nginx/tcp/*.conf;
}

events
    {
        use epoll;
        worker_connections 51200;
        multi_accept on;
    }

http
    {
        include       mime.types;
        #include luawaf.conf;

        include proxy.conf;

        default_type  application/octet-stream;

        server_names_hash_bucket_size 512;
        client_header_buffer_size 32k;
        large_client_header_buffers 4 32k;
        client_max_body_size 50m;

        sendfile   on;
        tcp_nopush on;

        keepalive_timeout 60;

        tcp_nodelay on;

        fastcgi_connect_timeout 300;
        fastcgi_send_timeout 300;
        fastcgi_read_timeout 300;
        fastcgi_buffer_size 64k;
        fastcgi_buffers 4 64k;
        fastcgi_busy_buffers_size 128k;
        fastcgi_temp_file_write_size 256k;
        fastcgi_intercept_errors on;

        gzip on;
        gzip_min_length  1k;
        gzip_buffers     4 16k;
        gzip_http_version 1.1;
        gzip_comp_level 2;
        gzip_types     text/plain application/javascript application/x-javascript text/javascript text/css application/xml;
        gzip_vary on;
        gzip_proxied   expired no-cache no-store private auth;
        gzip_disable   "MSIE [1-6]\.";

        limit_conn_zone $binary_remote_addr zone=perip:10m;
        limit_conn_zone $server_name zone=perserver:10m;

        server_tokens off;
        access_log off;

    server {
        listen 80;
        listen 443 ssl http2;
        server_name  这里填你的域名地址;
        add_header Content-Security-Policy upgrade-insecure-requests;
        
        if ($server_port !~ 443){
          rewrite ^(/.*)$ https://$host$1 permanent;
        }
        
        # 证书地址
        ssl_certificate  这里填你的SSL证书地址.pem结尾那个文件;
        ssl_certificate_key 这里填你的SSL证书地址.key结尾那个文件;
        ssl_prefer_server_ciphers on;
        
        gzip on;
        gzip_vary on;
        gzip_comp_level 9;
        gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
        gzip_disable "MSIE [1-6]\.";
        gzip_min_length 2048;
        
      location / {
            root   这个地方填存放前端dist文件地址; 
            index  index.html index.htm;
            try_files $uri $uri/ /index.html;
        }
        
        location ^~ /api/ {
          proxy_pass 这个地方填存放后端地址;# 我的是服务器公网IP+后端端口号
          proxy_read_timeout 1800s;
          proxy_set_header Upgrade $http_upgrade;
          proxy_set_header Connection "Upgrade"; 
        }
    }
include /www/server/panel/vhost/nginx/*.conf;
}

mon point d'erreur

J'utilise le front-end ant design vueet je l'ai configuré comme ça avant .env.production
这种方式http是可以正常访问的,我在配置htts访问时,根本没有想到需在修改一下这个地方,我当时想http可以访问https应该也可以,就没有这个地址
原因:因为之前nginx中api配置的是IP地址+后端端口号,前端请求Nginx打到localhost上,通过.env.production文件中配置的IP地址+后端端口号直接去服务器中找这个后端端口号了,没有走nginx中api配置,因为我是用的服务器公网IP+端口号,只要服务器中这个端口号下对应的进程在运行就可以访问到的后端

VUE_APP_API_BASE_URL=http://服务器公网IP:端口号/jeecg-boot/

现在当我改成https访问时,我是用过域名的形式进行访问,在Nginx配置中server_name 指定的域名和访问后端Api地址中的域名一致

VUE_APP_API_BASE_URL=https://域名/api/jeecg-boot

注意:如果你现在是想直接在Nginx配置https进行访问,需要注意的点有

  1. Assurez-vous que le fichier du certificat SSL a été téléchargé, les deux fichiers .pem et .key
  2. Assurez-vous qu'il est lié au certificat du fichier SSL téléchargé (le certificat SSL que vous avez téléchargé est lié à votre nom de domaine)
  3. Ouvrez les ports 80 et 443 et configurez-les sur le serveur cloud. Si le panneau pagode est installé, il faut également ouvrir les 443 et 80 dans la pagode (si la pagode n'est pas configurée, elle sera toujours chargée et inaccessible)
  4. La configuration du fichier de configuration dans le code front-end (identique à l'erreur que j'ai rencontrée, cette pièce peut être un peu difficile à comprendre)

    上面的这几种在配置时需要注意的几个点,以上有不明白的或者不知道怎么配置的,私信我,免费配置及解答,24小时在线!

Guess you like

Origin blog.csdn.net/xiaohua616/article/details/132492827