Ошибка Cors при получении данных от узла к углу - PullRequest
0 голосов
/ 14 сентября 2018

Я получаю ошибку

Перенаправление с 'http://localhost:4040/admin' на 'http://localhost:4040/admin/' заблокирован политикой CORS: Нет Заголовок «Access-Control-Allow-Origin» присутствует в запрошенном ресурс. Происхождение 'http://localhost:4200' поэтому не допускается доступ.

Где мой угловой сервер 6 на порту 4200 и узел на порту 4040.

Я все перепробовал, и этот код дошел до меня.

Узел JS

   app.use(function(req, res, next) {
      // Website you wish to allow to connect
      res.setHeader('Access-Control-Allow-Origin', 'http://localhost:4200');

      // Request methods you wish to allow
      res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');

      // Request headers you wish to allow
      res.setHeader('Access-Control-Allow-Headers', "access-control-allow-origin, origin,accept, X-Requested-With, content-type, Access-Control-Request-Method, Access-Control-Request-Headers");

      // Set to true if you need the website to include cookies in the requests sent
      // to the API (e.g. in case you use sessions)
      res.setHeader('Access-Control-Allow-Credentials', true);
      next();
    });

   app.get('/admin', async function(req, res) {
res.send({
      data: "HI"
    });
}

Служба угловой передачи данных

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})

export class DataService {

  origin = "http://localhost:4040";

  constructor(public http:HttpClient) {

  }

  getAdminData(){
    const headers = new HttpHeaders()
          .set('Access-Control-Allow-Origin', '*')
          .set('Content-Type', 'application/json');

    return this.http.get(this.origin+'/admin', 
    {
      headers: headers
    })}

Угловая составляющая

import { Component, OnInit } from '@angular/core';
import {Data} from "../../interfaces/dashboard.interface";
import { DataService } from  "../../services/data.service";

@Component({
  selector: 'app-admindashboard',
  templateUrl: './admindashboard.component.html',
  styleUrls: ['./admindashboard.component.css']
})
export class AdmindashboardComponent implements OnInit {

  Data: Data[];
  constructor(private dataService:DataService) { }

  ngOnInit() {
    console.log('HERE');
    this.dataService.getAdminData().subscribe((res) => {
      console.log(res);
      // this.posts = posts;
      // for(let i = this.currentLimit; i < this.pageLimit; i++){
      //   console.log(this.somePosts, posts[i]);
      //   this.somePosts.push(this.posts[i]);
      //   this.currentLimit = 10;
      // }
    });
  }

}

1 Ответ

0 голосов
/ 14 сентября 2018

Обновление. Попробуйте это:

// Website you wish to allow to connect
res.header('Access-Control-Allow-Origin', '*');

// Request methods you wish to allow
res.header('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');

// Request headers you wish to allow
res.header('Access-Control-Allow-Headers', 'Accept, Content-Type, X-Requested-With', 'X-HTTP-Method-Override');

// Set to true if you need the website to include cookies in the requests sent
// to the API (e.g. in case you use sessions)
res.header('Access-Control-Allow-Credentials', true);

if (req.method === 'OPTIONS') {
    res.sendStatus(200);
} else {
    next();
}

В вашем клиентском приложении не устанавливайте заголовки

...