问题对人有帮助，内容完整，我也想知道答案
问题没有实际价值，缺少关键内容，没有改进余地
先贴出报错截图：
下面是对config/index.js中proxyTablede的设置以及在组件的使用：
最后贴出终端的报错：
是我配置错了？还是测试接口不支持跨域的？
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
proxyTable: {
target: 'http://xxxxx',
changeOrigin: true,
pathRewrite: {
'^/api': '/api'
配置没啥问题看看后台接口
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
target 错了，应该换成你要的服务器网址不是本地的网址
分享到微博？
你好！看起来你挺喜欢这个内容，但是你还没有注册帐号。 当你创建了帐号，我们能准确地追踪你关注的问题，在有新答案或内容的时候收到网页和邮件通知。还能直接向作者咨询更多细节。如果上面的内容有帮助，记得点赞 (????)? 表示感谢。
明天提醒我
关闭理由：
删除理由：
忽略理由：
推广（招聘、广告、SEO 等）方面的内容
与已有问题重复（请编辑该提问指向已有相同问题）
答非所问，不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因（请补充说明）
我要该，理由是：问题对人有帮助，内容完整，我也想知道答案
问题没有实际价值，缺少关键内容，没有改进余地
同一个页面可能需要调用后台的好几个接口，以前 nginx 时代，就是直接 host 一个真实的网址，然后 nginx 配置本地服务，例如我在浏览器输入""
实际上跑的是本地的代码，然后后台设置好了 Access-Control-Allow-Origin 之后，我就可以在直接调用所有接口都不跨域了
现在用了vue-cli些vue项目，也知道是在config的index.js文件里面更改
proxyTable: {
target: '/api',
changeOrigin: true,
pathRewrite: {
'^/api': ''
然后调接口的时候
this.$http.get('/api/menu/get_list').then(function(data){
console.log(data)
这样子的话是不是以为着我每调用任何一个接口，都要这样子配呢，感觉这样子配置一不小心就写错路径了，虽然说这样子的话不用让后台写 Access-Control-Allow-Origin，我直接配置成接口的主域就行了，但是感觉总有一些不对经的地方，感觉还是太繁琐了，也许是我不能够理解这配置的精髓？
补充说明：
就是现实生活中，后端会给你一个接口，告诉你传哪些参数，像这样
http://picup.xxxx.net/1/picture?method=upload
HTTP请求方式
输入参数说明
那我需要怎么配置才是合理高效的呢
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
这个文章里面有说到proxyTable搭配，开发也生产环境。不需要每个地址都单独配置，配置一下根目录就OK了。
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
如果是使用vue-cli生成的开发环境，直接在config/index.js中，把proxytable里面配置成差不多这样,后面的api就都会走target
proxyTable: {
target: 'http://xxx',
changeOrigin: true,
pathRewrite: {
'^/api': '/api'
当然，此时的api接口形式应该为/api/xxx,
补充回答：config中配置：
proxyTable: {
target: 'http://picup.xxxx.net',
changeOrigin: true,
pathRewrite: {
'^/api': ''
get('/api/1/picture?method=upload')
分享到微博？
Hi，欢迎来到 SegmentFault 技术社区！⊙▽⊙ 在这里，你可以提出编程相关的疑惑，关注感兴趣的问题，对认可的回答投赞同票；大家会帮你解决编程的问题，和你探讨技术更新，为你的回答投上赞同票。
明天提醒我
关闭理由：
删除理由：
忽略理由：
推广（招聘、广告、SEO 等）方面的内容
与已有问题重复（请编辑该提问指向已有相同问题）
答非所问，不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因（请补充说明）
我要该，理由是：4781人阅读
和后端联调时总是会面对恼人的跨域问题，最近基于Vue开发项目时也遇到了这个问题，两边各自想了一堆办法，查了一堆资料，加了一堆参数，最后还得我把自己的localhost映射成上线时将要使用的域名。
今天翻看代码时，突然发现vue-cli的config文件里有一个参数叫proxyTable，看这个名字就感觉能解决问题，于是我就去搜了一下，果然。在vuejs-templates，也就是vue-cli的使用的模板插件里，有关于API proxy的说明，使用的就是这个参数。
这个参数主要是一个地址映射表，你可以通过设置将复杂的url简化，例如我们要请求的地址是/list/1，可以按照如下设置：
proxyTable: {
'/list': {
target: '',
pathRewrite: {
'^/list': '/list'
这样我们在写url的时候，只用写成/list/1就可以代表/list/1.
那么又是如何解决跨域问题的呢？其实在上面的'list'的参数里有一个changeOrigin参数，接收一个布尔值，如果设置为true,那么本地会虚拟一个服务端接收你的请求并代你发送该请求，这样就不会有跨域问题了，当然这只适用于开发环境。增加的代码如下所示：
proxyTable: {
'/list': {
target: '',
changeOrigin: true,
pathRewrite: {
'^/list': '/list'
vue-cli的这个设置来自于其使用的插件http-proxy-middleware
深入了解的话可以看该插件配置说明，似乎还支持websocket，很强大的插件。
文／almon123（简书作者）
原文链接：/p/95b2caf7e0da
著作权归作者所有，转载请联系作者获得授权，并标注“简书作者”。
&&相关文章推荐
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：571181次
积分：7236
积分：7236
排名：第3221名
原创：17篇
转载：918篇
(8)(26)(13)(22)(16)(14)(8)(4)(6)(7)(64)(10)(19)(15)(41)(24)(23)(17)(8)(4)(10)(6)(54)(12)(7)(3)(16)(12)(20)(10)(14)(15)(4)(10)(19)(2)(1)(4)(31)(4)(4)(27)(24)(16)(23)(1)(8)(3)(15)(12)(8)(3)(3)(4)(35)(1)(3)(8)(30)(31)(24)(5)(12)(7)(5)(3)(1)(1)(3)(13)
(window.slotbydup = window.slotbydup || []).push({
id: '4740881',
container: s,
size: '200,200',
display: 'inlay-fix'详解Vue-cli 创建的项目如何跨域请求_Javascript教程-织梦者
当前位置:&>&&>& > 详解Vue-cli 创建的项目如何跨域请求
详解Vue-cli 创建的项目如何跨域请求
本文将为关注织梦者的朋友提供的是的详解Vue-cli 创建的项目如何跨域请求相关教程，具体实例代码请看下文:问题描述：
使用 Vue-cli 创建的项目，开发地址是 localhost:8023，需要访问 localhost:9000 上的接口
分析原因：
不同域名之间的访问，需要跨域才能正确请求。跨域的方法很多，通常都需要后台配置
不过 Vue-cli 创建的项目，可以直接利用 Node.js 代理服务器，实现跨域请求
解决方案：
接口地址原本为 /form/save，但是为了匹配代理地址，在前面加一个 /api
如果使用了 axios，可以全局配置一个 baseURL，这样就不用挨个儿修改 url 了
axios.defaults.baseURL = '/api'
在 config&index.js 的 dev 中添加配置项 proxyTable：
proxyTable: {
target: 'http://127.0.0.1:9000/',
changeOrigin: true,
pathRewrite: {
'^/api': '/'
其中 '/api' 为匹配项，target 为被请求的地址
因为在 ajax 的 url 中加了前缀 '/api'，而原本的接口是没有这个前缀的
所以需要通过 pathRewrite 来重写地址，将前缀 '/api' 转为 '/'
如果本身的接口地址就有 '/api' 这种通用前缀，就可以把 pathRewrite 删掉
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持织梦者。多多关注织梦者，我们将为您收集更多的javascript相关文章.
这些内容可能对你也有帮助
更多可查看Javascript教程列表页。
猜您也会喜欢这些文章}