Vue动态加载跨域图片不显示怎么办？
- 内容介绍
- 相关推荐
本文共计901个文字，预计阅读时间需要4分钟。
在Vue开发中，若因需访问后端接口而需配置请求转发，直接转发全部请求可能导致Vue动态绑定的src属性也被转发。由于图片位于前端，这会导致图片地址被错误地转发到后端，从而无法正常显示。
写在前面
小记，就简单写了 。问题：VUE开发时因为要访问后端的接口所以要配置请求转发，如果直接转发全部请求，那么VUE动态绑定的src也会转发到后端，因为图片在前端，所以会收到404 NOT FOUND的报错。
常规的请求转发
在vue-cli3内，直接编辑vue.config.js，如下：
let proxyObj={}; proxyObj['/']={ ws:false, target:'localhost:8023',//后端地址 changeOrigin:true, pathRewrite:{ '^/':'' } }; module.exports={ devServer:{ host:'localhost', port:8080, proxy:proxyObj } };
代码很简单，就不解释了，这段代码就是把所有请求都转发到了后端。
本文共计901个文字，预计阅读时间需要4分钟。
在Vue开发中，若因需访问后端接口而需配置请求转发，直接转发全部请求可能导致Vue动态绑定的src属性也被转发。由于图片位于前端，这会导致图片地址被错误地转发到后端，从而无法正常显示。
写在前面
小记，就简单写了 。问题：VUE开发时因为要访问后端的接口所以要配置请求转发，如果直接转发全部请求，那么VUE动态绑定的src也会转发到后端，因为图片在前端，所以会收到404 NOT FOUND的报错。
常规的请求转发
在vue-cli3内，直接编辑vue.config.js，如下：
let proxyObj={}; proxyObj['/']={ ws:false, target:'localhost:8023',//后端地址 changeOrigin:true, pathRewrite:{ '^/':'' } }; module.exports={ devServer:{ host:'localhost', port:8080, proxy:proxyObj } };
代码很简单，就不解释了，这段代码就是把所有请求都转发到了后端。