Nginx는 프런트엔드 및 백엔드 분리 서비스와 구성 지침을 배포합니다.

이 글은 주로 Nginx 배포를 위한 프론트엔드와 백엔드 분리 서비스와 구성 지침을 소개합니다. 이제 필요한 친구들이 참고할 수 있도록 공유하겠습니다.

Nginx 설치

CentOS 7 서버의 yum 명령 Nginx 설치:

sudo yum install -y nginxsudo yum install -y nginx

配置Nginx

文件位置

一般nginx配置文件在etc目录下，也可以执行命令rpm -ql nginx查看路径。

切换至/etc/nginx目录后，可以看到nginx.conf这个配置文件。
执行 vi nginx.conf即可打开配置文件。

vim 常用命令

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

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;
        }
        
    } 
}

部署前后端分离项目

在前后端分离端项目里，前端的代码会被打包成为纯静态文件。使用 Nginx的目的就是让静态文件运行起服务，由于后端的接口也是分离的，直接请求可能会产生跨域问题，此时就需要Nginx转发代理后端接口。

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;
        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;
        }
    }    
}

• 将前端代码打包后的dist文件放入指定服务目录

• 将服务目录指定到spa-project/dist目录下即可代理静态服务

• 配置里开启了gzip压缩，可以很大程度上减小文件体积大小

• 将404错误页面重定向到index.html，可以解决前端history路由模式由于刷新页面访问不到服务出现404的问题

• location为代理接口，可以转发代理后端的请求接口域名或者ip，即可解决接口跨域问题

启动Nginx服务

当完成配置后即可启动nginx
执行nginx -t，可以测试Nginx的配置是否正确。
执行nginx，在配置文件正确的情况下即可启动nginx服务。
修改nginx配置文件后执行nginx -s reload

Configure Nginx

File location

일반적으로 nginx 구성 파일은 etc에 있습니다. code> 디렉토리에 있으며 rpm -ql nginxvi nginx.conf를 실행하여 구성 파일을 엽니다. vim 일반 명령command

명령을 실행할 수도 있습니다. 경로를 확인하세요.	/etc/nginx 디렉터리로 전환하면 nginx.conf 구성 파일을 볼 수 있습니다.
Function
i	다음부터 입력 시작
a	커서 Content
Esc	입력 모드 종료
u	비입력 모드에서 이전 작업 취소
:w	비입력 모드에서 저장

:wq

비입력 모드에서, 저장하고 닫기

:q
닫기(저장됨)

:q!

저장하지 말고 강제로 닫으세요

🎜🎜Nginx 구성 지침🎜🎜rrreee🎜프론트 엔드 및 백 배포- end 분리 프로젝트🎜🎜 프론트엔드와 백엔드 분리된 프로젝트에서는 프론트엔드 코드가 순수 정적 파일로 패키징됩니다. Nginx를 사용하는 목적은 백엔드 인터페이스도 분리되어 있기 때문에 정적 파일이 서비스를 실행할 수 있도록 하는 것입니다. 이 경우 직접 요청으로 인해 프록시 백엔드 인터페이스를 전달해야 하는 경우 Nginx가 필요합니다. 🎜🎜🎜Nginx 구성은 다음과 같습니다🎜🎜rrreee

• 🎜프론트엔드 코드와 함께 패키징된 dist 파일을 지정된 서비스 디렉토리에 넣어주세요 🎜
• 🎜정적 서비스를 프록시하려면 spa-project/dist 디렉터리에 서비스 디렉터리를 지정하세요.🎜
• 🎜Gzip 압축은 구성에서 활성화됩니다. 작은 파일 크기를 대폭 줄일 수 있습니다🎜
• 🎜404 오류 페이지를 index.html로 리디렉션하면 프런트 엔드 히스토리 라우팅 모드에서 새로 고침 시 서비스에 접근할 수 없어 발생하는 404 문제를 해결할 수 있습니다. 페이지🎜
• 🎜 location는 프록시 인터페이스로, 요청 인터페이스 도메인 이름이나 프록시 백엔드의 IP를 전달하여 인터페이스 교차 도메인 문제를 해결할 수 있습니다🎜

🎜Nginx 서비스 시작🎜🎜구성 완료 후 nginx를 시작하고 nginx -t를 실행하여 Nginx 구성이 올바른지 테스트할 수 있습니다. 🎜nginx를 실행하고, 구성 파일이 올바르면 nginx 서비스를 시작할 수 있습니다. 🎜nginx 구성 파일을 수정한 후 nginx -s reload를 실행하여 원활한 전환을 완료하고 구성을 다시 로드하세요. 🎜🎜🎜Nginx 일반 명령🎜🎜🎜🎜🎜🎜Command🎜🎜Description🎜🎜🎜🎜🎜 🎜nginx -h 🎜🎜Nginx 도움말 보기🎜🎜🎜🎜nginx -v🎜🎜Nginx 버전 보기🎜🎜🎜🎜nginx -t🎜🎜Nginx 구성 테스트🎜🎜🎜🎜nginx -T🎜🎜Test N ginx 구성 및 인쇄 구성 정보 🎜 🎜🎜🎜nginx🎜🎜Start nginx🎜🎜🎜🎜nginx -s reload🎜🎜구성 파일을 다시 로드하고 nginx를 원활하게 시작하세요🎜🎜🎜🎜nginx -s stop🎜🎜nginx 명령 중지🎜🎜🎜 🎜위 내용은 요약입니다. 이 글의 모든 내용이 모든 분들의 학습에 도움이 되었으면 좋겠습니다. 더 많은 관련 내용을 보시려면 PHP 중국어 홈페이지를 주목해주세요! 🎜🎜관련 권장 사항: 🎜🎜🎜Nginx는 바인딩되지 않은 도메인 이름을 설정하여 액세스를 금지합니다🎜🎜🎜🎜🎜nginx는 역방향 프록시 및 로드 밸런싱을 구현합니다🎜🎜🎜🎜🎜Nginx는 정적 페이지를 배포합니다🎜🎜

위 내용은 Nginx는 프런트엔드 및 백엔드 분리 서비스와 구성 지침을 배포합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!