資訊專欄INFORMATION COLUMN
摘要：還是回到萬能的文件，添加匹配規(guī)則實現(xiàn)代理轉發(fā)設置代理轉發(fā)通過上面的設置，在重啟服務，可以讓頁面中所有包含字段的請求都轉為由服務器去向地址發(fā)送請求，從而巧妙的解決了瀏覽器的跨域問題。
1.Nginx入門與基本操作篇 注：由于服務器是windows系統(tǒng)，所以本文主要講解Nginx在windows下的操作。
首先下載Nginx
解壓縮，我們所有的配置基本都在萬能的 nginx/conf/nginx.conf 中完成，其它文件可以不用理
關于nginx.conf
...
#需要我們按需要修改的一般只有中間server里的代碼
server {
# 設置監(jiān)聽端口
listen 9000;
server_name localhost;
# 設置靜態(tài)資源路徑，如下設置打輸入地址時會打開H盤app/dist下的index頁面
location / {
root H:/app/dist;
index index.html;
}
# 報錯頁面，同上根據(jù)需要設置，也可不理
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
...
這樣一個簡單服務的配置就完成了，啟動服務訪問 http://localhost:9000 即可打開對應網(wǎng)頁，如果需要啟動多個服務，只需多添加server配置后重啟即可。
幾個常用的操作指令(以下指令請在nginx文件目錄下使用)
# 啟動nginx(我的情況是運行起來后cmd就輸入不了其它指令了，需要在打開一個cmd來操作)
nginx.exe
# 修改nginx.conf文件后重啟nginx
nginx.exe -s reload
# 暫停nginx服務
nginx.exe -s stop
# 有時暫停服務失效，需要強制終止nginx進程 注：/f 強制執(zhí)行
taskkill /im nginx.exe /f
2.反向代理解決跨域問題
通常開發(fā)環(huán)境可以通過設置proxy解決跨域問題，而生產(chǎn)環(huán)境下要么把前端項目放在后端項目里，要么設置cor解決跨域問題，前者不利于前后端分離，后者需要后端配置，而現(xiàn)在使用nginx做啟動服務設置反向代理可以很好解決跨域問題。
還是回到萬能的nginx.conf文件，添加location匹配規(guī)則實現(xiàn)代理轉發(fā)
server {
listen 9000;
server_name localhost;
location / {
root H:/app/dist;
index index.html;
}
#設置代理轉發(fā)
location /api/ {
proxy_pass http://localhost:9600/;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
通過上面的設置，在重啟服務，可以讓頁面中所有包含 /api/ 字段的請求都轉為由服務器去向http://localhost:9600/地址發(fā)送請求，從而巧妙的解決了瀏覽器的跨域問題。
怎么樣，是不是很簡單，快動手配置是試試吧(^_^)~
文章版權歸作者所有，未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉載請注明本文地址：http://systransis.cn/yun/40321.html
摘要：本文將針對使用生態(tài)開發(fā)完成的網(wǎng)站，以版本為基礎兼容目標，實現(xiàn)全功能正常使用的全面兼容解決方案。這樣做的目的，是逐步減少全局性方法，使得語言逐步模塊化。此外，使用這個，一旦頁面不處于瀏覽器的當前標簽，就會自動停止刷新。 前言 背景情況 vue - 2.5.11 vue-cli 使用模板 webpack-simple http請求：axios Vue 官方對于 ie 瀏覽器版本兼容情...
摘要：基本入門前端掘金作者本文屬于翻譯文章，原文鏈接為。如果如何把應用放在容器中運行掘金本文適合零基礎，且希望使用運行應用的人士。后端掘金使用構建網(wǎng)站。 nginx 基本入門 - 前端 - 掘金作者：villainthr 本文屬于翻譯文章，原文鏈接為 nginx Beginner’s Guide。是至今為止見過最好的 nginx 入門文章。額。。。沒有之一。 這篇教程簡單介紹了 nginx ...
摘要：本文同步在個人博客上，歡迎關注這篇文章整理了在前端開發(fā)中，在開發(fā)環(huán)境下使用重寫及代理功能的方法。表示該規(guī)則是使用正則定義的，區(qū)分大小寫。因此牢記在上下文中使用，而在上下文中使用。 本文同步在個人博客shymean.com上，歡迎關注 這篇文章整理了在前端開發(fā)中，在開發(fā)環(huán)境下使用nginx重寫uri及代理功能的方法。 參考 nginx中文文檔 前端開發(fā)者必備的 Nginx 知識 Ngin...
閱讀 1867·2021-09-22 15:45
閱讀 1652·2019-08-30 15:55
閱讀 1838·2019-08-29 11:16
閱讀 3312·2019-08-26 11:44
閱讀 714·2019-08-23 17:58
閱讀 2702·2019-08-23 12:25
閱讀 1636·2019-08-22 17:15
閱讀 3614·2019-08-22 16:09
