資訊專欄INFORMATION COLUMN
摘要：最近開發(fā)時(shí)，遇到需要使用同一域名承載多個(gè)前端項(xiàng)目的場景，具體需求如下訪問新版本前端項(xiàng)目訪問后端接口服務(wù)訪問默認(rèn)前端項(xiàng)目配置內(nèi)容注意的配置。此時(shí)，可以通過對(duì)新版前端文件中的進(jìn)行配置，以規(guī)避這一問題注該方法僅適用于構(gòu)建的項(xiàng)目參考鏈接
1. Nginx 配置內(nèi)容最近開發(fā)時(shí)，遇到需要使用同一域名承載多個(gè)前端項(xiàng)目的場景，具體需求如下：
/v2 訪問新版本前端項(xiàng)目
/api 訪問后端 Spring Boot 接口服務(wù)
/ 訪問默認(rèn)前端項(xiàng)目
server {
listen 80;
listen [::]:80;
server_name _;
server_name_in_redirect off;
proxy_set_header Host $host;
location /api {
proxy_pass http://0.0.0.0:0000;
}
location / {
index index.html;
root /path/to/main/web/app;
}
location /v2 {
index index.html;
alias /path/to/v2/web/app;
}
}
注意 Nginx 的 alias 配置。此時(shí)，新前端項(xiàng)目需要被放在 /path/to/v2/web/app 路徑下。
2. 修改 publicPath 配置僅僅通過上述配置，在訪問新版前端時(shí)，會(huì)遇到資源文件無法找到的問題。
此時(shí)，可以通過對(duì)新版前端 vue.config.js 文件中的 publicPath 進(jìn)行配置，以規(guī)避這一問題（ 注：該方法僅適用于 Vue-Cli 3.x 構(gòu)建的項(xiàng)目 ）：
module.exports = {
...
publicPath: "/v2/",
...
};
參考鏈接
Understanding the difference between the root and alias directives in Nginx；
Can"t get two single page applications to run together on one server using nginx；
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/40491.html
摘要：基本配置備忘從屬于筆者的服務(wù)端應(yīng)用程序入門與實(shí)踐，更多知識(shí)體系參閱我的技術(shù)體系結(jié)構(gòu)圖。有每個(gè)進(jìn)程的最大連接數(shù)，選取哪種事件驅(qū)動(dòng)模型處理連接請(qǐng)求，是否允許同時(shí)接受多個(gè)網(wǎng)路連接，開啟多個(gè)網(wǎng)絡(luò)連接序列化等。配置用戶或者組，默認(rèn)為。 [Nginx基本配置備忘]()從屬于筆者的服務(wù)端應(yīng)用程序入門與實(shí)踐，更多知識(shí)體系參閱2016:我的技術(shù)體系結(jié)構(gòu)圖:Web/ServerSideApplicatio...
摘要：所以單頁應(yīng)用的部署，需要將所有的頁面請(qǐng)求都返回，瀏覽器下載了后會(huì)自動(dòng)解析并導(dǎo)航到對(duì)應(yīng)頁面?？偨Y(jié)單頁應(yīng)用與以前的常規(guī)多頁面應(yīng)用還是有區(qū)別的，開發(fā)過程與后端解耦了，同時(shí)會(huì)出現(xiàn)跨域鑒權(quán)以及應(yīng)用部署的問題。 本文同步發(fā)布于我的個(gè)人博客上 - 單頁應(yīng)用的部署方案 本文主要簡單講一下單頁應(yīng)用的開發(fā)及部署方法，默認(rèn)你懂一些服務(wù)端知識(shí)及nginx知識(shí)，如果有任何可以在下方評(píng)論留言。 單頁應(yīng)用 SPA（...
摘要：凡事有例外，以下分別對(duì)待不同情況服務(wù)器端配置即可客戶端配置，這樣大部分瀏覽器都支持跨域了，反正新版本下無問題。但放在默認(rèn)設(shè)置下依然出現(xiàn)無法獲取的問題，至此，查資料查到解決存取的跨域問題，依照文中記載，在追加的響應(yīng)頭，解決了下的問題。 一般在生產(chǎn)環(huán)境下盡量可以通過nginx等反向代理，把vue前端和api接口處理成同一端口和域名。 在開發(fā)和測(cè)試時(shí)，也可以使用兼容性比較好的瀏覽器進(jìn)行。 凡...
閱讀 2784·2023-04-25 17:58
閱讀 3045·2021-11-15 11:38
閱讀 2452·2021-11-02 14:48
閱讀 1263·2021-08-25 09:40
閱讀 1902·2019-08-30 15:53
閱讀 1162·2019-08-30 15:52
閱讀 1082·2019-08-30 13:55
閱讀 2506·2019-08-29 15:21
