主頁 > 知識庫 > 本地通過nginx配置反向代理的全過程記錄

本地通過nginx配置反向代理的全過程記錄

熱門標(biāo)簽:地圖標(biāo)注小程序 信陽電銷外呼系統(tǒng)怎么樣 陜西辦理400電話 貴陽網(wǎng)絡(luò)外呼系統(tǒng)軟件 南充電銷外呼系統(tǒng) 海外工廠地圖標(biāo)注 宿州外呼系統(tǒng)公司 株洲電銷 南昌外呼系統(tǒng)定制

前言

Nginx是一款輕量級的HTTP服務(wù)器,采用事件驅(qū)動的異步非阻塞處理方式框架,這讓其具有極好的IO性能。我們在日常開發(fā)中使用到Nginx的主要有以下幾個場景:

  • Nginx作為http服務(wù)器
  • 跨域請求
  • 負(fù)載均衡
  • 網(wǎng)絡(luò)資源的動靜分離

作為前端,我們主要是關(guān)注前兩個場景

一、下載安裝

點此下載 ,下載完成后解壓,解壓后文件如下:

解壓(雙擊nginx.exe,雙擊后一個黑色的彈窗一閃而過)

找到nginx解壓目錄下,鼠標(biāo)右鍵,找到git bash打開,輸入命令start ./nginx.exe回車即啟動了nginx服務(wù).

**檢查是否啟動成功:**直接在瀏覽器地址欄輸入網(wǎng)址http://localhost,回車,出現(xiàn)以下頁面說明啟動成功

二、nginx配置

找到nginx下的conf/nginx.conf文件,設(shè)置代理相關(guān)信息,重點是server{}中的內(nèi)容

#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_names_hash_bucket_size 128;
 server {
 listen 80;
 server_name localhost;
 location / {
  root html;
  index index.html index.htm;
 }
 error_page 500 502 503 504 /50x.html;
 location = /50x.html {
  root html;
 }
 }

 server {
 listen 80;
 server_name test-local.juejin.com;
 # 這里是你要代理的測試環(huán)境域名加上-local
 # 比如你的項目測試環(huán)境為a.test.com,你本地此處可以設(shè)置為a-local.test.com,當(dāng)然你可以隨便設(shè)置

 location /{
  add_header 'Access-Control-Allow-Origin' '*';
  add_header 'Access-Control-Allow-Credentials' 'true';
  add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
  add_header 'Access-Control-Allow-Headers' 'DNT,web-token,app-token,Authorization,Accept,Origin,Keep-Alive,User-Agent,X-Mx-ReqToken,X-Data-Type,X-Auth-Token,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
  add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
  # 此處8091是我們本地運(yùn)行項目的端口號,設(shè)置成跟你本地起的服務(wù)端口號一樣就行
  proxy_pass http://127.0.0.1:8091/;
 }
 }
}

三、本機(jī)dns配置

**修改本地host文件配置,**找到目錄C:\Windows\System32\drivers\etc,打開hosts文件,修改文件,加入127.0.0.1 a-local.test.com

四、運(yùn)行

先輸入./nginx.exe -t檢查nginx配置是否正確,正確如下圖:

繼續(xù)輸入nginx -s reload重啟(nginx配置文件修改后都要重啟nginx才會生效)

刷新dns: ipconfig /flushdns

在瀏覽器中輸入http://a-local.test.com, 你將會看到你本地運(yùn)行的代碼界面

五、常用的nginx命令

  • 幫助命令:nginx -h
  • 啟動Nginx服務(wù)器 :start nginx
  • 配置文件路徑:/usr/local/nginx/conf/nginx.conf
  • 檢查配置文件:nginx -t
  • 停止服務(wù):nginx -s stop
  • 退出服務(wù)(處理完所有請求后再停止服務(wù)):nginx -s quit
  • 重新加載配置文件:nginx -s reload
  • 顯示版本信息并退出  nginx -v 
  • 殺死所有nginx進(jìn)程  killall nginx 

六、跨域請求

前后端分離的項目中由于前后端項目分別部署到不同的服務(wù)器上,我們首先遇到的問題就是跨域,在這個場景我們下nginx可以幫助我們很好地解決這個問題

#跨域請求server
server{
	listen 9000;
	server_name 127.0.0.1; # 或者設(shè)置為本機(jī)ip
	root /app/crossDomain/;
	index index.html;
	
	location /douban/ { #添加訪問目錄為/api的代理配置
		rewrite ^/api/(.*)$ /$1 break;
		proxy_pass http://a.test.com;
 }
}

總結(jié)

到此這篇關(guān)于本地通過nginx配置反向代理的文章就介紹到這了,更多相關(guān)本地通過nginx配置反向代理內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

標(biāo)簽:玉林 石嘴山 三明 開封 晉城 汕頭 鄭州 拉薩

巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《本地通過nginx配置反向代理的全過程記錄》,本文關(guān)鍵詞  本地,通過,nginx,配置,反向,;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題,煩請?zhí)峁┫嚓P(guān)信息告之我們,我們將及時溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無關(guān)。
  • 相關(guān)文章
  • 下面列出與本文章《本地通過nginx配置反向代理的全過程記錄》相關(guān)的同類信息!
  • 本頁收集關(guān)于本地通過nginx配置反向代理的全過程記錄的相關(guān)信息資訊供網(wǎng)民參考!
  • 推薦文章