上一篇文章写了使用docker来做nginx镜像实现本地的页面代理以及接口转发，但是需要下载docker，这个对于很多人来说还是显得比较麻烦，于是这个文章就是介绍如何只用node就可以代理本地的页面和接口转发。
最简单的方法就是
1.到https://github.com/jiangzhenfei/server 下载，包括 proxy-conf.js 文件和 server.js 文件，复制到你需要代理的页面的目录，一般是index.html目录，
2.配置 proxy-conf.js 文件：如下仅供参考
//代理配置
let conifg = {
'/kdcos/':{ //将/kdcos/开头的请求代理到http://172.24.4.220:80这台服务器（类似于vue的代理配置）
target: 'http://172.24.4.220:80',
},
'/osm/':{ //将/osm/开头的请求代理到http://120.79.90.199:80这台服务器
target: 'http://120.79.90.199:80',
}
}
module.exports = conifg //导出配置文件
3.在当前目录命令行输入node server.js即可。
下面就是具体如何实现的，有兴趣的可以看看。并不影响使用
1.首先我们介绍如何启动服务器并且显示本地的页面
1.1如何起服务器（文件为index.js）
let http = require('http')
let app = http.createServer ( function(request,response){
let url = request.url
if(request.url!=='/favicon.ico'){//清除第二次访问
response.end('hello world!')
}
} )
app.listen(8000)
这个时候我们在当前的目录命令行输入 node index.js,这个时候打开浏览器输入localhost:8000，就可以在页面看大hello world!.
1.2 基于上面的思路，我们可以通过文件读取的方式将本地的index.html文件读取然后传入respones.end()
let http = require('http')
let app = http.createServer ( function(request,response){
let url = request.url
if(request.url!=='/favicon.ico'){//清除第二次访问//正常的读取文件和其他资源加载
fs.readFile( __dirname + ( url==='/' ? '/index.html':url ), function( err, data ){
if( err ){
console.log( 'file-err',err )
}else{
response.end( data )
}
});
}
} )
当输入localhost:8000或者localhost:8000/index.html也面就会出现当前所在目录的index.html页面，因为我们读取了该页面相应给该端口。
2.如何实现接口的转发
以上我们实现启动本地服务器展现页面，但是页面中的ajax接口如何实现转发呢，比如我的url为/osm/client/sort的路由需要转发到http://120.79.90.199:80这台服务器上，我们该如何实现呢
2.1使用http.request实现接口的转发
var http = require('http')
var opt = {
host:'这里放代理服务器的ip或者域名',
port:'这里放代理服务器的端口号',
method:'POST',//这里是发送的方法
path:' https://www.google.com', //这里是访问的路径
headers:{
//这里放期望发送出去的请求头
}
}
//以下是接受数据的代码
var body = '';
var req = http.request(opt, function(res) {
console.log("Got response: " + res.statusCode);
res.on('data',function(d){
body += d;
}).on('end', function(){
console.log(res.headers)
console.log(body)
});
}).on('error', function(e) {
console.log("Got error: " + e.message);
})
req.end();
2.2监听页面中的http请求，查看是否存在需要转发的接口，利用上述方法转发得到结果后返回前台(server.js)
let http = require('http')
let fs = require('fs')
//哪些url请求需要代理（代理配置）
let conifg = {
'/kdcos/':{// /kdcos/开头的url需要代理到http://172.24.4.220:80这台服务器
target: 'http://172.24.4.220:80',
},
'/osm/':{
target: 'http://120.79.90.199:80',
}
}
let app = http.createServer ( function(request,response){
let url = request.url
if(request.url!=='/favicon.ico'){//清除第二次访问
//请求的数据是否存在代理
for ( var key in conifg){
if( url.indexOf(key) >-1 ){
let info = conifg[key].target.split(':')
let opt = {
protocol: info[0]+':',
host: info[1].slice(2),
port: info[2] || 80,
method: request.method,//这里是发送的方法
path: url, //这里是访问的路径
json: true,
headers: request.headers
}
proxy( opt, response,request )//代理方法
return;
}
}
//正常的读取文件和其他资源加载
fs.readFile( __dirname + ( url==='/' ? '/index.html':url ), function( err, data ){
if( err ){
console.log( 'file-err',err )
}else{
console.log(data)
response.end( data )
}
});
}
} )
//代理转发的方法
function proxy( opt,res ,req){
var proxyRequest = http.request(opt, function(proxyResponse) { //代理请求获取的数据再返回给本地res
proxyResponse.on('data', function(chunk) {
console.log( chunk.toString('utf-8') )
res.write(chunk, 'binary');
});
//当代理请求不再收到新的数据，告知本地res数据写入完毕。
proxyResponse.on('end', function() {
res.end();
});
res.writeHead(proxyResponse.statusCode, proxyResponse.headers);
});
//data只有当请求体数据进来时才会触发
//尽管没有请求体数据进来，data还是要写，否则不会触发end事件
req.on('data', function(chunk) {
console.log('in request length:', chunk.length);
proxyRequest.write(chunk, 'binary');
});
req.on('end', function() {
//向proxy发送求情，这里end方法必须被调用才能发起代理请求
//所有的客户端请求都需要通过end来发起
proxyRequest.end();
});
}
app.listen(8000)
console.log('server is listen on 8000....')
现在我们在当前目录命令行输入 node server.js,浏览器打开localhost:8000就可以看到页面。
2.3现在看看我们的index.html页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="./node_modules/jquery/dist/jquery.min.js"></script>
</head>
<body>
<h1>hahah</h1>
<button class="button"> hahh </button>
<button class="button2"> hahh </button>
<script src="./a.js"></script>
<script>
$('.button').click( function(){
$.ajax({
url:'/kdcos/app/service?page=1&pageSize=5&name=',
headers:{
"x-auth-token": "6491f900-a968-41b4-b56b-778eca4eb8b1",
},
success:function(e){
}
})
} )
$('.button2').click( function(){
$.ajax({
url:'/osm/client/sort',
success:function(e){
}
})
} )
</script>
</body>
</html>
我们点击页面中的按钮1和按钮2，就可以看到不同的返回，来自两台不同的服务器。