使用代理解决跨域问题,快速启动创建本地服务,跑打包好的项目
2021-10-13 本文已影响0人
默默无闻的小人物
前言:对于在node环境中,快速启动http服务最常用的一个插件就是 http-server,能让我们快速起一个本地服务。我们本章不讲http-server,对于http-server,有兴趣的点这里传送门
开发过程中: webpack项目我们在开发阶段可以配置代理,从而在run项目的时候接口是可以正常访问的,因为webpack也是在本地起了一个服务,然后通过代理去解决跨域等问题。
使用场景:但是我们在打包整个项目之后也想跑一下,想在本地测试一下,这时候我们可以使用node.js在本地起一个服务。这时候就比较困扰了。因为也需要代理。为了快捷我们借助别人写的工具吧。毕竟我们都是站在巨人肩膀上开发。
而且这个工具还能特别针对老型项目设计,没有使用构建工具
确保你的 nodejs 版本 >= 8.0.0,
解决跨域问题,支持本地开发热更新
安装
yarn add @gauseen/web-proxy -D # 推荐
# or
npm i @gauseen/web-proxy -D
使用
在打包后的dist
项目同级目录下,新建server.js
// 例子:
// server.js
const path = require('path')
const server = require('@gauseen/web-proxy')
const options = {
watch: false,
watchStatic: path.join(__dirname, './dist/'),
serverStatic: path.join(__dirname, './dist/'),
port: 8099,
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)
启动服务
node server.js
浏览器输入
http://localhost:8099
参数说明
参数 | 说明 | 类型 | 默认 | 是否必选 | 可选项 |
---|---|---|---|---|---|
watch | 是否开启热更新 | Boolean | false | 是 | - |
watchStatic | 热更新目录 | String | 是 | - | |
serverStatic | 静态服务目录 | String | 是 | - | |
proxyTable | 要代理的 doman | Object | 是 | - | |
port | 端口 | Number | 8008 | 否 | - |
notify | 是否在浏览器端显示通知 | Boolean | false | 否 | - |
ignores | 忽略文件内容 | Array | - | 否 | [css, html, css] |
callback | 服务启动成功回调 | Function | - | 否 | - |