express 配置跨域

781次阅读

共计 928 个字符,预计需要花费 3 分钟才能阅读完成。

express 配置跨域

前后端分离开发,经常遇到的问题就是跨域问题,以前会使用 jsonp 进行跨域,但不是很优雅;现在有了 CORS 后端配置可允许跨域,这样可以很优雅的解决跨域问题。

在部署项目时,可选择 nginx 配置反向代理,这样也能解决跨域问题,但是在开发阶段,往往会启动两个服务,使用不同的端口,就会有跨域问题的产生。

使用 express 开发后端,进行简单的配置解决跨域问题。

跨域前:

express 配置跨域

后段代码:

const express = require('express');

const app = express()

app.get('/', (req, res) => res.send('Hello World!'))

app.listen(3004, () => console.log('Example app listening on port 3001!'))

解决跨域后:

express 配置跨域 express 配置跨域

后端代码:

const express = require('express');

const app = express()
// 设置允许跨域访问该服务.
app.all('*', function (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();});
  
  
app.get('/', (req, res) => res.send('Hello World!'))

app.listen(3005, () => console.log('Example app listening on port 3005!'))

这样解决跨域的问题真的是很简单,后端进行简单的配置就行可以。现在的大部分后端框架都支持后端跨域,express、spring 等。如果你不知道你现在的项目是怎么解决跨域问题的,可以全局搜索项目,使用 Access-Control-Allow 关键词进行搜索。

正文完
 0