Comment faire pour activer Access-Control-Allow-Origin angulaire 5/nodejs?

Lu beaucoup de façons, y compris pour des "Access-Control-Allow-Origin" et aucun n'a fonctionné pour moi.

J'utilise @angulaire/common/http module et l'url externe comme source de données.
par la tentative d'obtenir les données au lieu de cela, d'erreur:
/////.................

Failed to load http://accounts.......com/accounts: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access. The response had HTTP status code 503.


compte.service.ts:

JS:

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

import { Observable                    } from 'rxjs';
import { catchError                    } from 'rxjs/operators';

import { Account                       } from '../models/account';

const baseUrl     : string = 'http://accounts..................com/';
const httpOptions : any    = {
  headers: new HttpHeaders({
    //'Content-Type':  'application/json',
    'Access-Control-Allow-Headers': 'Content-Type',
    'Access-Control-Allow-Methods': 'GET',
    'Access-Control-Allow-Origin': '*'
  })
};

@Injectable()
export class AccountService {
  private isUserLoggedIn;
  private usreName;
  private account : Account;

  constructor(
    private http: HttpClient,
    private router: Router
  ) {}

  logIn (credentials: any): Observable<Account> {
    return this.http.get<Account>(baseUrl + 'accounts');
  }
}

app.le module.ts

JS:

import { BrowserModule                 } from '@angular/platform-browser';
import { HttpClientModule              } from '@angular/common/http';
import { NgModule                      } from '@angular/core';

import { routing                       } from './routing';
import { AppComponent                  } from './app.component';
import { AppGlobal                     } from './app.global';

import { AccountComponent              } from './components/account/account.component';

@NgModule({
  declarations  : [
    AppComponent,
    AccountComponent,
    ....
  ],
  imports       : [
    routing,
    BrowserModule,
    HttpClientModule,
    CookieModule.forRoot()
  ],
  providers     : [AccountService, AppGlobal],
  bootstrap     : [AppComponent]
})
export class AppModule { }

Aider s'il vous plaît

////////////////Essayé de corrigé 1

JS:

//......
import { HttpHeaders} from '@angular/common/http';
//.......
logIn (credentials: any): Observable<Account> {

    const headers = new HttpHeaders()
      .append('Content-Type', 'application/json')
      .append('Access-Control-Allow-Headers', 'Content-Type')
      .append('Access-Control-Allow-Methods', 'GET')
      .append('Access-Control-Allow-Origin', '*');
    return this.http.get<Account>(baseUrl + 'accounts',  {headers});
}

Comment faire pour activer Access-Control-Allow-Origin angulaire 5/nodejs?

J'ai toujours cette erreur :

Réponse à la demande de contrôle en amont ne passent pas de contrôle d'accès: Pas de "Access-Control-Allow-Origin' en-tête est présent sur la ressource demandée. Origine " http://localhost:4200 ' est donc pas autorisé à accéder. La réponse avait le code d'état HTTP 503.

////////////////Essayé de fixer 2

proxy.conf.json:

JS:

{
  "/api": {
    "target": "http://localhost:4200",
    "secure": false,
    "pathRewrite": {
      "^/api": ""
    },
    "changeOrigin": true,
    "logLevel": "debug"
  }
}

ng servir --proxy-configuration proxy.conf.json

aussi l'erreur

  • La SCRO doit être activé par le serveur à partir duquel vous demandez la ressource, pas de Anguleux.
  • Angular2+ est une bibliothèque de client et il n'est pas utilisé pour le serveur de rendu côté. J'utilise seulement, je suppose que webpack-dev-server doit être configuré
  • Non, webpack n'a pas besoin d'être configuré pour la SCRO. Angulaire j'ai la morve d'un client de la bibliothèque, c'est un Cadre. Voir Ab Ebube la réponse ci-dessous. Comme vous pouvez le voir, il est la configuration de la scro serveur côté NON côté client
  • J'utilise node js aussi, ne pense pas que node js doivent être configurés
  • N'importe quel serveur que vous utilisez doit être configuré. Si vous utilisez un serveur NodeJS, vous pouvez utiliser le mécanisme national de prévention paquet appelé la SCRO qui vous permet de configurer assez facilement
  • Je mnp installé braise-cli-scro, il n'est pas travaillé pour moi.
  • Ce n'est pas le seul. utilisez celui-ci: npmjs.com/package/cors. Une fois que vous l'installez, vous aurez essentiellement besoin de dire nodejs ce avec la SCRO options: "Hé, NodeJS, veuillez accepter toute demande à partir de localhost:4200". Après cela, vous devriez être bon d'aller
  • Est-il une config instruction angulaire/tapuscrit?
  • Cette réponse peut-être utile: stackoverflow.com/a/58064366/7059557

InformationsquelleAutor aaaaaaaaax10 | 2018-05-30