express配置跨域


前后端分離場景后端需要配置跨域,否則瀏覽器那端跨域請求會報錯。

 

跨域要配置的:

app.all('*', (req, res, next) => {
  // google需要配置,否則報錯cors error
  res.setHeader('Access-Control-Allow-Credentials', 'true')
  // 允許的地址,http://127.0.0.1:9000這樣的格式
  res.setHeader('Access-Control-Allow-Origin', req.get('Origin'))
  // 允許跨域請求的方法
  res.setHeader(
    'Access-Control-Allow-Methods',
    'POST, GET, OPTIONS, DELETE, PUT'
  )
  // 允許跨域請求header攜帶哪些東西
  res.header(
    'Access-Control-Allow-Headers',
    'Origin, X-Requested-With, Content-Type, Accept, If-Modified-Since'
  )
  next()
})

  

  

整體寫法例子:

const express = require('express')
const app = express()
const port = 9000

let mall_data = require('./data/mall')

app.all('*', (req, res, next) => {
  // google需要配置,否則報錯cors error
  res.setHeader('Access-Control-Allow-Credentials', 'true')
  // 允許的地址,http://127.0.0.1:9000這樣的格式
  res.setHeader('Access-Control-Allow-Origin', req.get('Origin'))
  // 允許跨域請求的方法
  res.setHeader(
    'Access-Control-Allow-Methods',
    'POST, GET, OPTIONS, DELETE, PUT'
  )
  // 允許跨域請求header攜帶哪些東西
  res.header(
    'Access-Control-Allow-Headers',
    'Origin, X-Requested-With, Content-Type, Accept, If-Modified-Since'
  )
  next()
})

app.post('/mall/createMall', (req, res) => {
  res.send({
    code: 0,
    msg: '創建成功!',
  })
})

app.get('/mall/queryMall', (req, res) => {
  res.send({
    code: 0,
    sum_count: mall_data.mall.length,
    data: mall_data.mall,
  })
})

app.get('/mall/getMallList', (req, res) => {
  let mallId = req.query.mallId
  let data = {}
  for (let item of mall_data.mall) {
    if (item.id == mallId) {
      data = item
      break
    }
  }
  res.send({
    code: 0,
    data: data,
  })
})

app.listen(port, () => {
  console.log(`Example app listening at http://localhost:${port}`)
})

  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM