Не удается аутентифицировать единый вход в Angular 5. Отсутствует заголовок «Access-Control-Allow-Origin»

Question

Я пытаюсь аутентифицировать пользователя с помощью единого входа. Я застрял при использовании POST для запроса токена доступа с сервера API.

Я попытался добавить заголовок вручную с помощью перехватчика:

import { Injectable, NgModule } from "@angular/core";
import { HttpInterceptor, HttpRequest, HttpEvent, HTTP_INTERCEPTORS, HttpHandler } from "@angular/common/http";
import { Observable } from "rxjs";

@Injectable()
export class HttpRequestInteceptor implements HttpInterceptor {

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        const dupReq = req.clone({ headers: req.headers.set('Access-Control-Allow-Origin', 'https://login.eveonline.com/oauth/token')});

        return next.handle(dupReq);

    }
};

@NgModule({
    providers: [
        {
          provide: HTTP_INTERCEPTORS, useClass: HttpRequestInteceptor, multi: true
        }
    ]
})
export class InterceptorModule { }

Я попробовал это решение, потому что добавление заголовка в 'httpOptions.headers' не сработало ... Я получил идею из этого видео: https://www.youtube.com/watch?v=MN2WkxPnGTo, и этой документации: https://angular.io/guide/http#intercepting-requests-and-responses

Вот мой app.module:

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

import { AppComponent } from './app.component';
import { AuthWithEveService } from './auth-with-eve.service';
import { AppRoutingModule } from './app-routing.module';
import { UserHasAuthenticatedComponent } from './user-has-authenticated/user-has-authenticated.component';
import { UserLoginComponent } from './user-login/user-login.component';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { HttpRequestInteceptor, InterceptorModule } from './intercept.module';

@NgModule({
  declarations: [
    AppComponent,
    UserHasAuthenticatedComponent,
    UserLoginComponent
  ],
  imports: [
    BrowserModule,
    InterceptorModule,
    HttpClientModule,
    AppRoutingModule
  ],
  providers: [
    AuthWithEveService
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

А вот служба обработки POST:

import { Injectable } from '@angular/core';

import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
import { Observable } from 'rxjs';
import { ActivatedRoute } from '@angular/router';

const authorize_url: string = 'https://login.eveonline.com/oauth/authorize/';
const response_type: string = '?response_type=code';
const redirect_uri: string = '&redirect_uri=http://localhost:4200/userHasAuthenticated/callback';

const client_id: string = '&client_id='+client_id_val;

const scope: string = '&scope=esi-skills.read_skills.v1 esi-wallet.read_character_wallet.v1';


const tokenPOSTUrl = 'https://login.eveonline.com/oauth/token';

@Injectable()
export class AuthWithEveService {

  constructor(

    private http: HttpClient
  ) {}

  exchangeAuthForToken(authCode: string){

    let body = new HttpParams();
    body.set('grant_type', 'authorization');
    body.set('code', authCode);

    let httpOptions = {
      headers: new HttpHeaders()
        .set('Content-Type', 'application/x-www-form-urlencoded')
        .set('Authorization', 'Basic MDBiNzU0NTQwODllNGE1ZGFiODcwY2UzNzBlN2ExNTI6SmZLKF14RmpzMno2M248MSR0NEJDbi9dQ3JGbG1B')        
    };

    return this.http.post(tokenPOSTUrl, body, httpOptions);
  }

  SSOUrl(): string {
    return authorize_url
          + response_type
          + redirect_uri
          + client_id
          + scope;
  }

}

Я работаю над этим уже шесть дней, и сейчас я мертв в воде. Где я пытаюсь, после попытки этих решений, добавить правильный заголовок в этот запрос POST? Мне нужно получить токен для доступа к этому API.

Любая помощь будет принята с благодарностью!

Answer 1

Я думаю, вы неправильно понимаете заголовок Access-Control-Allow-Origin. Этот заголовок отправляется сервером и добавляется в ответ (см. здесь ). Похоже, что сервер eve-online не позволяет вам отправиться сюда.

Если у вас уже есть действительные учетные данные для некоторых API eveonline, вам следует установить для параметра withCredentials значение true для этих запросов.

Answer 2

Я пытался аутентифицироваться, используя методы, предназначенные для серверных приложений ... Поскольку мое приложение является клиентским, мне нужно было использовать "неявный поток", изменив запрос response_type с "code" на "token" .

Выполнение этого вернуло фрагмент с access_token, тогда как до того, как в моем запросе POST отсутствовал заголовок «Access-Control-Allow-Origin», он НЕ возвращался как действительный запрос.

Answer 3

Если сервер не находится в том же домене, что и веб-приложение, каждый ответ от сервера должен содержать заголовок Access-Control-Allow-Origin. Это из соображений безопасности.

Нет другого способа решить эту проблему.