Day 108/200 Vue3+Vue-cli4 生產環(huán)境如何設置變量及跨域

寫在前面的話

今兒項目上測試環(huán)境,整了一天

踩了不少坑,總結下,分享給大家


(一)測試環(huán)境部署需要做的事兒

1、接口配置,區(qū)分本地開發(fā)環(huán)境和線上環(huán)境;

2、解決前后端項目分離的跨域問題


(二)對應的解決方案

1、官網有介紹,基礎不好沒看懂...

https://cn.vuejs.org/v2/guide/deployment.html

1)在根目錄下新建

.env.development

.env.production

2) 里面分別對應開發(fā)和生產環(huán)境;

VUE_ENV='development'

VUE_APP_BASE_URL=''(測試及本地)后臺IP"

3)劃重點

在所有頁面中,都有直接打印出process.env的值

console.log(process.env.VUE_APP_BASE_URL)

也就是說,Vue-cli4 默認可以加載在第一步里新建的文件中的配置參數(shù);

所有頁面都可以獲取到這個變量;

直接把變量拼接到接口上即可;


2、我用的是reqwest的請求

在請求時,需要加上跨域配置;

crossOrigin:?true

再之后需要再NGINX中配置;


nginx解決跨域問題

https://segmentfault.com/a/1190000019227927


參考鏈接

https://cn.vuejs.org/v2/guide/deployment.html

https://www.npmjs.com/package/reqwest

?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

友情鏈接更多精彩內容