From 45779551ac2617bf0d06e45e4015d5de8ec9ba47 Mon Sep 17 00:00:00 2001 From: Fi1osof Date: Thu, 25 Jul 2019 09:54:10 +0300 Subject: [PATCH] Upgrade SSR --- src/App.js | 4 --- src/components/Renderer/index.js | 16 ++++++----- src/index.js | 7 +++-- src/serviceWorker.js | 6 ++-- src/ssr/SSR/index.js | 7 +++++ src/ssr/index.js | 48 +++++++++++++++++++++++++++++--- 6 files changed, 68 insertions(+), 20 deletions(-) diff --git a/src/App.js b/src/App.js index 4b24d96..fb74efa 100644 --- a/src/App.js +++ b/src/App.js @@ -9,11 +9,8 @@ import {App as PrismaApp} from "@prisma-cms/front"; import Renderer from "./components/Renderer"; -import * as queryFragments from "./schema/generated/api.fragments"; - export { Renderer, - queryFragments, } export default class App extends PrismaApp { @@ -21,7 +18,6 @@ export default class App extends PrismaApp { static defaultProps = { ...PrismaApp.defaultProps, Renderer, - queryFragments, // lang: "ru", themeOptions: { direction: 'ltr', diff --git a/src/components/Renderer/index.js b/src/components/Renderer/index.js index 3f6c529..ef27403 100644 --- a/src/components/Renderer/index.js +++ b/src/components/Renderer/index.js @@ -52,12 +52,14 @@ import TemplatePage from "@prisma-cms/front-editor/lib/components/pages/Template import RootPage from "./pages/Root"; +import * as queryFragments from "../../schema/generated/api.fragments"; + export default class BoilerplateRenderer extends PrismaCmsRenderer { - // static defaultProps = { - // ...PrismaCmsRenderer.defaultProps, - // queryFragments, - // } + static defaultProps = { + ...PrismaCmsRenderer.defaultProps, + queryFragments, + } renderMenu() { @@ -242,9 +244,9 @@ export default class BoilerplateRenderer extends PrismaCmsRenderer { queryFragments, } = this.props; - // console.log("queryFragments", queryFragments); - - // return "Sdfsdf"; + if(!queryFragments) { + return null; + } return {context => { diff --git a/src/index.js b/src/index.js index 7831fc1..83c0103 100644 --- a/src/index.js +++ b/src/index.js @@ -8,7 +8,7 @@ import PrismaCms from "@prisma-cms/front"; import * as serviceWorker from './serviceWorker'; import App, { - queryFragments, + // queryFragments, } from "./App"; import { @@ -35,9 +35,12 @@ if (node) { ${UserNoNestingFragment} `, }} - queryFragments={queryFragments} + // queryFragments={queryFragments} />, node); + // If you want your app to work offline and load faster, you can change + // unregister() to register() below. Note this comes with some pitfalls. + // Learn more about service workers: https://bit.ly/CRA-PWA serviceWorker.unregister(); } diff --git a/src/serviceWorker.js b/src/serviceWorker.js index 2283ff9..f8c7e50 100755 --- a/src/serviceWorker.js +++ b/src/serviceWorker.js @@ -8,7 +8,7 @@ // resources are updated in the background. // To learn more about the benefits of this model and instructions on how to -// opt-in, read http://bit.ly/CRA-PWA +// opt-in, read https://bit.ly/CRA-PWA const isLocalhost = Boolean( window.location.hostname === 'localhost' || @@ -43,7 +43,7 @@ export function register(config) { navigator.serviceWorker.ready.then(() => { console.log( 'This web app is being served cache-first by a service ' + - 'worker. To learn more, visit http://bit.ly/CRA-PWA' + 'worker. To learn more, visit https://bit.ly/CRA-PWA' ); }); } else { @@ -71,7 +71,7 @@ function registerValidSW(swUrl, config) { // content until all client tabs are closed. console.log( 'New content is available and will be used when all ' + - 'tabs for this page are closed. See http://bit.ly/CRA-PWA.' + 'tabs for this page are closed. See https://bit.ly/CRA-PWA.' ); // Execute callback diff --git a/src/ssr/SSR/index.js b/src/ssr/SSR/index.js index fddd861..c4f0774 100644 --- a/src/ssr/SSR/index.js +++ b/src/ssr/SSR/index.js @@ -547,6 +547,9 @@ class Server { // result = result.replace(`
`, `
${content}
`); // result = result.replace(`
`, `
${content}
${apiSchema}`); result = result.replace(`
`, `
${content || ""}
${apolloState || ""}${apiSchema || ""}`); + // result = result.replace(`
`, `
${"content" || ""}
${apolloState || ""}${apiSchema || ""}`); + // result = result.replace(`
`, `
${content || ""}
${"apolloState" || ""}${apiSchema || ""}`); + // result = result.replace(`
`, `
${content || ""}
${"apolloState" || ""}`); this.timeLog("renderHTML", "replace root content end"); @@ -654,7 +657,11 @@ class Server { }); // res.end(`\n${output}`); + + this.timeLog("renderHTML then", "res.end start"); res.end(output); + // res.end("output"); + this.timeLog("renderHTML then", "res.end end"); diff --git a/src/ssr/index.js b/src/ssr/index.js index dbf42c8..233e7f6 100644 --- a/src/ssr/index.js +++ b/src/ssr/index.js @@ -26,6 +26,8 @@ require('@babel/register')({ require('@babel/polyfill'); +const fs = require("fs"); + let SSRmiddlewareClass = require('./SSR'); let SSRmiddleware = new SSRmiddlewareClass({ @@ -50,9 +52,6 @@ const setupProxy = require("../setupProxy"); setupProxy(app); -app.use('/static', express.static(cwd + '/build/static')); //Serves resources from build folder -app.use('/build', express.static(cwd + '/build')); //Serves resources from build folder -app.use('/public', express.static(cwd + '/public')); //Serves resources from public folder app.use(bodyParser.urlencoded({ // to support URL-encoded bodies extended: true @@ -60,7 +59,48 @@ app.use(bodyParser.urlencoded({ // to support URL-encoded bodies app.use(bodyParser.json()); // to support JSON-encoded bodies -app.get('**', SSRmiddleware); +app.get("/static/js/voyager.worker.js", (req, res, next) => { + res.sendFile(`${cwd}/node_modules/@prisma-cms/graphql-voyager/dist/voyager.worker.js`); +}); + +/** + * Process static files + */ +app.get("**", (req, res, next) => { + + const { + pathname, + } = req._parsedUrl; + + if (pathname && pathname !== "/") { + + const path = `${cwd}/build${pathname}`; + + if (fs.existsSync(path)) { + // Do something + return res.sendFile(path); + } + + } + + next(); +}); + +app.get('**', (req, res, next) => { + + return SSRmiddleware(req, res, next); +}); + +// app.get('/', express.static(cwd + '/build')); //Serves resources from build folder +// app.use('/static', express.static(cwd + '/build/static')); //Serves resources from build folder +// app.use('/build', express.static(cwd + '/build')); //Serves resources from build folder +// app.use('/public', express.static(cwd + '/public')); //Serves resources from public folder +// app.get('/favicon.ico', express.static(cwd + '/build')); //Serves resources from build folder +// app.get('/manifest.json', express.static(cwd + '/build')); //Serves resources from build folder +// app.get('/service-worker.js', express.static(cwd + '/build')); //Serves resources from build folder + + + // get the intended port number, use port 3000 if not provided const port = argv.port || process.env.PORT || 3000;