CORS 无法识别我的前端的 IP 地址答案

【问题标题】：CORS does not recognize the IP address of my frontendCORS 无法识别我的前端的 IP 地址
【发布时间】：2021-05-20 02:45:43
【问题描述】：

早上好。我的后端的 Cors 有问题，Cors 表明我列入白名单的 ip 地址与我的前端使用的不一样。

这是将数据发送到后端的服务：

import { Injectable } from '@angular/core';
import { Persona } from '../modelos/persona';
import { Observable, throwError } from 'rxjs';
import { catchError, tap, map } from 'rxjs/operators';
import {HttpClient,HttpErrorResponse,HttpHeaders }from '@angular/common/http'

@Injectable({
  providedIn: 'root',
})
export class PersonaService {

  headers=new HttpHeaders();

  selectedPersona: Persona;
  personas:Persona[];
  readonly URL_API='http://localhost:3000/Inicio/Persona';
  
  constructor(private http: HttpClient) { 
    this.selectedPersona=new Persona();
  }

  postPersona(persona:Persona){
    return this.http.post(this.URL_API,persona)
  }

请求来自我前面的http://209.145.52.133:8080

在我的后端我设置了允许的地址：

app.use(cors({origin:'http://209.145.52.133:8080'}));

最后它返回错误：

从源“http://209.145.52.133:8080”访问“http://localhost:3000/Inicio/Login”处的 XMLHttpRequest 已被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：“Access-Control-Allow-Origin”标头的值“http://209.145.52.133/”不等于提供的来源。

【问题讨论】：

检查请求中的 Origin 标头。这将提供您需要列入白名单的正确值。

标签： node.js angular cors

【解决方案1】：

这可能对你有帮助

app.use((req, res, next) => {
        res.header('Access-Control-Allow-Origin', req.headers.origin);
        res.header(
            'Access-Control-Allow-Headers',
            'Origin, X-Requested-With, Content-Type,  Accept, Authorization',
        );
        res.header(
            'Access-Control-Allow-Methods',
            'GET,POST,fetch, PATCH,OPTIONS,DELETE',
        );
        res.header('Access-Control-Allow-Credentials', true);

        if (req.method === 'OPTIONS') {
            res.header(
                'Access-Control-Allow-Methods',
                'PUT, POST, PATCH,FETCH, DELETE, GET',
            );
            return res.json({});
        } else {
            next();
        }
    });

如果没有，你可以从 express cors documentation 试试这个

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.'})
})

【讨论】：