Node.js配合节点-http-代理解决本地开发创建交互式、快速动态网页应用的网页开发技术跨域问题

情景：

前后端分离，本地前端开发调用接口会有跨域问题，一般有以下3种解决方法：

1.后端接口打包到本地运行（缺点：每次后端更新都要去测试服下一个更新包，还要在本地搭建爪哇岛运行环境，麻烦)

2.克-奥二氏分级量表跨域：后端接口在返回的时候，在页眉中加入访问控制-允许-来源' :*之类的（有的时候后端不方便这样处理，前端就蛋疼了)

3.用nodejs搭建本地超文本传送协议(超文本传输协议的缩写)服务器，并且判断访问接口统一资源定位器时进行转发，完美解决本地开发时候的跨域问题。

用到的技术：

1.nodejs搭建本地超文本传送协议(超文本传输协议的缩写)服务器

2.应用节点-http-代理，做接口全球资源定位器(统一资源定位符)的转发

具体方法：

1.node.js搭建本地超文本传送协议(超文本传输协议的缩写)服务器参考了肖恩谢的《nodejs搭建本地http服务器》

2.node.js做转发使用节点-http-代理实现，官方文档：https://github。com/nodejitsu/node-http-proxy #使用-https

3.操作方法参考了：http://hao.jser.com/archive/10394/？UTM _来源=tuicolutm _ medium=参考

4.下面是我自己的实战操作

项目准备

1.国家预防机制初始化

npm init2 .安装节点-http-代理模块

国家预防机制安装http-proxy - save-dev3 .项目结构

下面的例子中，我们把超文本标记语言文件直接放在根目录。/',也可以指定一个网站目录，在proxy.js中可以自定义

配置超文本传送协议服务器和代理人转发

var PORT=3000 var http=require(' http ')；var URL=必选(' URL ')；var fs=require(' fs ')；var mine=require(' ./my ').类型；var path=require(' path ')；var Http proxy=require(' Http-proxy ')；var proxy=httproxy。createproxy server({ target : ' http://192。168 .10 .38:8180/',//接口地址//下面的设置用于https//SSL : {//key : fs。readfilesync(' server _ decrypt。key '，' utf8 '，//cert : fs。readfilesync('服务器。CRT '，' utf8 ')/}，//secure : false })；proxy.on('error '，function(err，req，res){res.writeHead(500，{ ' content-type ' : ' text/plain ' })；控制台。日志(err)；"出事了。我们报告了一条自定义错误消息。);});var server=http.createServer(函数（请求，响应){ var pathname=URL。解析(请求。网址).路径名；//var realPath=path。连接('主页'，路径名)；//指定根目录var realPath=path.join(' ./',路径名);console.log(路径名);控制台。日志(realPath)；var ext=路径。扩展名(真实路径)；ext=ext？ext.slice(1) : "未知";//判断如果是接口访问，则通过代理人转发if(路径名。indexof(' mspj-mall-admin ')0){ proxy。web(请求，响应);返回；}fs.exists(realPath，函数(存在){if(！存在){response.writeHead(404，{ ' Content-Type ' : ' text/plain ' })；响应。写入('在此服务器上找不到此请求“网址”路径名');回应。end()；} else {fs.readFile(realPath，' binary '，函数(err，file){ if(err){ response。写头(500，{ ' Content-Type ' : ' text/plain ' })；回应。end(err)；} else { var content type=mine[ext]| | ' text/plain '；response.writeHead(200，{ ' Content-Type ' : Content Type })；response.write(文件，' binary ')；回应。end()；}});}});});服务器。倾听(PORT)；console.log('服务器在端口： '端口上运行。' ');我的。射流研究…

这里参考肖恩谢的源码，补充了几个字体文件的哑剧演员。

出口。type={ ' CSS ' : ' text/CSS '，' gif': 'image/gif '，' html': 'text/html '，' ico': 'image/x-icon '，' jpeg': 'image/jpeg '，' JPEG ' : ' image/JPEG '，' js': 'text/javascript '，' json': 'application/json '，' pdf ' : '以上就是全部源码

然后将项目中的接口地址更改为http://localhost:3000/.

启动nodejs服务

启动cmd，找到项目目录，然后运行

节点proxy.js访问：

http://localhost :3000/index . html

可以看出，http://localhost33603000/.在项目中调用将从http://192/.并转发给当地。

所以没有跨域。

上面提到的是边肖推出的Node.js配合node-http-proxy解决本地ajax开发的跨域问题，希望对大家有所帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！