vue-cli webpack开发环境跨域详解

　　

编辑config/index.js dev.proxyTable选项。开发服务器使用http-proxy-middleware代理

　　

为了解决跨域问题,

　　
    　　<李>通常会使用Jsonp,但是Jsonp只能是得到请求。 　　<李>或者使用歌珥支持,设置Access-Control-Allow-Origin: * 　　
　　

<强> 0前置技能

　　

熟悉vue-loader和webpack

　　

<强>,1基本配置

　　

编辑连接起来/索引。js文件开发服务器使用的是http-proxy-middleware来代理

　　 　　//配置/index.js 　　模块。出口={//? 　　戴夫:{ 　　proxyTable: {//代理/api jsonplaceholder开始所有请求 　　“/api”: { 　　目标:“http://jsonplaceholder.typicode.com”, 　　changeOrigin:没错, 　　pathRewrite: { 　　“^/api”:“ 　　} 　　} 　　} 　　} 　　} 　　 　　

上面的例子将代理请求/api/文章/1到http://jsonplaceholder.typicode.com/posts/1。

　　

<强>,2全局匹配

　　

您可以提供一个过滤器选项,可以自定义函数来确定是否应该请求代理:

　　

提供一个过滤器,制定路由规则和路由方法。

　　 　　 　　proxyTable: { 　　‘*’:{ 　　目标:“http://jsonplaceholder.typicode.com”, 　　过滤器:函数(路径名,点播){ 　　返回pathname.match (^/api),,要求的事情。方法===暗玫健? 　　} 　　} 　　} 　　 　　

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

vue-cli webpack开发环境跨域详解