vue項(xiàng)目打包為APP,靜態(tài)資源正常顯示,但API請(qǐng)求不到數(shù)據(jù)的操作
Vue項(xiàng)目通過(guò)Hbuild打包為APP后，靜態(tài)文件正常顯示，但并沒(méi)有像開(kāi)發(fā)時(shí)那樣請(qǐng)求到數(shù)據(jù)。
這是為什么？因?yàn)锳PP并沒(méi)有跨域，不存在跨域一說(shuō)。
我們?cè)陂_(kāi)發(fā)的時(shí)候，js在不同的域之間進(jìn)行數(shù)據(jù)傳輸或通信,所以會(huì)給項(xiàng)目設(shè)置代理來(lái)跨域
config下的index.js
比如這個(gè)
proxyTable: {
'/api':{
target: 'http://XXX/xxx/v3',
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
}
}
在開(kāi)發(fā)時(shí)這樣做是沒(méi)錯(cuò)的，但我們?cè)诖虬鼤r(shí)就不用設(shè)置這個(gè)跨域了，打包前直接將這個(gè)跨域注釋掉，然后將API請(qǐng)求地址改為絕對(duì)地址。例如這樣
let SwipeImg = () => axios({
// url: 'api/basic/advert/lists',
url: 'http://xxx.xxx.xx.xx/api/v3/basic/advert/lists',
params: {
auth_key: key
}
})
改好之后在通過(guò)Hbuild打包后，APP數(shù)據(jù)就顯示正常了
這里要注意的是，我將打包后的APP放在夜神模擬器里，數(shù)據(jù)顯示還是不正常，但放在自己手機(jī)里就顯示正常，這點(diǎn)要注意
補(bǔ)充知識(shí)：vue 項(xiàng)目打包后看不到頁(yè)面內(nèi)容
vue 項(xiàng)目打包命令是：
npm run build
如果打包后打開(kāi)index.html頁(yè)面看不到內(nèi)容，有可能就是路徑不對(duì)，需要修改config/index.js文件
如下：
build: {
// Template for index.html
index: path.resolve(__dirname, '../dist/index.html'),
// Paths
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static',
assetsPublicPath: './',//此處為修改的地方，這里加.
..........
}
以上這篇vue項(xiàng)目打包為APP,靜態(tài)資源正常顯示,但API請(qǐng)求不到數(shù)據(jù)的操作就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue3點(diǎn)擊出現(xiàn)彈窗后背景變暗且不可操作的實(shí)現(xiàn)代碼
這篇文章主要介紹了vue3點(diǎn)擊出現(xiàn)彈窗后背景變暗且不可操作的實(shí)現(xiàn)代碼,本文通過(guò)實(shí)例代碼圖文相結(jié)合給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-08-08
Vue路由與a標(biāo)簽鏈接錨點(diǎn)發(fā)生沖突問(wèn)題及解決
這篇文章主要介紹了Vue路由與a標(biāo)簽鏈接錨點(diǎn)發(fā)生沖突問(wèn)題及解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03
這篇文章主要為大家詳細(xì)介紹了vue懸浮表單復(fù)合組件開(kāi)發(fā)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-04-04
vue3.0+ts引入詳細(xì)步驟以及語(yǔ)法校驗(yàn)報(bào)錯(cuò)問(wèn)題解決辦法
Vue?3.0是一個(gè)非常流行的JavaScript框架,不僅易于學(xué)習(xí)和使用,而且可以與許多UI框架集成,下面這篇文章主要給大家介紹了關(guān)于vue3.0+ts引入詳細(xì)步驟以及語(yǔ)法校驗(yàn)報(bào)錯(cuò)問(wèn)題的解決辦法,需要的朋友可以參考下2024-01-01
這篇文章主要介紹了Vue自定義全局彈窗組件操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-08-08
這篇文章主要介紹了Vue 項(xiàng)目分環(huán)境打包的方法示例，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-08-08
詳解從Vue.js源碼看異步更新DOM策略及nextTick
本篇文章主要介紹了從Vue.js源碼看異步更新DOM策略及nextTick，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一2017-10-10
在一般業(yè)務(wù)中監(jiān)聽(tīng)的最多的就是 Click 事件，但是在一些業(yè)務(wù)比如 Alert 和 Pop 效果時(shí)，需要監(jiān)聽(tīng)在元素外部的點(diǎn)擊來(lái)關(guān)閉彈窗。2020-11-11
這篇文章主要為大家詳細(xì)介紹了vue封裝一個(gè)日歷組件的方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-03-03
今天小編就為大家分享一篇關(guān)于Vue項(xiàng)目安裝插件并保存，小編覺(jué)得內(nèi)容挺不錯(cuò)的，現(xiàn)在分享給大家，具有很好的參考價(jià)值，需要的朋友一起跟隨小編來(lái)看看吧2019-01-01