欧美一区二区三区,国内熟女精品熟女A片视频小说,日本av网,小鲜肉男男GAY做受XXX网站

proxy實現vue

傅智翔2年前8瀏覽0評論

在Vue中,我們經常需要將數據綁定到視圖上,并根據不同的情況進行響應式更新。但有時候,我們需要從后端獲取數據,而跨域請求是一個常見的問題。這時,可以使用代理(proxy)來解決跨域問題。下面,我們將介紹如何使用代理實現Vue應用。

首先,在Vue應用的根目錄下創建vue.config.js文件,并添加代理配置,示例如下:

module.exports = {
devServer: {
proxy: {
'/api': {
target: 'http://localhost:3000',
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
}
}
}
}

其中,target參數指定要代理的后端地址,changeOrigin參數表示是否修改來源,pathRewrite參數表示路徑重寫規則,這里將/api重寫為'',即去掉/api。如果有多個后端地址需要代理,可以在proxy對象中添加多個鍵值對。

接下來,我們可以在Vue組件中通過axios等庫發起后端請求,示例代碼如下:

import axios from 'axios'
export default {
data () {
return {
message: ''
}
},
mounted () {
axios.get('/api/message')
.then(res =>{
this.message = res.data.message
})
}
}

在組件中,我們使用axios等庫發起后端請求,并將請求路徑設置為/api/message,這里的/api即是我們在vue.config.js中設置的路徑重寫規則。通過這樣的方式,我們就可以在Vue應用中通過代理進行跨域請求了。