firebase with firebase cookie library, support server side render(ssr).
Because cookie only can use the special key __session
in the firebase, to use cookie more convenient, we provide an easy way to store data like nomal Storage
.
firebase only can use the _session
, so we parse the data to JSON string, and store that in only one __session
key.
npm install --save ngx-fire-cookie
import { NgModule } from '@angular/core';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { NgxFireCookieService } from 'ngx-fire-cookie';
import { AppComponent } from './app.component';
import { AppModule } from './app.module';
@NgModule({
imports: [
BrowserAnimationsModule,
AppModule
],
bootstrap: [
AppComponent
],
providers: [
NgxFireCookieService // add service in here
]
})
export class AppBrowserModule { }
If you using angular universal(ssr), you should import the ServerService
;
import { NgxFireCookieServerService, NgxFireCookieService } from 'ngx-fire-cookie';
@NgModule({
imports: [
...
],
providers: [
...
{ provide: NgxFireCookieService, useClass: NgxFireCookieServerService }
],
bootstrap: [AppComponent]
})
export class AppServerModule { }
app.component.ts
export class AppComponent implements OnInit {
constructor(
private cookie: NgxFireCookieService,
) {
}
ngOnInit(){
this.cookie.setItem('theme', 'dark');
console.log(this.cookie.getAll()); // { theme: dark }
console.log(this.cookie.getItem('theme')); // dark
this.cookie.removeItem('theme');
console.log(this.cookie.getItem('theme')); // undefined
}
Name | Description |
---|---|
setItem(key: string, data: string) |
set data with key name. |
getItem(key: string) |
return data with key name. |
removeItem(key: string) |
remove data with key name. |
getAll() |
return object with all data. |
clear() |
clear all data |