vue項目與后端接口如何部署到同一域名
更新時間：2025年06月21日 10:50:10 作者：新佳
這篇文章主要介紹了vue項目與后端接口如何部署到同一域名的問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
vue項目與后端接口部署到同一域名
Nginx配置兩個地方就行
先是配置好自己項目的服務(wù)，確保自己的項目能運行：
location / {
root /web/xiangmu/public; // 本地項目的路徑
index index.html index.php;
}
再是配置接口請求后端
location /api/ {
proxy_pass http://192.168.1.1:8000;（后端接口地址，注意端口號）
proxy_set_header Host $HOST;
}
注意點（后端接口配置）
后端需要單獨啟動一個服務(wù)（如果是TP 有swoole, 可以配置一個后端服務(wù)。詳情看手冊 ）
php think swoole:server
如果你的配置出現(xiàn)404了，這個時候你可以對照檢查下面的問題是不是你遇到的。
proxy_pass 地址后面要不要加“/”,這個取決于匹配的 /api/ 作不作為你uri的一部分，如果 /api/ 是其中一部分,則不需要帶上“/”；反之帶上。
加了“/”相當于是絕對根路徑，nginx 不會把location 中匹配的路徑 /api/ 帶上。
[舉個列子,加了/]
- 請求地址原本是這樣： http://192.168.1.1/api/a.html;
- 如果配置是這樣：proxy_pass http://192.168.1.1/;（后端接口地址）
- 那么請求接口地址應(yīng)該變成這樣： http://192.168.1.1/a.html
proxy_pass的地址記得在hosts文件做ip映射，建議直接使用域名對應(yīng)的ip地址。
location 中 ~ （區(qū)分大小寫）與 ~* （不區(qū)分大小寫）標識均為正則匹配。
如果你不確定，請在location后面加上 location ~* /api/ { }這樣的配置（目的：不區(qū)分“api”三個字母的大小寫）。
總結(jié)
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要為大家詳細介紹了如何利用vue實現(xiàn)前端列表拖拽功能,文中的示例代碼講解詳細,具有一定的借鑒價值,有需要的小伙伴可以參考一下2023-12-12
這篇文章主要介紹了Vue如何指定不編譯的文件夾和favicon.ico，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
這篇文章主要介紹了Element PageHeader頁頭的使用方法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-07-07
下面小編就為大家分享一篇基于vue中css預(yù)加載使用sass的配置方式詳解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03
使用Vue中 v-for循環(huán)列表控制按鈕隱藏顯示功能
這篇文章主要介紹了使用Vue中 v-for循環(huán)列表控制按鈕隱藏顯示功能,需要的朋友可以參考下2019-04-04
vue computed計算屬性顯示undefined的解決
這篇文章主要介紹了vue computed計算屬性顯示undefined的解決方案,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-11-11
在Vue 中實現(xiàn)循環(huán)渲染多個相同echarts圖表
這篇文章主要介紹了在Vue 中實現(xiàn)循環(huán)渲染多個相同echarts圖表，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
文章介紹了Vue中組件的基本使用、定義、注冊、書寫標簽和嵌套等關(guān)鍵步驟和注意事項,詳細解釋了組件的配置選項、如何通過Vue.extend創(chuàng)建組件以及組件實例對象與Vue實例對象的區(qū)別,還提及了單文件組件的結(jié)構(gòu)和編寫邏輯,并強調(diào)了組件原型鏈的重要性2025-10-10
這篇文章主要介紹了vue簡單的二維數(shù)組循環(huán)嵌套方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
這篇文章主要介紹了vue之prop與$emit的用法說明，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04