使用vue-element-admin框架調(diào)用后端接口及跨域的問(wèn)題
前言
vue-element-admin 官方git地址 https://github.com/PanJiaChen/vue-element-admin
進(jìn)行開(kāi)發(fā)需要調(diào)用外部接口, 而且還涉及到跨域的問(wèn)題,百度出來(lái)的全部都是說(shuō)在config目錄加proxyTable…emmm是拉同一個(gè)項(xiàng)目嗎大兄弟, 哪來(lái)的config目錄
解決
隨便寫(xiě)一個(gè)測(cè)試接口
from flask import Flask, url_for
import json
app = Flask(__name__)
@app.route("/xiaofei")
def test():
return json.dumps({"name": "小飛"})
if __name__ == '__main__':
app.run(debug=True, host='0.0.0.0')
在 src/api里面新啟一個(gè)文件, 然后定義一個(gè)接口

在前端隨便寫(xiě)個(gè)按鈕加上點(diǎn)擊事件

項(xiàng)目的config是最外層的vue.config.js, 在里面找到proxy在下面加入自己的配置解可以了

key是一個(gè)匹配器, 我的規(guī)則xiaofei開(kāi)頭的用的自定義的target, 可以加多層規(guī)則, 也可以看一下官方的配置文檔

總結(jié)
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
Vue router動(dòng)態(tài)路由實(shí)現(xiàn)過(guò)程
Vue動(dòng)態(tài)路由(約定路由),聽(tīng)起來(lái)好像很玄乎的樣子,但是你要是理解了實(shí)現(xiàn)思路,你會(huì)發(fā)現(xiàn)沒(méi)有想象中的那么難,下面這篇文章主要給大家介紹了關(guān)于vue實(shí)現(xiàn)動(dòng)態(tài)路由添加功能的簡(jiǎn)單方法,需要的朋友可以參考下2023-03-03
vue中setup語(yǔ)法糖寫(xiě)法實(shí)例
如果你在 vue3 開(kāi)發(fā)中使用了語(yǔ)法的話,對(duì)于組件的name屬性,需要做一番額外的處理,下面這篇文章主要給大家介紹了關(guān)于Vue3 setup語(yǔ)法糖的相關(guān)資料,需要的朋友可以參考下2022-12-12
vue學(xué)習(xí)之Vue-Router用法實(shí)例分析
這篇文章主要介紹了vue學(xué)習(xí)之Vue-Router用法,結(jié)合實(shí)例形式分析了Vue-Router路由原理與常見(jiàn)操作技巧,需要的朋友可以參考下2020-01-01
vue 本地服務(wù)不能被外部IP訪問(wèn)的完美解決方法
這篇文章主要介紹了vue 本地服務(wù)不能被外部IP訪問(wèn)的解決方法,本文通過(guò)代碼講解的非常詳細(xì),需要的朋友可以參考下2018-10-10
vue使用v-for實(shí)現(xiàn)hover點(diǎn)擊效果
hover是css中的選擇器,用于選擇鼠標(biāo)指針浮動(dòng)在上面的元素。這篇文章主要介紹了vue使用v-for實(shí)現(xiàn)hover點(diǎn)擊效果,需要的朋友可以參考下2018-09-09
vue.js如何更改默認(rèn)端口號(hào)8080為指定端口的方法
本篇文章主要介紹了vue.js如何更改默認(rèn)端口號(hào)8080為指定端口的方法,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07
vue的圖片需要用require的方式進(jìn)行引入問(wèn)題
這篇文章主要介紹了vue的圖片需要用require的方式進(jìn)行引入問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-03-03
vue-router結(jié)合vuex實(shí)現(xiàn)用戶權(quán)限控制功能
這篇文章主要介紹了vue-router結(jié)合vuex實(shí)現(xiàn)用戶權(quán)限控制功能,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-11-11
vue+element+springboot實(shí)現(xiàn)文件下載進(jìn)度條展現(xiàn)功能示例
本文主要介紹了vue + element-ui + springboot 實(shí)現(xiàn)文件下載進(jìn)度條展現(xiàn)功能,文中通過(guò)示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-11-11
vue-cli啟動(dòng)本地服務(wù)局域網(wǎng)不能訪問(wèn)的原因分析
這篇文章主要介紹了vue-cli啟動(dòng)本地服務(wù),局域網(wǎng)下訪問(wèn)不到的原因分析,在文中還給大家介紹了vue-cli起的webpack項(xiàng)目 用localhost可以訪問(wèn),但是切換到ip就不可以訪問(wèn) 的原因,本文給大家介紹的非常詳細(xì),需要的朋友參考下2018-01-01

