1.axios

1.1前端操作

 <script>
      $.get('/api',{index:1}, function (datas) {   //向代理服务器发送get请求
         console.log(datas);                            //输出代理服务器返回的数据
    }
</script>

1.2后端操作

在终端中运行npm init //node中配置包管理器
在终端中运行npm i express //下载 express 模块
在终端中运行npm i axios //下载 axios 模块

var express = require('express');                 //导入express模块
var app = express();                                  
var axios = require('axios');                       //导入axios模块
app.use(express.static('public'))                 //挂载静态托管的资源
app.listen(3000,function(){                        //启动服务器 端口号3000
    console.log('http://127.0.0.1:3000');
})


app.get('/api',function(req,res){
    axios.get(`http://m.douyu.com/api/room/list?page=1`,{   //用axios发起ajax请求
        params : req.query
    }).then(result=>{
        console.log(result.data);                        //从目标服务器拿到的数据
        res.send(result.data);                            //将数据返回给前端，渲染数据
    })   
})

在终端中运行node 文件名 //在node环境中运行该文件

1.3原理

由服务器发起ajax请求,不受同源策略限制,因为同源策略只限制浏览器,服务器不受限制

2.代理中间件（http-proxy-middleware）

2.1前端操作

<script>
     $.get('/list', { page: 1 }, function (datas) {    //向代理服务器发送get请求
        console.log(datas);                                //输出代理服务器返回的数据
    })
</script>

2.2后端操作

在终端中运行npm init //node中配置包管理器
在终端中运行npm i express //下载 express 模块
在终端中运行npm i http-proxy-middleware //下载 axios 模块

var express = require('express');                 //导入express模块
var app = express(); 
app.use(express.static('public'))                 //挂载静态托管的资源
app.listen(3000,function(){                        //启动服务器 端口号3000
    console.log('http://127.0.0.1:3000');
})

var hpm= require('http-proxy-middleware');   //导入http-proxy-middleware模块
var proxy=hpm.createProxyMiddleware
app.use('/list',proxy({                 //接受前端发送的请求，进行处理
    target:`http://m.douyu.com/api/room/list`,  //目标服务器
    // 默认是false设置为true之后 发送请求头的host 会被设置成target
    changeOrigin:true,
    pathRewrite:{
        '^/list':''
    }
}))

在终端中运行node 文件名 //在node环境中运行该文件

3.总结

以上两种代理方式对比代理中间件的好处是:
1.ajax请求的转接,只发送一次请求比axios效率高
2.代理中间件可以一次代理多个接口
3.代理中间件转接时,无需考虑处理请求参数

转载请注明出处，谢谢
关于跨域更简单的方法：前端最简单的方法解决跨域（浏览器插件）

node跨域（代理服务器）