nodejsのuniversal-starterをダウンロードして、古いangular-rc4からマイウェブサイトを移行し始めました。しかし、認証を実装する必要があるとき(私の場合はlocalStorageに格納されているJWTです)、サーバーはlocalStorageとcookieを持っていないので、角度はクライアント上でのみレンダリングされます。角度2のユニバーサル、nodejsの認証
私はこのガイドに従っています: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
}
}
アプリ.bサーバー上の対ルータ遷移を介してクライアントにそのページに移動しながら、同じページの出力を持っているどのようにしてrowser.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
]
})
ブラウザの更新を介して?ノードでは、あなたの明示のアプリケーションで要求と応答のプロパティを使用することができますし、ブラウザモジュール上のサーバーに基づいて、角度のアプリケーションでそれらを注入事前