【干貨】linux使用nginx一個80端口部署多個項目(spring boot、vue、nuxt、微信小程序)


本人只有一個阿里雲的ip和一個已經解析過的域名,然后想用80端口部署多個項目,比如輸入:

www.a.com和www.b.com與www.c.com就能訪問不同項目,而不用輸入不同端口號區分。

1.這里就只部署單體springboot項目,比較簡單,打包成jar包,端口號改成沒有被占用的就行

(我這里用了8080端口,然后訪問沒問題,要放到nginx里也可以,本人這里沒有放)

 

2.微信小程序的話好像只能用80、443端口來部署,不然報錯,如下:

 

 

3.vue項目屬於手機端,nuxt項目屬於pc端,和微信小程序項目都要用到80端口,這里就要用到nginx。

(nginx還提供區別pc端和手機端,下面會講)

我這里的nuxt項目是用pm2管理(也可以用docker),所以要先安裝好nodejs與pm2,

不過最新版的nodejs好像不支持centos7以下的,make時會報錯。

(試過centos7以下的安裝9.0版本以下的nodejs就可以,9.0版本的話沒試過)

node安裝: 

https://blog.csdn.net/weixin_40861707/article/details/109455582

https://www.cnblogs.com/sirdong/p/11447739.html

pm2安裝與部署nuxt項目:

https://segmentfault.com/a/1190000020452519?utm_source=tag-newest

docker部署nuxt項目:

https://www.sunofbeach.net/a/1218817449269407744

https://www.bilibili.com/video/BV1QC4y1b7gL?p=49

 

4.nginx部署這里就不說了,下面提供幾2個(centos7以上與7以下好像有點差異):

https://blog.csdn.net/t8116189520/article/details/81909574

https://blog.csdn.net/jdk_wangtaida/article/details/88571920

如果安裝nginx出現問題,可以看下這個:

https://blog.csdn.net/copenhageng/article/details/109500483

 

5.我這里的微信小程序項目使用tomcat部署的,tomcat之前用了80端口,所以要改下配置文件,

在tomcat的安裝目錄里的conf包找到server.xml文件,修改如下:

<Connector port="8081" protocol="HTTP/1.1" connectionTimeout="20000"
redirectPort="8443" />

這里的端口號要和下面的配置文件一樣,修改后記得重啟下

 

6.安裝好nginx后,在安裝目錄下找到nginx包里的conf里nginx.conf文件,並修改下

server {
  listen 8089;//如果默認不是80端口的話就不要改,是的話最好改下,以防其它項目調用產生問題

  server_name  www.baidu.com;//這里最好改下,改成自己的域名,沒用到這端口的話就用隨便填吧

}

並在http{}里的最下面添加:

include /home/nginxConf/*.conf;//可改成改成自己的路徑

這里的站點可以隨便創建一個包存放,我的放在nginxConf文件包里統一管理。

 

設置好端口后,注意要開放端口,如果不想關閉防火牆,可以開放,命令如下:

firewall-cmd --zone=public --add-port=端口號/tcp --permanent

然后重啟防火牆:

firewall-cmd --reload

注意:上面時centos7以上的命令,centos7以上和centos7以下命令會不同,詳情可看:

https://blog.csdn.net/Lang_Perry/article/details/93194639

 

7.在/home/nginxConf里新建三個conf文件分別對應vue項目、nuxt項目、微信小程序項目,文件名隨便取。

我這里分別是mobile.conf、pc.conf、wx.conf文件,添加或修改后記得重啟nginx:

https://blog.csdn.net/erdfty/article/details/89919513

7.1(vue項目)mobile.conf文件添加:

server {
listen 80;
server_name 自己的域名;
index index.php index.html index.htm default.php default.htm default.html;
root /usr/local/nginx/html/vue;//修改成自己的路徑

#判斷是pc端就跳轉到pc端項目(判斷是pc端的話就在 ~ 加上 ! ,否則就去掉)
if ( $http_user_agent !~* "(midp|ipad|Android|iPhone|windows mobile|Windows Phone|windows ce|UC|Kindle)" )
{
rewrite ^(.*)$ http://自己的域名$uri redirect;(要加上 http://,不然跳轉會報錯)
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}

7.2(nuxt項目)pc.conf文件添加:

server {
listen 80;
server_name 自己的域名;
index index.php index.html index.htm default.php default.htm default.html;
root /usr/local/nginx/html;//修改成自己的路徑

#判斷是手機端就跳轉到手機端項目
if ( $http_user_agent ~* "(midp|ipad|Android|iPhone|windows mobile|Windows Phone|windows ce|UC|Kindle)" )
{
rewrite ^(.*)$ http://自己的域名d$uri redirect;(要加上 http://,不然跳轉會報錯)
}
location / {
proxy_pass http://127.0.0.1:3000;//改成自己要映射的路徑和端口
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}

7.3(小程序項目) wx.conf文件添加:

server {
listen 80 default_server;
server_name 自己的域名;
index index.php index.html index.htm default.php default.htm default.html;
root /usr/local/apache-tomcat-8.5.23/webapps;//修改成自己的路徑
location / {
proxy_pass http://127.0.0.1:8081;//改成自己要映射的路徑和端口
}

error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}

}

 

8.我這里只有一個ip和一個已解析的域名,但是有三個文件要配置不同域名,怎么辦。

8.1

第一個辦法就是通過使用寶塔面板之類的來進行添加站點,部署項目,這個又快又簡單。

8.2

第二個辦法就是在阿里雲域名解析里多添加幾個記錄就行,主機記錄隨便填,記錄值就是ip。

 

然后就在相對應文件里修改。比如我的外網ip是:123.123.123.123,對應解析的域名是:www.a.com

那我在mobile.conf文件設置的域名是:mobile.a.com

pc.conf文件設置的域名是:www.a.com

wx.conf文件設置的域名是:123.123.123.123(這里項目是小程序,所以本人用ip)

就這樣,在瀏覽器里分別輸入相對應域名就可以看到效果(親測有效)。

(如果哪位大神還有更好解決的辦法,請留言交流,轉載請注明出處,十分感謝)


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM