使用vue-element-admin框架调用后端接口及跨域的问题

 更新时间:2023年11月27日 09:24:41   作者:小僵尸打字员  
这篇文章主要介绍了使用vue-element-admin框架调用后端接口及跨域的问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

前言

vue-element-admin 官方git地址 https://github.com/PanJiaChen/vue-element-admin

进行开发需要调用外部接口, 而且还涉及到跨域的问题,百度出来的全部都是说在config目录加proxyTable…emmm是拉同一个项目吗大兄弟, 哪来的config目录

解决

随便写一个测试接口

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里面新启一个文件, 然后定义一个接口

在前端随便写个按钮加上点击事件

项目的config是最外层的vue.config.js, 在里面找到proxy在下面加入自己的配置解可以了

key是一个匹配器, 我的规则xiaofei开头的用的自定义的target, 可以加多层规则, 也可以看一下官方的配置文档

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • Vue router动态路由实现过程

    Vue router动态路由实现过程

    Vue动态路由(约定路由),听起来好像很玄乎的样子,但是你要是理解了实现思路,你会发现没有想象中的那么难,下面这篇文章主要给大家介绍了关于vue实现动态路由添加功能的简单方法,需要的朋友可以参考下
    2023-03-03
  • vue中setup语法糖写法实例

    vue中setup语法糖写法实例

    如果你在 vue3 开发中使用了语法的话,对于组件的name属性,需要做一番额外的处理,下面这篇文章主要给大家介绍了关于Vue3 setup语法糖的相关资料,需要的朋友可以参考下
    2022-12-12
  • vue学习之Vue-Router用法实例分析

    vue学习之Vue-Router用法实例分析

    这篇文章主要介绍了vue学习之Vue-Router用法,结合实例形式分析了Vue-Router路由原理与常见操作技巧,需要的朋友可以参考下
    2020-01-01
  • vue 本地服务不能被外部IP访问的完美解决方法

    vue 本地服务不能被外部IP访问的完美解决方法

    这篇文章主要介绍了vue 本地服务不能被外部IP访问的解决方法,本文通过代码讲解的非常详细,需要的朋友可以参考下
    2018-10-10
  • vue使用v-for实现hover点击效果

    vue使用v-for实现hover点击效果

    hover是css中的选择器,用于选择鼠标指针浮动在上面的元素。这篇文章主要介绍了vue使用v-for实现hover点击效果,需要的朋友可以参考下
    2018-09-09
  • vue.js如何更改默认端口号8080为指定端口的方法

    vue.js如何更改默认端口号8080为指定端口的方法

    本篇文章主要介绍了vue.js如何更改默认端口号8080为指定端口的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-07-07
  • vue的图片需要用require的方式进行引入问题

    vue的图片需要用require的方式进行引入问题

    这篇文章主要介绍了vue的图片需要用require的方式进行引入问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-03-03
  • vue-router结合vuex实现用户权限控制功能

    vue-router结合vuex实现用户权限控制功能

    这篇文章主要介绍了vue-router结合vuex实现用户权限控制功能,本文给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-11-11
  • vue+element+springboot实现文件下载进度条展现功能示例

    vue+element+springboot实现文件下载进度条展现功能示例

    本文主要介绍了vue + element-ui + springboot 实现文件下载进度条展现功能,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-11-11
  • vue-cli启动本地服务局域网不能访问的原因分析

    vue-cli启动本地服务局域网不能访问的原因分析

    这篇文章主要介绍了vue-cli启动本地服务,局域网下访问不到的原因分析,在文中还给大家介绍了vue-cli起的webpack项目 用localhost可以访问,但是切换到ip就不可以访问 的原因,本文给大家介绍的非常详细,需要的朋友参考下
    2018-01-01

最新评论