1、 利用package.json 安装nodejs，创建package.json文件：内容如下

"dependencies": {

  "http-proxy": "^1.16.2"

}

2、 当前目录下创建 index.js文件：内容如下
var PORT = 3000;

var projectPath = '/../project';  // 本地项目路径

var http = require('http');

var url=require('url');

var fs=require('fs');

var mine=require('./mine').types;

var path=require('path');

var httpProxy = require('http-proxy');

var proxy = httpProxy.createProxyServer({

    target: 'http://192.168.12.220:8080/',   //接口地址

    // 下面的设置用于https

    // ssl: {

    //     key: fs.readFileSync('server_decrypt.key', 'utf8'),

    //     cert: fs.readFileSync('server.crt', 'utf8')

    // },

    // secure: false

});

proxy.on('error', function(err, req, res){

    res.writeHead(500, {

        'content-type': 'text/plain'

    });

    console.log(err);

    res.end('Something went wrong. And we are reporting a custom error message.');

});

var server = http.createServer(function (request, response) {

    var pathname = url.parse(request.url).pathname;

    //var realPath = path.join("main-pages", pathname); // 指定根目录

    console.log(pathname);

    var realPath = path.join("."+projectPath+'/', pathname);

    var ext = path.extname(realPath);

    ext = ext ? ext.slice(1) : 'unknown';

    //判断如果是接口访问，则通过proxy转发

    if(pathname.indexOf("/deviceService") > -1){

        proxy.web(request, response);

        return;

    }

    fs.exists(realPath, function (exists) {

        if (!exists) {

            response.writeHead(404, {

                'Content-Type': 'text/plain'

            });

            response.write("This request URL " + pathname + " was not found on this server.");

            response.end();

        } else {

            fs.readFile(realPath, "binary", function (err, file) {

                if (err) {

                    response.writeHead(500, {

                        'Content-Type': 'text/plain'

                    });

                    response.end(err);

                } else {

                    var contentType = mine[ext] || "text/plain";

                    response.writeHead(200, {

                        'Content-Type': contentType

                    });

                    response.write(file, "binary");

                    response.end();

                }

            });

        }

    });

});

server.listen(PORT);

console.log("Server runing at port: " + PORT + ".");


３、 如 index.js 第二行所配置：在当前目录上层目录创建项目文件夹 project
放入index.html 测试页面




<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8" />

<title>1111</title>

<script>

function readFile(a,back){

setTimeout(function(){

back(a);

},1000);

}

const Thunk = function(fn) {

return function (...args) {

return function (callback) {

return fn.call(this, ...args, callback);

}

};

};

var tf = Thunk(readFile);

var gg = {

*g(){

var f1 = yield tf('fileA');

console.log('---->>',f1);

var f2 = yield tf('fileB');

console.log('---->>',f2);

// if (f2=="fileB")

// return;

// ...

var fn = yield tf('fileN');

console.log('---->>',fn);

}

}

var g = function* () {

var f1 = yield tf('fileA');

console.log('---->>',f1);

var f2 = yield tf('fileB');

console.log('---->>',f2);

// if (f2=="fileB")

// return;

// ...

var fn = yield tf('fileN');

console.log('---->>',fn);

}

const run_thunk = function (fn) {

var gen = fn();

function next(err, data) {

var result = gen.next(err);

if (result.done) return;

result.value(next);

}

next();

}

function * a(){

yield 1;

yield 2;

}

var init = function(){

// run_thunk(gg.g);

var m = setTimeout(function(){

alert('hell');

},5000);

setTimeout(function(){

clearTimeout(m);

alert('111');

},1000);

// var i = a();

// console.log(i.next());

// console.log(i.next());

// console.log(i.next());

}

init();

</script>

</head>

<body>

1111

</body>

</html>




4、cnpm install


5、node index.js 开启3000服务


6、注：mine.js 内容：




exports.types = {

"css": "text/css",

"gif": "image/gif",

"html": "text/html",

"ico": "image/x-icon",

"jpeg": "image/jpeg",

"jpg": "image/jpeg",

"js": "text/javascript",

"json": "application/json",

"pdf": "application/pdf",

"png": "image/png",

"svg": "image/svg+xml",

"swf": "application/x-shockwave-flash",

"tiff": "image/tiff",

"txt": "text/plain",

"wav": "audio/x-wav",

"wma": "audio/x-ms-wma",

"wmv": "video/x-ms-wmv",

"xml": "text/xml",

"woff": "application/x-woff",

"woff2": "application/x-woff2",

"tff": "application/x-font-truetype",

"otf": "application/x-font-opentype",

"eot": "application/vnd.ms-fontobject"

};




项目结构：     -----  nodeServer


|---- package.json


|---- index.js


|---- mine.js


|---- node_modules


-----  project


|---- index.html
												


											
在本地设置 http-proxy 代理  (前后端分离)的更多相关文章
	

    
						
  1. nginx反向代理前后端分离项目（后端多台）
		
    目前软件架构都比较流行前后端分离,前后端的分离也实现了前后端架构的分离,带来的好处 —— 整个项目的开发权重往前移,实现真正的前后端解耦,动态资源和静态资源分离,提高了性能和扩展性. 通常Spring ...
    
		
    2. 
								
  2. express的proxy实现前后端分离
		
    var express = require('express') var proxy = require('http-proxy-middleware') var app = express() ap ...
    
		
    3. 
						
  3. mock的使用及取消，node模仿本地请求：为了解决前后端分离，用户后台没写完接口的情况下
		
    借鉴:https://www.jianshu.com/p/dd23a6547114 1.说到这里还有一种是配置node模拟本地请求 (1)node模拟本地请求: 补充一下 [1]首先在根目录下建一个d ...
    
		
    4. 
						
  4. 前后端分离产生的跨域问题的解决方案之--jsonp、nginx代理、设置头信息等
		
    前言 在前后端没有分离的时候,前端开发要么是写静态页面,数据渲染后端来做,要么就是前端的页面和后端的代码刚开始的时候就合并在一起,每次后端代码更新了之后,前端也要更新一下代码,然后重启一下服务,还是比 ...
    
		
    5. 
						
  5. 在centos7.6上部署前后端分离项目Nginx反向代理vue.js2.6+Tornado5.1.1，使用supervisor统一管理服务
		
    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_102 这一次使用vue.js+tornado的组合来部署前后端分离的web项目,vue.js不用说了,前端当红炸子鸡,泛用性非常广 ...
    
		
    6. 
						
  6. nginx反向代理实现前后端分离&跨域问题
		
    1.代理和跨域 1.1 正向代理 1)用户希望代理服务器帮助其和要访问服务器之间实现通信,需要: a.用户IP报文的目的IP=代理服务器IP: b.用户报文端口号=代理服务器监听端口号: c.HTTP ...
    
		
    7. 
						
  7. 前后端分离跨域 关于前后端分离开发环境下的跨域访问问题（angular  proxy=>nginx ）
		
    前后端分离后遇到了跨域访问的问题: angular1中使用proxy很麻烦,最后还是失败结束:最后总结3种方法如下: 本人使用的第一种方法,只是开发环境下使用很方便! 1:禁掉谷歌的安全策略(Turn ...
    
		
    8. 
						
  8. nginx 前后端分离 代理转发，解决跨域问题
		
    场景 适用于公司有前端,项目采用前后端分离.类似于我们 后端 springboot 提供接口,前端专门写html调用相应的接口,解决跨域问题 配置说明 worker_processes 1; even ...
    
		
    9. 
						
  9. 简述前后端分离的情况下，Vue实现点击图片下载到本地（并实现IE11浏览器的兼容）
		
    1.简述 在前后端分离的项目中涉及跨域问题,通常都会使用token进行验证.最近在前后端分离的项目中在一个问题上搞了很久,就是以前下载附件或者导出数据为文件的时候,在以前的那些项目前端可以直接用 wi ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. mysql 存储过程简单实例
			
    一.什么是存储过程 存储过程(Stored Procedure)是在大型数据库系统中,一组为了完成特定功能的SQL 语句集,存储在数据库中,经过第一次编译后再次调用不需要再次编译,用户通过指定存储过程 ...
    
			
    2. 
						
  2. [原]关于phycis集成到osgearth的（瞎写写）
			
    基于全球的物理系统集成技术 引言 随着····· 概述 基于osgEarth渲染引擎,引入先进的物理引擎physics. 本篇主要讲述:原理和解决思路. 原理要点: 空间坐标转换 物理引擎与渲染引擎同 ...
    
			
    3. 
						
  3. python调用虹软2.0第三版
			
    这一版,对虹软的功能进行了一些封装,添加了人脸特征比对,比对结果保存到文件,和从文件提取特征进行比对,大体功能基本都已经实现,可以进行下一步的应用开发了 face_class.py from ctyp ...
    
			
    4. 
						
  4. Python 爬虫-Robots协议
			
    2017-07-25 21:08:16 一.网络爬虫的规模 二.网络爬虫的限制 • 来源审查:判断User‐Agent进行限制 检查来访HTTP协议头的User‐Agent域,只响应浏览器或友好爬虫的 ...
    
			
    5. 
						
  5. Java注解的使用,类似于C#的Attribute
			
    1.定义注解,代码如下: import java.lang.annotation.*; /** * 定义注解类,用于注解某个类或方法 * * @author Administrator * */ @T ...
    
			
    6. 
						
  6. MyBatis3-基于注解的示例
			
    在基于注解的示例中,可以简化编写XML的过程,全部采用注解方式进行编写,并在注解上写SQL语句,语句和XML的语句保持一致,并且可以省略掉XML文件不用引入的好处.但还有一点,基于注解的方式还没有百分 ...
    
			
    7. 
						
  7. 基于DOMContentLoaded实现文档加载完成后执行的方法
			
    我们有时可能需要一些在页面加载完成之后执行的方法,其实js原生就提供了onload方法,所以我们最简单的办法就是直接给onload赋值一个函数,在页面加载完成之后就会自动执行 widnow.onloa ...
    
			
    8. 
						
  8. php安装redis扩展全
			
    一.安装redis mac 下安装也可以使用 homebrew,homebrew 是 mac 的包管理器. 1.执行 brew install redis 2.启动 redis,可以使用后台服务启动  ...
    
			
    9. 
						
  9. CentOS服务器安装FFmpeg指南
			
    CentOS服务器安装FFmpeg指南 服务器系统环境为:CentOS 6.5(final): 在服务器成功安装FFmpeg颇废了一番功夫,总结一下成功安装的过程,希望对大家有用 ^_^ : Ps:使 ...
    
			
    10. 
						
  10. How do you add?（递推）
			
    题意:求将n分为k个数相加的种数. 如:n=20,k=2,则可分为: 0+20=20 1+19=20 2+18=20 ....... 20 +0=20 共21种方案. 解析:令f(n,m)表示将n分为 ...
    
			
    11.