首页 > 解决方案 > 响应具有 HTTP 状态代码 400 + 请求的资源上不存在“Access-Control-Allow-Origin”标头。- 平均堆栈

问题描述

我需要将字符串传递给节点,并在浏览器控制台中提供以下响应:

无法加载http://localhost:3003/api/buscarCep:请求的资源上不存在“Access-Control-Allow-Origin”标头。因此,不允许访问源“ http://localhost:4000 ”。响应的 HTTP 状态代码为 400。

我正在使用带有 Angular 1 的 MEAN 堆栈。

我的服务器节点:

const port = 3003

const bodyParser = require('body-parser')
const express = require('express')
const server = express()
const allowCors = require('./cors')
const queryParser = require('express-query-int')

server.use(bodyParser.urlencoded({ extended: true }))
server.use(bodyParser.json())
server.use(allowCors)
server.use(queryParser())

server.listen(port, function() {
  console.log(`BACKEND is running on port ${port}.`)
}) 

module.exports = server

服务器是一个节点,位于我正在测试的同一台机器上。所以都是本地的。我的服务器的 CORS 策略如下:

module.exports = function(req, res, next) {
  res.header('Access-Control-Allow-Origin', '*')
  res.header('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE')
  res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept, Authorization')
  next()
}

角度工厂:

(function () {
    angular.module('primeiraApp').factory('apiExterna', [
        '$http',
        'consts',
        ApiExterna
    ])

    function ApiExterna($http, consts) {

        function buscarCep(cep) {
            $http.post(`http://localhost:3003/api/buscarCep`, cep)
                .then(resp => {  
                    console.log(resp)          
                    return null
                }).catch(function (resp) {
                    console.log("erro")
                })
        }

        return { buscarCep }
    }
})()

CEP 参数从控制器接收。到目前为止一切顺利,问题从现在开始:

后端路由:

const express = require('express')
const auth = require('./auth')

module.exports = function(server) {

  /*
   * Rotas protegidas por JWT
   */
  const protectedApi = express.Router()
  server.use('/api', protectedApi)

  protectedApi.use(auth)

  // rotas da API

  const alertasService = require('../api/alertas/alertasService')
  alertasService.register(protectedApi, '/alertas')

  const ApiService = require('../api/apiExterna/apiService')
  protectedApi.post('/buscarCep', ApiService.buscarCep)

“auth”是一个用于应用程序认证的模块。

在这里我应该收到 CEP:

const _ = require('lodash')
const fetch = require('node-fetch')

const buscarCep = (req, res, next) => {
    const cep = req.body.cep
}

module.exports = { buscarCep }

最奇怪的是,例如,“警报”路线上的所有内容都有效,但在那篇文章中没有。我做错了吗?

标签: angularjsnode.jsexpresscors

解决方案


您可以使用更容易的 npm 库 cors cors-npm

你不需要使用 express-cors

const allowCors = require('./cors')

推荐阅读