Angular4 Token Authが 'auth/validate'コールを作成しています

Question

Angular2トークン認証モジュールを動作させようとしていますが、最初のロード時に '401'エラーが継続しています。

私は認証/登録/ログインが動作するようにしましたが、新しいリロード時にはいつでも誰かがログインしていないので、401エラーが発生します。

ネットワークログを見ると何らかの理由で2 validate_tokenが呼び出されますが、トークンは存在しません。最初の応答は200の応答で成功しますが、2番目の応答は401で失敗します。私は両方を比較して、私が見る唯一の違いは、2番目にcontent-typeヘッダーがないことです。

私の全体のサービスは、私は私がそれについて知らないAngular2-トークンで何かこの原因が、私はわからないよさがあると信じて

import { Injectable } from '@angular/core'; 
import {Angular2TokenService} from "angular2-token"; 
import {Subject, Observable} from "rxjs"; 
import {Response} from "@angular/http"; 

@Injectable() 
export class AuthService { 

    userSignedIn$:Subject<boolean> = new Subject(); 

    constructor(public authService:Angular2TokenService) { 

    this.authService.validateToken().subscribe(
     res => res.status == 200 ? this.userSignedIn$.next(res.json().success) : this.userSignedIn$.next(false) 
    ) 
    } 

    logOutUser():Observable<Response>{ 

    return this.authService.signOut().map(
     res => { 
     this.userSignedIn$.next(false); 
     return res; 
     } 
    ); 
    } 

    registerUser(signUpData: {email:string, password:string, passwordConfirmation:string}):Observable<Response>{ 
    return this.authService.registerAccount(signUpData).map(
     res => { 
     this.userSignedIn$.next(true); 
     return res 
     } 
    ); 
    } 

    logInUser(signInData: {email:string, password:string}):Observable<Response>{ 

    return this.authService.signIn(signInData).map(
     res => { 
     this.userSignedIn$.next(true); 
     return res 
     } 
    ); 

    } 

} 

かなり汎用的です。私はバックエンドをチェックしており、何の要求も来ていないという記録はありません。

失敗した要求

GET /認証/ validate_token HTTP/1.1 ホスト：baseUrlに 接続：キープアライブ プラグマ：キャッシュなし のCache-Control：キャッシュなし は受け入れ：アプリケーション/ JSONを 原産地：http://localhost:4200 のUser-Agent：Mozillaの/ 5.0（Windows NTの10.0; Win64の、x64の）のAppleWebKit/537.36（KHTML、ヤモリなど）クローム/ 60.0.3112.90サファリ/ 537.36 のContent-Type：アプリケーション/ JSON リファラー：http://localhost:4200/ 受け入れエンコード：gzipで、収縮させる、BR のAccept-言語：EN-US、EN; Q = 0.8

成功したリクエスト OPTIONS /認証/ validate_token HTTP/1.1 ホスト：baseUrlに 接続：キープキャッシュプラグマ：no-cache キャッシュ制御：no-cache アクセス制御要求メソッド：GET オリジン：http://localhost:4200 ユーザーエージェント：Mozilla/5.0（Windows NT 10.0; Win64; x64）のAppleWebKit/537.36（KHTML、ヤモリ）クローム/ 60.0.3112.90サファリ様/ 537.36 アクセス制御リクエスト・ヘッダー：コンテンツタイプ 受け入れ：/ リファラーを：http://localhost:4200/ 受け入れエンコード：gzipで、収縮、 br 受け入れ言語：en-US、en; q = 0.8

これは失敗した人がGET要求を出しているようで、問題を引き起こしているようですが、何が呼び出されているのか分かりません。見る方法はありますか？

Answer 1

[OK]を、ので、2つの事が... まず、あなたが

は「しかし-every-時間誰かがログインしていない新鮮なリロードに、彼らは401エラーを取得し 。」と述べています

これはうまくいくはずです。彼らが認証されていない場合、彼らは401を取得するつもりです。それは401が意味することです - "認証が必要です"。

認証中にユーザーがブラウザの「再読み込み」ボタンを押すと、401が表示されます。つまり、読み込み時に資格情報が失われていることを意味します。おそらく、ローカルストレージ。

第2に、あなたが見ている2要求の動作は、仕事でCORSです（私はバックエンドがCORSをキックする4200ではなく、別のポートにあると思います）。

OPTION要求は、CORSの観点からGET要求を行うことが許可されているかどうかを確認するために、ブラウザとサーバー間のネゴシエーションです。明らかにあなたは許可されているので、認証が必要なので、GETは進めますが、401を取得します。

この「余分な」OPTIONSリクエストは、あなたのコントロール下（Angular's）ではなく、ブラウザに焼き付けられています。それはCORSの動作です。