我正在尝试使Angular2 Token Auth模块工作,但在第一次加载时出现连续的'401'错误 .
我已经让auth / registration / login工作了,但是在重新加载时 - 每当有人没有登录时,他们会得到401错误 .
观察网络日志我发现由于某种原因它会进行2次 validate_token
调用,但不存在任何令牌 . 第一个成功了 200
响应 - 但第二个失败了 401
. 我've compared both and the only difference I see is that the 2nd doesn'有 content-type
Headers .
我的整个服务非常通用
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
}
);
}
}
我相信Angular2-Token中有一些我不知道的东西导致了这个但是我不确定 . 我检查了后端,它没有任何请求记录 .
Failed Request
GET / auth / validate_token HTTP / 1.1主机:baseUrl连接:keep-alive Pragma:no-cache Cache-Control:no-cache接受:application / json来源:http://localhost:4200 User-Agent:Mozilla / 5.0(Windows NT 10.0; Win64; x64)AppleWebKit / 537.36(KHTML,与Gecko一样)Chrome / 60.0.3112.90 Safari / 537.36内容类型:application / json Referer:http://localhost:4200/ Accept-Encoding:gzip,deflate,br Accept-Language:en-US,en; q = 0.8
Successful Request OPTIONS / auth / validate_token HTTP / 1.1主机:baseUrl连接:keep-alive Pragma:no-cache Cache-Control:no-cache访问控制请求方法:GET原点:http://localhost:4200 User-Agent:Mozilla / 5.0(Windows NT 10.0; Win64; x64)AppleWebKit / 537.36(KHTML,与Gecko一样)Chrome / 60.0.3112.90 Safari / 537.36 Access-Control-Request-Headers:content-type Accept:/ Referer:http://localhost:4200/ Accept-Encoding:gzip,deflate,br Accept-Language:en-US,en; q = 0.8
似乎失败者正在发出GET请求,从而导致问题,但我不知道是什么调用此调用 . 有办法看吗?
1 回答
好的,所以有两件事......首先,你说明了这一点
嗯,这就是它的工作方式 . 如果他们没有经过身份验证,他们将获得401.这就是401意味着 - “需要身份验证” .
如果您的意思是,如果用户在进行身份验证时点击浏览器的“重新加载”按钮,则会获得401,这意味着您在重新加载时丢失了凭据 - 您可能希望将它们存储在本地存储中 .
其次,您正在看到的两个请求行为是CORS正在工作(我猜测您的后端位于不同的端口,而不是4200,这使得CORS启动) .
OPTION请求是浏览器和服务器之间的协商,以查看是否允许您从CORS的角度提出GET请求 . 显然你是被允许的,所以GET继续,但获得401,因为需要身份验证 .
这个“额外的”OPTIONS请求不在你的控制之下(或者Angular的),它已经融入浏览器,而这正是CORS的工作方式 .