Express服务端快速解决不同域名访问cors跨域

这里使用npm包cors

安装

npm i cors

在Express服务端入口app.js配置

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
const formidable = require('express-formidable');

const cors = require('cors');
const { corsOptions } = require("./utils/cors");

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');


// express
var app = express();

// 解决cors跨域
app.use(cors(corsOptions));

utils/cors.js文件

// 允许跨域访问域名白名单 此处只需要配置一级域名即可 比如说只允许test.com.cn和localhost:3000这两个域名访问,可以设置whitelist如下:
const whitelist = ['test.com.cn','localhost:3000']

const corsOptions = {
  origin: function (origin, callback) {
    for (let i = 0; i < whitelist.length; i++) {
      const item = whitelist[i]
       
      // 可以允许跨域请求
      if (origin?.indexOf(item) !== -1) {
          callback(null, true)
          return
      }
    }
    
    // // 能走到这说明不是白名单的域名,不允许直接跨域请求
    callback(new Error('Not allowed by CORS'))
  }
}


module.exports = {
    corsOptions
}

此时服务端部署接口服务器域名比如:www.test.com.cn, 比如获取列表数据接口https://www.test.com.cn/api/getDataList

此时,本地启动:http://localhost:3000,也能访问https://www.test.com.cn/api/getDataList接口数据,目前cors不支持IE10以下版本浏览器,其他大部分浏览器已经支持

你可能感兴趣的:(express)