From eef62dfd028ba3efee968b695cc64b906baec281 Mon Sep 17 00:00:00 2001 From: dhiva03 Date: Wed, 24 Jul 2019 01:14:38 +0530 Subject: [PATCH] commit-for-intial-render-fix --- package.json | 3 +- server.ts | 34 +++++------- .../shared/services/trans-service.service.ts | 55 ++++++++++++------- src/polyfills.ts | 4 +- 4 files changed, 53 insertions(+), 43 deletions(-) diff --git a/package.json b/package.json index 2cd3ae4..f80bc1e 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,7 @@ "build:prerender": "npm run build:client-and-server-bundles && npm run compile:server && npm run generate:prerender", "build:ssr": "npm run build:client-and-server-bundles && npm run compile:server && npm run move:build", "compile:server": "tsc -p server.tsconfig.json", - "move:build" : "(cp -r ./server/i18n/ dist/server)", + "move:build": "(cp -r ./server/i18n/ dist/server)", "generate:prerender": "cd dist && node prerender", "serve:prerender": "cd dist/browser && http-server", "serve:ssr": "node dist/server" @@ -38,6 +38,7 @@ "express": "^4.15.2", "express-static-gzip": "^1.1.3", "helmet": "^3.18.0", + "jsdom": "^15.1.1", "moment": "^2.24.0", "morgan": "^1.9.1", "ngx-cookie-service": "^2.2.0", diff --git a/server.ts b/server.ts index 487bf56..a3d1df6 100644 --- a/server.ts +++ b/server.ts @@ -1,18 +1,15 @@ import "zone.js/dist/zone-node"; import "reflect-metadata"; -const domino = require("domino"); const fs = require("fs"); const path = require("path"); const template = fs .readFileSync(path.join(__dirname, ".", "browser", "index.html")) .toString(); -const win = domino.createWindow(template); -// const styleFiles = files.filter(file => file.startsWith('styles')); -// const hashStyle = styleFiles[0].split('.')[1]; -// const style = fs.readFileSync(path.join(__dirname, '.', 'dist-server', `styles.${hashStyle}.bundle.css`)).toString(); - -global["window"] = win; -Object.defineProperty(win.document.body.style, "transform", { +const jsdom = require("jsdom"); +const { JSDOM } = jsdom; +const { window } = new JSDOM(template); +global["window"] = window; +Object.defineProperty(window.document.body.style, "transform", { value: () => { return { enumerable: true, @@ -20,10 +17,7 @@ Object.defineProperty(win.document.body.style, "transform", { }; } }); -global["document"] = win.document; -// global["CSS"] = win; -// global['XMLHttpRequest'] = require('xmlhttprequest').XMLHttpRequest; -// global["Prism"] = null; +global["document"] = window.document; import { enableProdMode } from "@angular/core"; @@ -80,7 +74,10 @@ const controllers = [ app.use(errorMiddleware); app.use(bodyParser.json({ limit: "50mb" })); app.use(bodyParser.urlencoded({ extended: false })); -app.use("/api-docs/**", express.static(path.join(__dirname, "./server/swagger"))); +app.use( + "/api-docs/**", + express.static(path.join(__dirname, "./server/swagger")) +); app.get("/swagger.json", function(req, res) { res.setHeader("Content-Type", "application/json"); res.send( @@ -95,8 +92,9 @@ controllers.forEach(controller => { app.use("/epic_explorer/v1", controller.router); }); // Example Express Rest API endpoints - app.get('/epic_explorer/v1/**', (req, res) => { res.send({'msg':'Api works.'})}); - +app.get("/epic_explorer/v1/**", (req, res) => { + res.send({ msg: "Api works." }); +}); // * NOTE :: leave this as require() since this file is built Dynamically from webpack const { AppServerModuleNgFactory, LAZY_MODULE_MAP } = require("./server/main"); @@ -110,10 +108,8 @@ app.engine( }) ); -app.set("view engine", "html"); app.set("views", join(DIST_FOLDER, "browser")); - - +app.set("view engine", "html"); // Server static files from /browser app.get( "*.*", @@ -124,7 +120,7 @@ app.get( // All regular routes use the Universal engine app.get("*", (req, res) => { - res.render("index", { req }); + res.sendFile(join(DIST_FOLDER, "browser") + "/index.html", { req }); }); // Start up the Node server diff --git a/src/app/shared/services/trans-service.service.ts b/src/app/shared/services/trans-service.service.ts index a4430e2..668a957 100644 --- a/src/app/shared/services/trans-service.service.ts +++ b/src/app/shared/services/trans-service.service.ts @@ -1,42 +1,55 @@ -import { Injectable } from '@angular/core'; -import {TranslateService} from '@ngx-translate/core'; -import { CookieService } from 'ngx-cookie-service'; +import { Injectable, Inject, PLATFORM_ID } from "@angular/core"; +import { TranslateService } from "@ngx-translate/core"; +import { CookieService } from "ngx-cookie-service"; +import { isPlatformBrowser } from "@angular/common"; @Injectable({ - providedIn: 'root' + providedIn: "root" }) -export class TransServiceService{ +export class TransServiceService { public langLabel: any = {}; - constructor(public translate : TranslateService,private cookie: CookieService) { - translate.addLangs(['en', 'de']); - translate.setDefaultLang('en'); - this.langLabel = {en: 'English', de: 'German'}; - // console.log('this.getCookie() ifconf',this.getCookie() != 'undefined' ? 1: 2); - // console.log("(this.getCookie() && this.getCookie() != null) ? this.getCookie() : (this.getCurrentLang() && this.getCurrentLang() != null) ? this.getCurrentLang() : 'en'",(this.getCookie() && this.getCookie() != 'undefined') ? this.getCookie() : (this.getCurrentLang() && this.getCurrentLang() != 'undefined') ? this.getCurrentLang() : 'en'); - translate.use((this.getCookie() && this.getCookie() != 'undefined') ? this.getCookie() : (this.getCurrentLang() && this.getCurrentLang() != 'undefined') ? this.getCurrentLang() : 'en'); - - this.setCookie(this.getCurrentLang()); + constructor( + @Inject(PLATFORM_ID) private platformId: Object, + public translate: TranslateService, + private cookie: CookieService + ) { + if (isPlatformBrowser(this.platformId)) { + translate.addLangs(["en", "de"]); + translate.setDefaultLang("en"); + this.langLabel = { en: "English", de: "German" }; + // console.log('this.getCookie() ifconf',this.getCookie() != 'undefined' ? 1: 2); + // console.log("(this.getCookie() && this.getCookie() != null) ? this.getCookie() : (this.getCurrentLang() && this.getCurrentLang() != null) ? this.getCurrentLang() : 'en'",(this.getCookie() && this.getCookie() != 'undefined') ? this.getCookie() : (this.getCurrentLang() && this.getCurrentLang() != 'undefined') ? this.getCurrentLang() : 'en'); + translate.use( + this.getCookie() && this.getCookie() != "undefined" + ? this.getCookie() + : this.getCurrentLang() && this.getCurrentLang() != "undefined" + ? this.getCurrentLang() + : "en" + ); + + this.setCookie(this.getCurrentLang()); + } } - public getLanguage(){ + public getLanguage() { return this.translate.getLangs(); } - public getCurrentLang(){ + public getCurrentLang() { return this.translate.currentLang; } - public changeLang(langSelect){ + public changeLang(langSelect) { this.translate.use(langSelect); this.setCookie(langSelect); } - public setCookie(lang){ - this.cookie.set('Lang',lang); + public setCookie(lang) { + this.cookie.set("Lang", lang); } - public getCookie(){ - return this.cookie.get('Lang'); + public getCookie() { + return this.cookie.get("Lang"); } } diff --git a/src/polyfills.ts b/src/polyfills.ts index aa665d6..f51239e 100644 --- a/src/polyfills.ts +++ b/src/polyfills.ts @@ -55,8 +55,8 @@ /*************************************************************************************************** * Zone JS is required by default for Angular itself. */ -import 'zone.js/dist/zone'; // Included with Angular CLI. - +import "zone.js/dist/zone"; // Included with Angular CLI. +(window as any).global = window; /*************************************************************************************************** * APPLICATION IMPORTS