配置

注意:修改之后要重新运行一遍项目才行

devServer:{
contentBase:'./',
proxy:{
// 当你请求是以/api开头的时候,则我帮你代理访问到http://localhost:3000
// 例如:
// /api/users http://localhost:3000/api/users
// 我们真是服务器接口是没有/api的
"/api":{
target:"http://localhost:3000",
pathRewrite:{"^/api":""}
}
}
}
用代理, 首先你得有一个标识, 告诉他你这个连接要用代理. 不然的话, 可能你的 html, css, js这些静态资源都跑去代理. 所以我们只要接口用代理, 静态文件用本地.

‘/api’: {}, 就是告诉node, 我接口只要是’/api’开头的才用代理.所以你的接口就要这么写 /api/xx/xx. 最后代理的路径就是 http://xxx.xx.com/api/xx/xx.

可是不对啊, 我正确的接口路径里面没有/api啊. 所以就需要 pathRewrite,用”^/api”:”, 把’/api’去掉, 这样既能有正确标识, 又能在请求接口的时候去掉api.

devServer之proxy跨域的更多相关文章

  1. 前端本地proxy跨域代理配置

    等了好久的接口,总算拿到了,结果却发现用本地localhost:9712去请求接口的时候,出现了跨域错误,而这个时候我们就需要进行下跨域配置了. 首先,找到项目中名为webpack.config.js ...

  2. proxy跨域

    跨域 浏览器访问非同源的网址时,会被限制访问,出现跨域问题. 解决方案: 1.response 添加 header(CORS) 2.JSONP 方式 3.全局对象+iframe (1)document ...

  3. proxy 跨域配置, 针对有axios的baseURL

    1.首先主要的config文件下的index.js中的proxytable配置 proxyTable:{ '/proxy': { target:'http://192.168.2.141:8080', ...

  4. 前端vue开发中的跨域问题解决,以及nginx上线部署。(vue devServer与nginx)

    前言 最近做的一个项目中使用了vue+springboot的前后端分离模式 在前端开发的的时候,使用vue cli3的devServer来解决跨域问题 上线部署则是用的nginx反向代理至后台服务所开 ...

  5. 跨域解决方案 - webpack devServer

    1. 定义 如果一个项目中配置了webpack, 那么我们使用 webpack devServer 来配置代理转发请求来达到解决跨域问题的目的 webpack devServer 能够解决跨域问题的根 ...

  6. Webpack devServer中的 proxy 实现跨域

    Webpack dev server使用http-proxy解决跨域问题 文档资料 webpack关于webpack-dev-server开启proxy的官方介绍Vue-cli proxyTable ...

  7. Webpack代理proxy配置,解决本地跨域调试问题,同时允许绑定host域名调试

    Webpack代理proxy配置,解决本地跨域调试问题,同时允许绑定host域名调试 会撸码的小马 关注 2018.05.29 17:30* 字数 212 阅读 1488评论 0喜欢 2 接到上一章, ...

  8. proxy解决跨域问题

    首先我们在本地开发,域名都是localhost,当我们需要请求后台数据时,就会出现跨域的问题 下面就是在vue.config.js配置文件里: devServer: {     proxy: {    ...

  9. vue cli+axios踩坑记录+拦截器使用,代理跨域proxy(更新)

    16319 1.首先axios不支持vue.use()方式声明使用,看了所有近乎相同的axios文档都没有提到这一点建议方式 在main.js中如下声明使用 import axios from 'ax ...

随机推荐

  1. asp.net 8 Request,Response,Server

    Request成员: 1.Request.UrlReferrer 获取请求的来源,可以防盗链 Response.Write(Request.Url.ToString());//获取当前请求的URL地址 ...

  2. ModbusRtu通信报文详解【一】

    Modbus协议可谓是工业控制领域应用最广泛的协议之一.根据不同的电气接口,包括Modbus Rtu/ASCII,Modbus TCP/UDP,从学习的角度来说,只要学会其中一种,剩余的都是大同小异的 ...

  3. gridview单元格编辑添加数据

    行号 private void gridView1_CustomDrawRowIndicator(object sender, DevExpress.XtraGrid.Views.Grid.RowIn ...

  4. react的嵌套组件

    react没有vue插槽的概念,但是有嵌套组件,可以用嵌套组件实现类似插槽的功能.下例中,color,name,btn相当于具名插槽,children相当于匿名插槽. import React fro ...

  5. Mongoose 使用Node操作MongoDB

    Mongoose好处 可以为文档创建一个模式结构(Schema) 可以对模型中的对象/文档进行验证 数据可以通过类型转换转换为对象模型 可以使用中间件来应用业务逻辑挂钩 比Node原生的MongoDB ...

  6. Python中文分词组件 jieba

    jieba "结巴"中文分词:做最好的Python中文分词组件 "Jieba" Feature 支持三种分词模式: 精确模式,试图将句子最精确地切开,适合文本分 ...

  7. ssh登录缓慢,使用ssh -v登录后,显示在 “pledge: network” 处卡顿:

    当登录一台服务器时,每次输入密码之后都要等很久才会得到命令提示符,尝试修改了sshd_config中的UseDNS no,但效果依然不好. ssh -v 192.168.12.43 This is p ...

  8. makefile学习之函数

    GNU make支持内置函数以及用户自定义函数,下面结合例子简单介绍一下. gnu make版本: 4.1 一.用户自定义函数 格式: $(call macro-name{, param1 ···}) ...

  9. C# 图像基本处理

    使用第三方:AForge实现视频采集(实现视频采集.暂停) 实现图片的常用处理功能:旋转.反色.灰度.放大.缩小.模糊.拉伸.增强.锐化.裁剪...... 实现对图片进行文字编辑......

  10. MyBatis 报错org.apache.ibatis.session.defaults.DefaultSqlSessionFactory.openSessionFromDataSource

    报错如下: org.apache.ibatis.exceptions.PersistenceException: ### Error opening session. Cause: java.lang ...