browser-sync + http-proxy-middleware 配置代理跨域

时间:2021-08-26 03:06:10

写代理js文件下面是文件内容

 /**
* Module dependencies.
*/
var browserSync = require('browser-sync').create()
var proxy = require('http-proxy-middleware') // require('http-proxy-middleware'); /**
* Configure proxy middleware
*/ var jsonPlaceholderProxy = proxy('/api', {
target: 'http://127.0.0.1:5000',
changeOrigin: true, // for vhosted sites, changes host header to match to target's host
pathRewrite: {
'^/api': ''
},
logLevel: 'debug'
}) /**
* Add the proxy to browser-sync
*/
browserSync.init({
server: {
baseDir: './',
middleware: [jsonPlaceholderProxy]
},
port: 8080,
startPath: '/'
}) console.log('[DEMO] Server: listening on port 8080')

随后在package.json中配置script字段,npm启动此代理即可,

注意,此处我遇到一个坑,下面参考资料的port:8080写在init函数server选项里面的话,启动出来的端口是一个随机分配的端口

    并不是我们配置的8080口,需要把port选项发到server平级即可启动对应端口

参考资料

https://github.com/chimurai/http-proxy-middleware/blob/master/examples/browser-sync/index.js