繼續上一篇的nuxt/express項目部署,還是windows上要把nuxt的服務端渲染項目跑起來,這次的目的是用已經有的域名windows服務器上一個虛擬目錄反向代理部署在其他端口nuxt項目。
情況說明:
1.現有的服務器只有windows server的服務器
2.服務器IIS已經部署了多個站點,80端口毫無疑問被占用
嘗試的方案:
1.nginx使用虛擬目錄監聽80端口,反向代理本地其他端口,例如需要的3000端口,nginx的服務無法啟動,80端口已經被占用
2.iis有個iisnode可以直接運行node.js的環境,這個嘗試過寫個express的demo,確實可以運行,但是nuxt的項目編譯后也找不到怎么去在這種環境下部署,官方文檔暫時也沒有提到過,先放棄
3.iis有自己的反向代理配置,Application Request Routing簡稱ARR,這個是已經運行通過的方案,下面就主要記錄一下這個,希望對有相同問題的朋友有幫助。
環境准備:
1. 能運行nuxt的項目的相關環境,確保本地localhost能運行起來
2.ARR(Application Request Routing)下載地址:https://www.iis.net/downloads/microsoft/application-request-routing
配置詳細說明:
1. 安裝ARR,安裝后IIS根配置頁會多出來兩個配置項,那么就安裝成功了。

2.確保host在其他端口的nuxt項目能正常反問
不管你是在cmd的node啟動的服務還是pm2掛載的服務,首先確保http://127.0.0.1:3000/本地訪問正常,然后再開始配置iis的反向代理

3.站點下創建應用程序
ARR的配置實際上會在站點的web.config文件里面寫入一些配置內容,如果是獨立應用程序的話,會在相應的目錄下創建一個新的文件,不影響已有的主站點web.config的配置內容,保證互補影響。

4.配置ARR反向代理
雙擊ARR打開配置

打開代理設置

啟用代理的勾上,應用設置

選擇上面站點下創建的應用程序,打開主頁設置,打開URL重寫設置

添加規則,選擇反向代理

填寫本地需要代理的地址

然后使用http://localhost/app訪問主頁

這里其實是有問題的,因為我們用的是虛擬目錄代理的是一個站點的根目錄,所以引用的js,css和圖片等資源的地址是相對路徑的話就無法訪問了,網上有一些解決辦法是配置出站規則,但是對於nuxt編譯后的項目來說,代理訪問的內容gzip壓縮,無法應用出站規則,而且微軟的這項配置復雜,需要配置每個標簽的出站規則。
這里其實就是一個路徑引用問題,既然用到了vue-ruter,路由的根配置修改為虛擬目錄名字一樣就可以了


配置好編譯,繼續發布運行后,保證http://127.0.0.1:3000/app正常訪問,然后修改iis代理配置


然后就可以訪問80端口的虛擬目錄了,資源無法加載的問題解決了。
