Skip to content

gauseen/web-proxy

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

创建本地服务,及服务代理,支持热更新

Create http proxy support Hot update

TODO

特别针对老型项目设计,没有使用构建工具( webpack、gulp、grunt etc.)

确保你的 nodejs 版本 >= 8.0.0, 解决跨域问题,支持本地开发热更新


安装(install)

yarn add @gauseen/web-proxy -D    # 推荐
# or
npm i @gauseen/web-proxy -D

使用(usage)

// 首先,在项目根目录创建 server.js 文件
// 例子:
// server.js

const path = require('path')
const server = require('@gauseen/web-proxy')

const options = {
	watch: false,
	watchStatic: path.join(__dirname, './demo/'),
	serverStatic: path.join(__dirname, './'),
	port: 8008,
	proxyTable: {
		'/api': { target: 'http://doman.com/', }
		/* '/apiFlag': {
			target: 'http://doman.com/',
			pathRewrite: {
				// ^/old-path' : '/new-path
				// 下面配置是将,/apiFlag 开头的请求,重写为 /newFlag,也可为 '' (空)
				'^/apiFlag': '/newFlag',
			}
		} */
	},
	notify: true,
	ignores: ['js'],
	callback: function () {
		console.log('Server run success ...')
	},
}

server(options)

options 参数说明:

参数 说明 类型 默认 是否必选 可选项
watch 是否开启热更新 Boolean false -
watchStatic 热更新目录 String -
serverStatic 静态服务目录 String -
proxyTable 要代理的 doman Object -
port 端口 Number 8008 -
notify 是否在浏览器端显示通知 Boolean false -
ignores 忽略 watch 文件格式 Array - [css, html, js]
callback 服务启动成功回调 Function - -

启动服务

node server.js
#
# 自己配置 npm scripts 运行

# 更改 server.js 文件后要重启服务,更改才生效

浏览器运行

localhost: <port>/

注:

proxyTable 是个对象,

键 为: 请求 URL 的统一标识字段,如请求接口:http://doman/api/back/login,那么 api 就是它的标识字段

值 为: {
	target: 要代理的(域名或IP) doman, # (必填)
	pathRewrite: { '^/oldFlag': '/newFlag', } # (非必填)
}

pathRewrite 字段作用是防止后端接口比较混乱,没有统一的标识符,
这时前端在本地开发时,可以自己添加一个统一标识符,并使用 pathRewrite 的功能,再让这个字段设置为空字符,这样就可以请求到服务端本来的 URL

如果好用还望给个 Star, 您的 Star 是我最大的动力,谢谢!

GitHub 地址

About

Create http proxy support Hot update

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published