Browse Source

local storage service refactored according to ssr

feature/ssr-migration-schematic
erdemcaygor 1 year ago
parent
commit
3b835d184c
  1. 6
      npm/ng-packs/packages/core/src/lib/strategies/content.strategy.ts
  2. 37
      npm/ng-packs/packages/core/src/lib/strategies/dom.strategy.ts
  3. 20
      npm/ng-packs/packages/core/src/lib/utils/multi-tenancy-utils.ts
  4. 6
      npm/ng-packs/packages/oauth/src/lib/providers/oauth-module-config.provider.ts
  5. 10
      npm/ng-packs/packages/oauth/src/lib/strategies/auth-flow-strategy.ts
  6. 5
      npm/ng-packs/packages/oauth/src/lib/utils/clear-o-auth-storage.ts
  7. 1
      npm/ng-packs/packages/oauth/src/lib/utils/index.ts
  8. 31
      npm/ng-packs/packages/oauth/src/lib/utils/storage.factory.ts

6
npm/ng-packs/packages/core/src/lib/strategies/content.strategy.ts

@ -1,5 +1,7 @@
import { CONTENT_SECURITY_STRATEGY, ContentSecurityStrategy } from './content-security.strategy';
import { DOM_STRATEGY, DomStrategy } from './dom.strategy';
import { inject } from '@angular/core';
import { DOCUMENT } from '@angular/common';
export type ElementOptions<T extends HTMLScriptElement | HTMLStyleElement = any> = Partial<{
[key in keyof T]: T[key];
@ -35,7 +37,7 @@ export abstract class ContentStrategy<T extends HTMLScriptElement | HTMLStyleEle
export class StyleContentStrategy extends ContentStrategy<HTMLStyleElement> {
createElement(): HTMLStyleElement {
const element = document.createElement('style');
const element = inject(DOCUMENT).createElement('style');
element.textContent = this.content;
return element;
@ -44,7 +46,7 @@ export class StyleContentStrategy extends ContentStrategy<HTMLStyleElement> {
export class ScriptContentStrategy extends ContentStrategy<HTMLScriptElement> {
createElement(): HTMLScriptElement {
const element = document.createElement('script');
const element = inject(DOCUMENT).createElement('script');
element.textContent = this.content;
return element;

37
npm/ng-packs/packages/core/src/lib/strategies/dom.strategy.ts

@ -1,28 +1,29 @@
import { inject, PLATFORM_ID } from '@angular/core';
import { isPlatformBrowser, DOCUMENT } from '@angular/common';
export class DomStrategy {
private readonly isBrowser: boolean;
constructor(
public target: HTMLElement = document.head,
private targetFactory: () => HTMLElement,
public position: InsertPosition = 'beforeend',
) {}
) {
const platformId = inject(PLATFORM_ID);
this.isBrowser = isPlatformBrowser(platformId);
}
insertElement<T extends HTMLElement>(element: T) {
this.target.insertAdjacentElement(this.position, element);
if (this.isBrowser) {
const target = this.targetFactory();
target.insertAdjacentElement(this.position, element);
}
}
}
export const DOM_STRATEGY = {
AfterElement(element: HTMLElement) {
return new DomStrategy(element, 'afterend');
},
AppendToBody() {
return new DomStrategy(document.body, 'beforeend');
},
AppendToHead() {
return new DomStrategy(document.head, 'beforeend');
},
BeforeElement(element: HTMLElement) {
return new DomStrategy(element, 'beforebegin');
},
PrependToHead() {
return new DomStrategy(document.head, 'afterbegin');
},
AfterElement: (el: HTMLElement) => new DomStrategy(() => el, 'afterend'),
BeforeElement: (el: HTMLElement) => new DomStrategy(() => el, 'beforebegin'),
AppendToBody: () => new DomStrategy(() => inject(DOCUMENT).body, 'beforeend'),
AppendToHead: () => new DomStrategy(() => inject(DOCUMENT).head, 'beforeend'),
PrependToHead: () => new DomStrategy(() => inject(DOCUMENT).head, 'afterbegin'),
};

20
npm/ng-packs/packages/core/src/lib/utils/multi-tenancy-utils.ts

@ -1,6 +1,7 @@
import { Injector } from '@angular/core';
import { Injector, inject, PLATFORM_ID } from '@angular/core';
import clone from 'just-clone';
import { Environment } from '../models/environment';
import { DOCUMENT, isPlatformBrowser } from '@angular/common';
import { FindTenantResultDto } from '../proxy/volo/abp/asp-net-core/mvc/multi-tenancy/models';
import { EnvironmentService } from '../services/environment.service';
@ -10,6 +11,7 @@ import { firstValueFrom } from 'rxjs';
import { TENANT_NOT_FOUND_BY_NAME } from '../tokens/tenant-not-found-by-name';
import { HttpErrorResponse } from '@angular/common/http';
const platformId = inject(PLATFORM_ID);
const tenancyPlaceholder = '{0}';
function getCurrentTenancyName(appBaseUrl: string): string {
@ -17,11 +19,21 @@ function getCurrentTenancyName(appBaseUrl: string): string {
const parseTokens = createTokenParser(appBaseUrl);
const token = tenancyPlaceholder.replace(/[}{]/g, '');
return parseTokens(window.location.href)[token]?.[0];
const tokenValue = isPlatformBrowser(platformId)
? parseTokens(inject(DOCUMENT).defaultView?.location.href)[token]?.[0]
: undefined;
return tokenValue;
}
function getCurrentTenancyNameFromUrl(tenantKey: string) {
const urlParams = new URLSearchParams(window.location.search);
export function getCurrentTenancyNameFromUrl(tenantKey: string): string | null {
const platformId = inject(PLATFORM_ID);
if (!isPlatformBrowser(platformId)) {
return null;
}
const search = inject(DOCUMENT).defaultView?.location.search;
const urlParams = new URLSearchParams(search);
return urlParams.get(tenantKey);
}

6
npm/ng-packs/packages/oauth/src/lib/providers/oauth-module-config.provider.ts

@ -15,7 +15,7 @@ import { AbpOAuthGuard, abpOAuthGuard } from '../guards';
import { OAuthConfigurationHandler } from '../handlers';
import { OAuthApiInterceptor } from '../interceptors';
import { AbpOAuthService, OAuthErrorFilterService } from '../services';
import { pipeToLogin, checkAccessToken } from '../utils';
import { pipeToLogin, checkAccessToken, oAuthStorageFactory } from '../utils';
import { NavigateToManageProfileProvider } from './navigate-to-manage-profile.provider';
export function provideAbpOAuth() {
@ -36,6 +36,10 @@ export function provideAbpOAuth() {
provide: ApiInterceptor,
useClass: OAuthApiInterceptor,
},
{
provide: OAuthStorage,
useFactory: oAuthStorageFactory,
},
{
provide: PIPE_TO_LOGIN_FN_KEY,
useValue: pipeToLogin,

10
npm/ng-packs/packages/oauth/src/lib/strategies/auth-flow-strategy.ts

@ -1,4 +1,4 @@
import { Injector } from '@angular/core';
import { inject, Injector } from '@angular/core';
import { HttpErrorResponse } from '@angular/common/http';
import { Params, Router } from '@angular/router';
@ -23,7 +23,6 @@ import {
} from '@abp/ng.core';
import { clearOAuthStorage } from '../utils/clear-o-auth-storage';
import { oAuthStorage } from '../utils/oauth-storage';
import { OAuthErrorFilterService } from '../services';
import { isTokenExpired } from '../utils';
import { RememberMeService } from '../services/remember-me.service';
@ -74,8 +73,8 @@ export abstract class AuthFlowStrategy {
async init(): Promise<any> {
if (this.oAuthConfig.clientId) {
const shouldClear = shouldStorageClear(this.oAuthConfig.clientId, oAuthStorage);
if (shouldClear) clearOAuthStorage(oAuthStorage);
const shouldClear = shouldStorageClear(this.oAuthConfig.clientId);
if (shouldClear) clearOAuthStorage();
}
this.oAuthService.configure(this.oAuthConfig);
this.oAuthService.events
@ -142,7 +141,8 @@ export abstract class AuthFlowStrategy {
}
}
function shouldStorageClear(clientId: string, storage: OAuthStorage): boolean {
function shouldStorageClear(clientId: string): boolean {
const storage = inject(OAuthStorage);
const key = 'abpOAuthClientId';
if (!storage.getItem(key)) {
storage.setItem(key, clientId);

5
npm/ng-packs/packages/oauth/src/lib/utils/clear-o-auth-storage.ts

@ -1,7 +1,8 @@
import { OAuthStorage } from 'angular-oauth2-oidc';
import { oAuthStorage } from './oauth-storage';
import { inject } from '@angular/core';
export function clearOAuthStorage(storage: OAuthStorage = oAuthStorage) {
export function clearOAuthStorage() {
const storage = inject(OAuthStorage);
const keys = [
'access_token',
'id_token',

1
npm/ng-packs/packages/oauth/src/lib/utils/index.ts

@ -1,4 +1,3 @@
export * from './oauth-storage';
export * from './storage.factory';
export * from './auth-utils';
export * from './clear-o-auth-storage';

31
npm/ng-packs/packages/oauth/src/lib/utils/storage.factory.ts

@ -1,6 +1,29 @@
import { OAuthStorage } from 'angular-oauth2-oidc';
import { oAuthStorage } from './oauth-storage';
import { inject, PLATFORM_ID } from '@angular/core';
import { isPlatformBrowser } from '@angular/common';
export function storageFactory(): OAuthStorage {
return oAuthStorage;
export class MockStorage implements Storage {
private data = new Map<string, string>();
get length() {
return this.data.size;
}
clear() {
this.data.clear();
}
getItem(key: string) {
return this.data.get(key) || null;
}
key(index: number) {
return Array.from(this.data.keys())[index] || null;
}
removeItem(key: string) {
this.data.delete(key);
}
setItem(key: string, value: string) {
this.data.set(key, value);
}
}
export function oAuthStorageFactory(): Storage {
const platformId = inject(PLATFORM_ID);
return isPlatformBrowser(platformId) ? localStorage : new MockStorage();
}

Loading…
Cancel
Save