mirror of
https://github.com/DSpace/dspace-angular.git
synced 2025-10-08 02:24:11 +00:00
Fix direct CSR
By moving from environment.ts to config.yml we made it so the environment is _not_ up to date with the server configuration when main.js is first loaded. Because of this the app behaved as if CSR always happened _after_ SSR, effectively breaking direct CSR. Here the "criterion" for SSR/non-SSR HTML is changed from the related configuration property to the presence of Angular Universal transfer state. This means we can correctly determine when to bootstrap the app for direct CSR, and it's' now "safe" to just send index.html by itself.
This commit is contained in:
@@ -2,21 +2,27 @@ import 'zone.js';
|
||||
import 'reflect-metadata';
|
||||
import 'core-js/es/reflect';
|
||||
|
||||
import { enableProdMode } from '@angular/core';
|
||||
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
|
||||
import { load as loadWebFont } from 'webfontloader';
|
||||
|
||||
import { hasValue } from './app/shared/empty.util';
|
||||
|
||||
import { BrowserAppModule } from './modules/app/browser-app.module';
|
||||
|
||||
import { environment } from './environments/environment';
|
||||
import { AppConfig } from './config/app-config.interface';
|
||||
import { extendEnvironmentWithAppConfig } from './config/config.util';
|
||||
import { enableProdMode } from '@angular/core';
|
||||
|
||||
const bootstrap = () => platformBrowserDynamic()
|
||||
.bootstrapModule(BrowserAppModule, {});
|
||||
|
||||
/**
|
||||
* We use this to determine have been serven SSR HTML or not.
|
||||
*
|
||||
* At this point, {@link environment} may not be in sync with the configuration.
|
||||
* Therefore, we cannot depend on it to determine how to bootstrap the app.
|
||||
*/
|
||||
const hasTransferState = document.querySelector('script#dspace-angular-state') !== null;
|
||||
|
||||
const main = () => {
|
||||
// Load fonts async
|
||||
// https://github.com/typekit/webfontloader#configuration
|
||||
@@ -30,22 +36,23 @@ const main = () => {
|
||||
enableProdMode();
|
||||
}
|
||||
|
||||
if (hasValue(environment.universal) && environment.universal.preboot) {
|
||||
if (hasTransferState) {
|
||||
// Configuration will be taken from transfer state during initialization
|
||||
return bootstrap();
|
||||
} else {
|
||||
// Configuration must be fetched explicitly
|
||||
return fetch('assets/config.json')
|
||||
.then((response) => response.json())
|
||||
.then((appConfig: AppConfig) => {
|
||||
// extend environment with app config for browser when not prerendered
|
||||
extendEnvironmentWithAppConfig(environment, appConfig);
|
||||
|
||||
return bootstrap();
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
// support async tag or hmr
|
||||
if (document.readyState === 'complete' && hasValue(environment.universal) && !environment.universal.preboot) {
|
||||
if (document.readyState === 'complete' && !hasTransferState) {
|
||||
main();
|
||||
} else {
|
||||
document.addEventListener('DOMContentLoaded', main);
|
||||
|
Reference in New Issue
Block a user