前端跨域问题的总结&&nodejs 中间层的路由转发

小编 2026-06-12 阅读:1435 评论:0

前后端交互的时候，跨域是避不开的问题。总结就是如下：1.Cors我在做前后端分离的时候，会采用c...

前后端交互的时候，跨域是避不开的问题。

总结就是如下：

1.Cors

我在做前后端分离的时候，会采用cors 的方法：便于其他源的调用接口，这个可以设置成任意的源头，也可以允许指定的源头。

下面的是nodejs 做后台的一个示例：

//设置跨域访问  在做前后端分离，nodejs提供接口的时候，这个设置跨域请求必不可少  app.all('*', function(req, res, next) { 　　  res.header("Access-Control-Allow-Origin", "*"); // 表示任意的源　　　　// res.header("Access-Control-Allow-Origin", "http://www.wtapi.wang"); // 只有这个网址　　　　res.header("Access-Control-Allow-Headers", "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With");　　　　res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");　　　　res.header("X-Powered-By",'unknown')　　　　res.header("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");　　　　next();});

2.nodejs 做中间层的路由转发

前端跨域问题的总结&&nodejs 中间层的路由转发

缺点，上线时候，必须启动nodejs 的服务。

举个例子：本地有个接口

http://127.0.0.1:8008/api/essayNote 这个接口返回字符串 'essay note'

现在要对这个接口进行转发，转发后的路由，

http://127.0.0.1:8009/api/apiturntest 这个接口也得返回字符串 'essay note'

现在用nodejs ，express 做路由转发，启动端口是 8009 端口，部分代码如下：

//路由转发的 转发nodejs 提供的接口exports.apiturntest = function (req,res,next) {  res.set('Content-Type', 'text/plain');  request('http://127.0.0.1:8008/api/essayNote', (error, response, body) => {    // res.send(res);    res.json(body);  })}app.get("/api/apiturntest",this.apiturntest);

request 是一个node 包，需要安装下 npm install request  ;var request = require ('request')

vue 项目中，axios http 请求服务代码：

this.$http.get('http://127.0.0.1:8008/api/essayNote')  // this.$http.get('http://127.0.0.1:8009/api/apiturntest').then(succ => {   console.log(succ.data)  }, err => {   console.log(err, 'err') })

请求成功：

前端跨域问题的总结&&nodejs 中间层的路由转发