角度2通用,nodejs中的身份验证
我下载了nodejs的通用启动器,并开始从旧的angular-rc4迁移我的网站。 但是当我必须实现身份验证(在我的情况下它是存储在localStorage中的JWT)时,服务器不具有localStorage和cookie,以便角度仅在客户端上呈现。
我遵循本指南:https://github.com/angular/universal-starter/issues/148,但它没有奏效。
以下是我的代码:
authentication.services.ts
import { OpaqueToken } from '@angular/core';
export let AUTH_SERVICES = new OpaqueToken('auth.services');
export interface AuthenticationService {
forgotPassword(email: any);
isAuthenticated();
getCurrentUser();
refreshToken();
signin(user : any);
signout();
signup(user : any);
}
server.authentication.ts
import { Injectable } from '@angular/core';
import { AuthenticationService } from './authentication.services';
@Injectable()
export class ServerAuthenticationService implements AuthenticationService {
forgotPassword(email: any) {
throw new Error('Forgot password cannot be called while doing server side rendering');
}
isAuthenticated() {
return false;
}
getCurrentUser(){
if(this.isAuthenticated()) {
return {};
}
return {};
}
refreshToken() {
}
signin(user : any) {
throw new Error('Login cannot be called while doing server side rendering');
}
signout() {
throw new Error('Logout cannot be called while doing server side rendering');
}
signup(user : any) {
throw new Error('Sign up cannot be called while doing server side rendering');
}
}
clientAuthentication.services.ts
@Injectable()
export class UserService implements AuthenticationService {
forgotPassword(email: any){
// client implementation
}
isAuthenticated() {
// client implementation
}
getCurrentUser() {
// client implementation
}
refreshToken() {
// client implementation
}
signin(user : any){
// client implementation
}
signout(){
// client implementation
}
signup(user : any) {
// client implementation
}
}
app.browser.module.ts
@NgModule({
bootstrap: [ AppComponent ],
declarations: [ AppComponent ],
imports: [
UniversalModule, // BrowserModule, HttpModule, and JsonpModule are included
FormsModule,
SharedModule,
HomeModule,
AboutModule,
NavbarModule,
AppRoutingModule
],
providers: [
{ provide: 'isBrowser', useValue: isBrowser },
{ provide: 'isNode', useValue: isNode },
{ provide: 'LRU', useFactory: getLRU, deps: [] },
{ provide: AUTH_SERVICES, useFactory: UserService},
CacheService
]
})
app.node.module.ts
@NgModule({
bootstrap: [ AppComponent ],
declarations: [ AppComponent ],
imports: [
UniversalModule, // NodeModule, NodeHttpModule, and NodeJsonpModule are included
FormsModule,
SharedModule,
HomeModule,
AboutModule,
NavbarModule,
AppRoutingModule
],
providers: [
{ provide: 'isBrowser', useValue: isBrowser },
{ provide: 'isNode', useValue: isNode },
{
provide: 'LRU',
useFactory: getLRU,
deps: [
[new Inject('LRU'), new Optional(), new SkipSelf()]
]
},
{ provide: AUTH_SERVICES, useFactory: ServerAuthenticationService },
CacheService
]
})
那么如何通过浏览器刷新通过路由器转换与服务器上的浏览器导航到客户端的页面时获得相同的页面输出?
提前致谢
在节点中,您可以在快速应用程序中使用请求和响应属性,并将其注入基于浏览器模块上的服务器的角度应用程序中。 request.cookies包含一个将KVPS映射到您的Cookie的对象。
对于一些(过时)的例子,请看这里和这里:https://github.com/angular/universal-starter/blob/master/src/node.module.ts#L43 https://github.com/angular /universal-starter/blob/master/src/browser.module.ts#L52
代码很快就会过时,但是这个原则是成立的。 使用依赖注入将请求注入到应用程序中的服务器上,并在浏览器的版本中为请求注入一些存根(可能仍会公开浏览器cookie)。
链接地址: http://www.djcxy.com/p/5289.html