当前位置: 代码网 > it编程>前端脚本>Node.js > NodeJS实现跨域的方法(使用示例)

NodeJS实现跨域的方法(使用示例)

2024年06月10日 Node.js 我要评论
方法一,直接在入口文件如 server.js中填写//引用express const express = require('express') //设置实例,调用express方法

方法一,直接在入口文件如 server.js中填写

//引用express 
    const express = require('express') 
    //设置实例,调用express方法 
    const app = express()    
    //设置跨域 
    app.all("*",(req,res,next)=>{ 
        res.header("access-control-allow-origin","*") 
        res.header("access-control-allow-headers","content-type") 
        res.header("access-control-allow-methods","*") 
        res.header('content-type','application/json;charset=utf-8') 
        next() 
    }) 

方法二,使用中间件cors

cors 是一种 w3c 标准,它使用额外的 http 头来告诉浏览器让运行在一个 origin (domain) 上的web应用被准许访问来自不同源服务器上的指定的资源。在 node.js 中,可以使用 cors 这个 npm 包来简化 cors 的配置。

安装cors

npm install cors

使用示例

var express = require('express') 
var cors = require('cors') 
var app = express() 
app.use(cors())  
app.get('/products/:id', function (req, res, next) { 
  res.json({msg: '这对所有来源都启用了 cors!'}) 
})   
app.listen(80, function () { 
  console.log('cors-enabled web server listening on port 80') 
}) 

单个路由配置 cors

var express = require('express') 
var cors = require('cors') 
var app = express() 
var corsoptions = { 
  origin: 'http://example.com', 
  optionssuccessstatus: 200 // some legacy browsers (ie11, various smarttvs) choke on 204 
} 
app.get('/products/:id', cors(corsoptions), function (req, res, next) { 
  res.json({msg: 'this is cors-enabled for only example.com.'}) 
}) 
app.listen(80, function () { 
  console.log('cors-enabled web server listening on port 80') 
}) 

动态来源配置 cors

var express = require('express') 
var cors = require('cors') 
var app = express() 
var whitelist = ['http://example1.com', 'http://example2.com'] 
var corsoptions = { 
  origin: function (origin, callback) { 
    if (whitelist.indexof(origin) !== -1) { 
      callback(null, true) 
    } else { 
      callback(new error('not allowed by cors')) 
    } 
  } 
} 
app.get('/products/:id', cors(corsoptions), function (req, res, next) { 
  res.json({msg: 'this is cors-enabled for a whitelisted domain.'}) 
}) 
app.listen(80, function () { 
  console.log('cors-enabled web server listening on port 80') 
}) 

三、使用 jsonp (仅限 get 请求)

jsonp 是一种非官方的跨域数据交互协议,利用 <script> 标签没有跨域限制的特点来实现跨域通信。但请注意,jsonp 只能用于 get 请求,并且存在安全风险。

示例:

app.get('/jsonp', (req, res) => {
  const callback = req.query.callback;
  const data = { message: 'hello, this is jsonp response' };
  res.type('text/javascript');
  res.send(`${callback}(${json.stringify(data)})`);
});

四、代理服务器

在开发环境中,有时候会使用代理服务器来转发请求,避免直接对 api 服务器进行跨域请求。可以使用 http-proxy-middleware 或 express 的 proxy 中间件。

综上,cors 是最常用的跨域解决方案,因为它既标准又灵活,支持各种http方法和自定义头部。其他方法如 jsonp 和代理服务器则根据具体场景选择使用。

到此这篇关于nodejs实现跨域的方法的文章就介绍到这了,更多相关nodejs跨域内容请搜索代码网以前的文章或继续浏览下面的相关文章希望大家以后多多支持代码网!

(0)

相关文章:

版权声明:本文内容由互联网用户贡献,该文观点仅代表作者本人。本站仅提供信息存储服务,不拥有所有权,不承担相关法律责任。 如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 2386932994@qq.com 举报,一经查实将立刻删除。

发表评论

验证码:
Copyright © 2017-2025  代码网 保留所有权利. 粤ICP备2024248653号
站长QQ:2386932994 | 联系邮箱:2386932994@qq.com