Nginx déploie des services de séparation front-end et back-end et des instructions de configuration

Cet article présente principalement les services de séparation front-end et back-end et les instructions de configuration pour le déploiement de Nginx. Il a une certaine valeur de référence. Maintenant, je le partage avec vous. Les amis dans le besoin peuvent s'y référer

. Installation de Nginx

Utilisez la commande yum pour installer Nginx sur le serveur CentOS 7 :

sudo yum install -y nginx

Configurer Nginx

Emplacement du fichier

Généralement, le fichier de configuration nginx se trouve dans le répertoire etc Vous pouvez également exécuter la commande rpm -ql nginx pour afficher le chemin.

Après être passé au répertoire /etc/nginx, vous pouvez voir le fichier de configuration nginx.conf.
Exécutez vi nginx.conf pour ouvrir le fichier de configuration.

Commandes communes vim

命令	作用
i	光标前面开始输入内容
a	光标后面开始输入内容
Esc	退出输入模式
u	在非输入模式下撤销上一步操作
:w	在非输入模式下,保存
:wq	在非输入模式下,保存并关闭
:q	关闭（已保存）
:q!	不保存,强制关闭

Instructions de configuration Nginx

# For more information on configuration, see:
#   * Official English Documentation: http://nginx.org/en/docs/
#   * Official Russian Documentation: http://nginx.org/ru/docs/

user nginx;
worker_processes auto; #启动进程
error_log /var/log/nginx/error.log; #全局错误日志
pid /run/nginx.pid; #PID文件

# Load dynamic modules. See /usr/share/nginx/README.dynamic.
include /usr/share/nginx/modules/*.conf;

events {
    worker_connections 1024; #单个后台worker process进程的最大并发链接数 
}

http {
    gzip on; #开启gzip压缩
    gzip_min_length 1k; #设置对数据启用压缩的最少字节数
    gzip_buffers    4 16k;
    gzip_http_version 1.0;
    gzip_comp_level 6; #设置数据的压缩等级,等级为1-9，压缩比从小到大
    gzip_types text/plain text/css text/javascript application/json application/javascript application/x-javascript application/xml; #设置需要压缩的数据格式
    gzip_vary on;

    #虚拟主机配置
    server {
        listen       80 default_server; #侦听80端口,并为默认服务,default_server只能有一个
        server_name  www.binlive.cn binlive.cn; #服务域名,可以有多个,用空格隔开
        
        location /{
            proxy_pass http://127.0.0.1:3000; #代理本机3000端口服务
            proxy_set_header  Host              $http_host;   # required for docker client's sake
            proxy_set_header  X-Real-IP         $remote_addr; # 获取用户的真实IP地址
            proxy_set_header  X-Forwarded-For   $proxy_add_x_forwarded_for;
            proxy_set_header  X-Forwarded-Proto $scheme;
            proxy_read_timeout                  900;
        }
        # 图片缓存时间设置
        location ~ .*.(gif|jpg|jpeg|png|bmp|swf)$ {
            expires 10d;
        }
        # JS和CSS缓存时间设置
        location ~ .*.(js|css)?$ {
            expires 1h;
        }
        # 404定义错误提示页面
        error_page 404             /404.html;
        # 500定义错误提示页面
        error_page   500 502 503 504 /50x.html;
        
    }
    server {
        listen       80;
        server_name  admin.binlive.cn;
        location /{
            proxy_pass http://127.0.0.1:3080;
            proxy_set_header  Host              $http_host;   # required for docker client's sake
            proxy_set_header  X-Real-IP         $remote_addr; # pass on real client's IP
            proxy_set_header  X-Forwarded-For   $proxy_add_x_forwarded_for;
            proxy_set_header  X-Forwarded-Proto $scheme;
            proxy_read_timeout                  900;
        }
        
    } 
}

Déployer le front-end et le back-end projets de séparation

Dans les projets séparés front-end et back-end, le code front-end sera empaqueté dans des fichiers statiques purs. Le but de l'utilisation de Nginx est de permettre aux fichiers statiques d'exécuter des services. Étant donné que l'interface back-end est également séparée, les requêtes directes peuvent provoquer des problèmes entre domaines. Dans ce cas, Nginx doit transférer l'interface back-end du proxy.

La configuration de Nginx est la suivante

# For more information on configuration, see:
#   * Official English Documentation: http://nginx.org/en/docs/
#   * Official Russian Documentation: http://nginx.org/ru/docs/

user nginx;
worker_processes auto; #启动进程
error_log /var/log/nginx/error.log; #全局错误日志
pid /run/nginx.pid; #PID文件

# Load dynamic modules. See /usr/share/nginx/README.dynamic.
include /usr/share/nginx/modules/*.conf;

events {
    worker_connections 1024; #单个后台worker process进程的最大并发链接数 
}

http {
    gzip on; #开启gzip压缩
    gzip_min_length 1k; #设置对数据启用压缩的最少字节数
    gzip_buffers    4 16k;
    gzip_http_version 1.0;
    gzip_comp_level 6; #设置数据的压缩等级,等级为1-9，压缩比从小到大
    gzip_types text/plain text/css text/javascript application/json application/javascript application/x-javascript application/xml; #设置需要压缩的数据格式
    gzip_vary on;

    #虚拟主机配置
    server {
        listen       80;
        server_name  mark.binlive.cn;
        root /home/spa-project/dist; #定义服务器的默认网站根目录位置
        index index.html; #定义index页面
        error_page    404         /index.html; #将404错误页面重定向到index.html可以解决history模式访问不到页面问题
        location ^~ /api/{
            proxy_pass http://127.0.0.1:7000;
            proxy_send_timeout 1800;
            proxy_read_timeout 1800;
            proxy_connect_timeout 1800;
            client_max_body_size 2048m;
            proxy_http_version 1.1;  
            proxy_set_header Upgrade $http_upgrade;  
            proxy_set_header Connection "Upgrade"; 
            proxy_set_header  Host              $http_host;   # required for docker client's sake
            proxy_set_header  X-Real-IP         $remote_addr; # pass on real client's IP
            proxy_set_header  X-Forwarded-For   $proxy_add_x_forwarded_for;
            proxy_set_header  X-Forwarded-Proto $scheme;
        }
        location ^~ /auth/{
            proxy_pass http://127.0.0.1:7000;
            proxy_send_timeout 1800;
            proxy_read_timeout 1800;
            proxy_connect_timeout 1800;
            client_max_body_size 2048m;
            proxy_http_version 1.1;  
            proxy_set_header Upgrade $http_upgrade;  
            proxy_set_header Connection "Upgrade"; 
            proxy_set_header  Host              $http_host;   # required for docker client's sake
            proxy_set_header  X-Real-IP         $remote_addr; # pass on real client's IP
            proxy_set_header  X-Forwarded-For   $proxy_add_x_forwarded_for;
            proxy_set_header  X-Forwarded-Proto $scheme;
        }
    }    
}

• Placez le fichier dist empaqueté par le code frontal dans le répertoire de service spécifié

• Attribuer le répertoire de service au répertoire spa-project/dist pour proxyer le service statique

• La compression gzip est activée dans la configuration, ce qui peut grandement réduire la taille du fichier Taille

• Rediriger la page d'erreur 404 vers index.html, ce qui peut résoudre le problème du 404 dans le mode de routage de l'historique front-end en raison de l'impossibilité d'accéder au service lors de l'actualisation de la page

• location est une interface proxy, qui peut transmettre le nom de domaine de l'interface de demande ou l'adresse IP du backend proxy pour résoudre le problème inter-domaines de l'interface

Démarrez le service Nginx

Après avoir terminé la configuration, vous pouvez démarrer nginx
et exécuter nginx -t pour tester si la configuration de Nginx est correcte.
Exécutez nginx pour démarrer le service nginx si le fichier de configuration est correct.
Après avoir modifié le fichier de configuration nginx, exécutez nginx -s reload pour terminer la transition en douceur et recharger la configuration

Commandes communes Nginx

命令	描述
nginx -h	查看Nginx的帮助
nginx -v	查看Nginx的版本
nginx -t	测试Nginx的配置
nginx -T	测试Nginx的配置，并打印配置信息
nginx	启动nginx
nginx -s reload	重新加载配置文件，平滑启动nginx
nginx -s stop	停止nginx的命令

Ce qui précède est Tout le contenu de cet article, j'espère qu'il sera utile à l'apprentissage de chacun. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois !

Recommandations associées :

Nginx définit les noms de domaine non liés pour interdire l'accès

nginx implémente le proxy inverse et l'équilibrage de charge

Nginx déploie des pages statiques

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!