启动本地服务+配置反向代理

首先目前前端市场中，启动前端本地服务和配置反向代理的技术已经太多了，随随便便就能列出个一二三四，我这里只是记录自己用到的两种方式，以及自己遇到的遗留问题：

第一种：Nginx    第二种：node+express

一、先说第一种，比较传统，但是nginx的不好管理的缺点一致为大家所诟病。直接上配置：

    # ml（服务名称，随意起，仅仅是给自己看的）
    server {
        listen 9000;  #（服务的端口 自定义）
        server_name localhost; #（本地访问域名,这个我不太确定，一般都为localhost）

        #后台服务
        location /api/v1 { #（需要代理的请求规则，是自定义的，可以视为正则）
            proxy_pass http://**.**.**.**:****/api/v1; # (代理服务器的地址端口)
        }
        location / { # （除去需要代理外的资源需要访问的本地路径）
            root   D:/workspace/Insight-ml/static;
            index  index.html index.htm;
        }
    }

括号内的都可以去掉，我这里只是加以解释。另外nginx对格式要求比较严格，空格及标点符号都不要错。

上面这段配置放到nignx》conf》nginx.conf中，文件结尾最后一个}内，调整对其格式。保存启动服务即可。

可以双击nginx.exe（这样不太稳定好像）。也可以在目录下执行cmd （推荐）.

关闭的时候，只能通过任务管理器手动结束进程....

 

二、再来说另一种，node+express 比较轻便，且比较好管理。

首先，安装依赖的包，node+npm就不说了，假设你已经装过了（没装的自己搜一下）

npm install -D express   //导入express框架的npm包
npm install -D http-proxy-middleware   //导入用于设置反向代理的npm包

然后，在项目的根目录下创建一个sever.js文件，代码如下：

/**
 * Created by cuishoujia on 2020/4/21.
 */
const express = require('express');
const { createProxyMiddleware } = require('http-proxy-middleware');

const app = express();

//这一句是标明项目的入口，即index.html的位置，我这里位置就是./static/index.html
app.use(express.static('./static'))

//  /api是匹配规则  target是代理服务器位置
app.use('/api', createProxyMiddleware({ 
    target: 'http://**.**.**.**:****', changeOrigin: true 
}));

app.listen(3000,_=>{
    //服务启动成功的回调，也可以不定义
    console.log('服务启动成功！');
    console.log('代理启动成功！');
});//端口自定义

 配置完成后，在当前目下启动cmd，执行 node sever  即可。停止服务ctrl+c。

另外，还可以引入ip 和 open npm包来进行一些便民服务。。。。

//注意需要先安装address包、open包
const ip = require('address').ip()	//导入address包，获取本地ip地址
const open = require('open')		//导入open包
....
....
....
app.listen(3000,_=>{
    //服务启动成功的回调，也可以不定义
    console.log('服务启动成功！');
    console.log('代理启动成功！');
    open(`http:${ip}:3000`)   //每次服务启动成功后自动打开浏览器页面
});

 

结束。两种方式。

三、再说一下我的遗留问题，已在提问区提问，这里再说一下：

https://ask.csdn.net/questions/1064581

在最初，我使用express-http-proxy设置代理启动本地服务，服务可以正常启动，访问api接口时报错405 method not allowed,接口请求时post方式，但是请求的资源并非静态资源，是个登录的接口。
用nginx设置代理可以正常访问，用express-http-proxy设置就是不行。
按着官方API一步步来的。
上代码：

/**
 * Created by Administrator on 2017/3/22.
 */
var express = require('express');
var proxy = require('express-http-proxy');
var app = express()

app.use('/api', proxy('http://**.**.**.**:5000'));

app.use(express.static('./static'))
app.listen(9001, () => {
  console.log('running')
});

令人头大的问题，我看github上也有人提问，但是没人回答。。。哪位了解的朋友知其原因，还请指个一二三，非常感谢。