開發環境
生產環境
後台主導
cors
cors
前端主導
proxy**
nginx**
module.exports =
}
配置完proxy之後,我們請求介面的位址需要是當前前端服務的位址
既然要請求自己的位址,那麼就沒有必要寫localhost:8080 直接寫/即可
如果使用**,那麼就沒有必要使用.env中去進行我們對應的介面位址的配置。因為不管在什麼環境下,都是請求當前前端伺服器位址
如果使用cors 則需要在build時根據.env去請求不同環境的伺服器位址, 如果使用**,則不需要配置不同位址,全部都使用/api/***
的形式
前端需要在axios的配置中配置baseurl。前提需要先配置好.env環境變數檔案
新建開發環境的env檔案
新建生產環境的env檔案
const _axios = axios.
create
()
如果使用**,則前端不需要再配置baseurl,因為請求全部走的前端服務(**)
vue.config.js
如果只有乙個後台
module.exports =
}
如果有多個後台介面module.exports =},
"/自定義前端請求時字首":}
}}}
注意,在請求時,不需要配置axios的baseurl,也不需要新增任何的網域名稱
build之後,我們不再有nodejs伺服器,只是靜態頁面(proxy設定只能針對開發環境)
生產環境需要配置nginx
server
# 配置**
location /伺服器字首
# 配置** 需要進行rewrite
location /前端請求的字首
error_page 500 502 503 504 /50x.html;
location = /50x.html
}
前後端分離專案
由於目前公司需要為已經存在的專案統一單點登入,而技術選型後採用的是apereo的cas。但是由於官方cas文件的混亂性 你懂得!並且其官方的例項和網上的例項教程都是基於傳統的專案 也就是非前後端分離專案 因此對於前後端分離的專案整合cas的可參考的資料就比較少,於是就有了下面的前後端分離專案基於ca...
用vue前後端分離專案開發記錄
一 軟體安裝 1.1 檢測node 是否安裝 1.2 安裝 映象 cnpm 1.3 安裝vue cli 1.4 檢查是否安裝vue cli腳手架成功 1.5安裝webpack 模組管理工具 二 建立vue專案 2.1 建立乙個基於webpack專案 2.2 進入專案檔案 2.3以生產環境啟動專案 2...
前後端不分離專案
express 是nodejs核心框架。express的功能介紹?express generator自動構建開發工具 express有乙個本地埠localhost 3000靜態網頁 聯合前端網頁的源 通過ejs模組可以實現前後端聯合專案 ejs可以識別html標籤,還能解析js,執行在express...