vue-cli proxy中跨域中pathRewrite配置理解

1. vue本地项目调试线上接口出现跨域问题
2. 通过在 config/index.js 配置文件中找到proxyTable配置项

dev: {// PathsassetsSubDirectory: 'static',assetsPublicPath: '/',proxyTable: {'/api': {target: 'http://XX.XX.XX.XX:8083',changeOrigin: true,pathRewrite: {'^/api': '/api'   // 这种接口配置出来实际请求     http://XX.XX.XX.XX:8083/api/login//'^/api': '/' 这种接口配置出来实际请求 http://XX.XX.XX.XX:8083/login}}}},

3. 配置完成后需要重新编译一遍 , 调用接口的时候

 // 获取菜单权限getPermission(){this.$ajaxget({url: '/api/getPermission',data: {},isLayer: true,successFc: data => {console.log(data.data)}})},

4 . 因为我的项目接口中是存在 ‘/api’ 这个字段的所以我选择的是第一种配置

图解

效果图:

vue-cli proxy中跨域中pathRewrite配置理解相关推荐

Vue CLI 3 安装、创建、配置、安装插件
一.安装 1.全局安装过旧版本的 vue-cli(1.x 或 2.x)要先卸载它: npm uninstall vue-cli -g //或者 yarn global remove vue-cli 注 ...
vue cli 解决跨域线上 nginx 反向代理配置
前后分离 axios 接 api 跨域问题如图: 解决办法: 1. npm start 本地开发环境解决: 在webpack配置文件 /config/index.js 里找到 proxyTable 开 ...
vite以及webpack(@vue/cli 5.x) vue3 alias别名配置
一.vite 之前写了一个vite的项目,配置找了半天,结果如下: import { defineConfig } from 'vite' import vue from '@vitejs/plugi ...
cli vue 外部js 引入文件_javascript - vue cli构建的项目中，vue组件里怎么引入外部js文件里的方法...
问题我想在content组件里调用外部js(test.js)里的diyfun方法,怎么实现呢? 我的content组件代码: Click export default { data () { re ...
Vue CLI 官方文档（一）@vue/cli、@vue/cli-service、插件和 Preset
Vue CLI 官方文档(一)@vue/cli.@vue/cli-service.插件和 Preset 文章目录 Vue CLI 官方文档(一)@vue/cli.@vue/cli-service.插件 ...
Vue学习笔记(九) Vue CLI
1.简介 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,它包括三个独立的部分: CLI:一个全局安装的 npm 包,提供在终端里使用的命令 CLI 服务:一个局部安装在使用了 @v ...
Vue CLI 3结合Lerna进行UI框架设计
第一次在掘金发文章,有点啰里啰嗦,大家见谅. 当前大部分UI框架设计的Webpack配置都相对复杂,例如Element.Ant Design Vue和Muse-UI等Vue组件库.例如Element, ...
Vue 全家桶之 vue cli (脚手架)
一.Vue cli 简介 cli --------------------- c : command (命令) l : line ( 行 ) i : interface ( 接口 ) 命令行接口命令 ...
cli vue 卸载,vue Cli 环境删除与重装教程 - 版本文档
vue-cli 卸载,版本选择,安装 · 检测(图文教程:vue Cli 环境删除与重装) 重要说明: vue-cli 3.0+版本,使用的不是vue-cli,而是@vue/cli: 如果用以上的安装 ...

vue-cli proxy中跨域中pathRewrite配置理解

图解

vue-cli proxy中跨域中pathRewrite配置理解相关推荐

最新文章

热门文章