标签:配置 探讨 ora ack image 简单 管理 react 目录
在react中配置开发环境下的本地代理相对比较简单,直接在package.json文件中修改即可。
但是这样做有其局限性,如果开发中代理多个接口的时候将无法满足需求,我们需要的是下面这种的能够代理多个接口的请求方式
proxy(‘/back‘, { target: ‘http://172.20.1.148:8082‘, changeOrigin: true })
1):安装http-proxy-middleware管理包,npm i http-proxy-middleware --save
2):在项目目录的src /下新建setupProxy.js文件,然后写入如下代码:
const proxy = require(‘http-proxy-middleware‘); module.exports = function(app) { app.use(proxy(‘/api‘, { target: ‘http://192.168.1.144:8181‘ , secure: false, changeOrigin: true, pathRewrite: { "^/api": "/" }, // cookieDomainRewrite: "http://localhost:3000" })); };
vue配置本地代理,在项目根目录创建vue.config.js
module.exports = { devServer: { open: true, https: false, hotOnly: false, proxy: { //设置代理 ‘/api‘: { target: ‘http://192.168.000.129‘, host: ‘192.168.000.129‘, changeOrigin: true, pathRewrith: { ‘^/api‘: ‘/‘ } }, ‘/lyg‘:{ target:‘http://192.168.000.108:8090/‘, host:‘192.168.000.108‘, changeOrigin:true, pathRewrith:{ ‘^/lyg‘:‘/‘ } } }, port:8000, }, }
以上是vue,react配置本地代理的些许方法。如有疏漏,欢迎探讨
标签:配置 探讨 ora ack image 简单 管理 react 目录
原文地址:https://www.cnblogs.com/gitByLegend/p/11399945.html