Pass config in static context
This commit is contained in:
parent
1bde3b7e15
commit
338f771f4c
|
@ -16,16 +16,16 @@ export default class MainContainer extends Component {
|
||||||
data = window.__INITIAL_DATA__
|
data = window.__INITIAL_DATA__
|
||||||
delete window.__INITIAL_DATA__
|
delete window.__INITIAL_DATA__
|
||||||
} else {
|
} else {
|
||||||
data = props.staticContext.data
|
data = props.staticContext.context
|
||||||
}
|
}
|
||||||
|
|
||||||
this.state = {
|
this.state = {
|
||||||
isLoadingBlog: !data[0].posts,
|
isLoadingBlog: !data[0].posts,
|
||||||
isLoadingAbout: !data[0].other.about,
|
isLoadingAbout: !data[0].other.about,
|
||||||
about: data[0].other.about,
|
about: data[0].other.about,
|
||||||
posts: data[0].posts,
|
posts: data[0].posts,
|
||||||
config: data[1]
|
config: data[1]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
render () {
|
render () {
|
||||||
|
|
|
@ -16,7 +16,7 @@ export default class PostContainer extends Component {
|
||||||
data = window.__INITIAL_DATA__
|
data = window.__INITIAL_DATA__
|
||||||
delete window.__INITIAL_DATA__
|
delete window.__INITIAL_DATA__
|
||||||
} else {
|
} else {
|
||||||
data = props.staticContext.data
|
data = props.staticContext.context
|
||||||
}
|
}
|
||||||
|
|
||||||
this.state = {
|
this.state = {
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
import express from 'express'
|
import express from 'express'
|
||||||
import helmet from 'helmet'
|
import helmet from 'helmet'
|
||||||
import expressStaticGzip from 'express-static-gzip'
|
import expressStaticGzip from 'express-static-gzip'
|
||||||
import config from '../config/config.json'
|
|
||||||
import path from 'path'
|
import path from 'path'
|
||||||
import jsonfile from 'jsonfile'
|
import jsonfile from 'jsonfile'
|
||||||
import { ServerRenderer } from './utils/serverRender'
|
import { ServerRenderer } from './utils/serverRender'
|
||||||
|
@ -10,7 +9,12 @@ import { Scanner } from './utils/scanner'
|
||||||
const port = process.env.PORT || 3000
|
const port = process.env.PORT || 3000
|
||||||
const app = express()
|
const app = express()
|
||||||
|
|
||||||
const scanner = new Scanner()
|
let config = jsonfile.readFileSync(path.join(process.cwd(), 'config/config.json'))
|
||||||
|
if (config == null) {
|
||||||
|
throw new Error('Config file not found!')
|
||||||
|
}
|
||||||
|
|
||||||
|
const scanner = new Scanner(config)
|
||||||
scanner.scan()
|
scanner.scan()
|
||||||
|
|
||||||
app.use(helmet.contentSecurityPolicy({
|
app.use(helmet.contentSecurityPolicy({
|
||||||
|
@ -38,7 +42,7 @@ if (head == null) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const serverRenderer = new ServerRenderer(head)
|
const serverRenderer = new ServerRenderer(head, config)
|
||||||
app.get('*', serverRenderer.render.bind(serverRenderer))
|
app.get('*', serverRenderer.render.bind(serverRenderer))
|
||||||
|
|
||||||
app.listen(port, function (error) {
|
app.listen(port, function (error) {
|
||||||
|
|
|
@ -4,16 +4,10 @@ import path from 'path'
|
||||||
|
|
||||||
export function getData (reqPath = '') {
|
export function getData (reqPath = '') {
|
||||||
if (reqPath === '') {
|
if (reqPath === '') {
|
||||||
return Promise.all([
|
return readJson(path.join(process.cwd(), 'data.json'))
|
||||||
readJson(path.join(process.cwd(), 'data.json')),
|
|
||||||
readJson(path.join(process.cwd(), 'config/config.json'))
|
|
||||||
])
|
|
||||||
} else {
|
} else {
|
||||||
const fileName = path.join(process.cwd(), 'content', reqPath + '.md')
|
const fileName = path.join(process.cwd(), 'content', reqPath + '.md')
|
||||||
return Promise.all([
|
return readFile(fileName, 'utf8')
|
||||||
readFile(fileName, 'utf8'),
|
|
||||||
readJson(path.join(process.cwd(), 'config/config.json'))
|
|
||||||
])
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -31,4 +25,4 @@ function readJson (dataPath) {
|
||||||
err ? reject(err) : resolve(data)
|
err ? reject(err) : resolve(data)
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
}
|
}
|
|
@ -1,17 +1,17 @@
|
||||||
import fs from 'fs'
|
import fs from 'fs'
|
||||||
import path from 'path'
|
import path from 'path'
|
||||||
import config from '../../config/config.json'
|
|
||||||
import fm from 'front-matter'
|
import fm from 'front-matter'
|
||||||
import moment from 'moment'
|
import moment from 'moment'
|
||||||
import jsonfile from 'jsonfile'
|
import jsonfile from 'jsonfile'
|
||||||
import zlib from 'zlib'
|
import zlib from 'zlib'
|
||||||
|
|
||||||
export class Scanner {
|
export class Scanner {
|
||||||
constructor () {
|
constructor (config) {
|
||||||
this.data = {
|
this.data = {
|
||||||
'posts': [],
|
'posts': [],
|
||||||
'other': {}
|
'other': {}
|
||||||
}
|
}
|
||||||
|
this.config = config
|
||||||
}
|
}
|
||||||
|
|
||||||
readdir (dirname) {
|
readdir (dirname) {
|
||||||
|
@ -76,7 +76,7 @@ export class Scanner {
|
||||||
const filePath = path.join(process.cwd(), 'content', file)
|
const filePath = path.join(process.cwd(), 'content', file)
|
||||||
const metadata = this.fileMetadata(filePath)
|
const metadata = this.fileMetadata(filePath)
|
||||||
|
|
||||||
if (config['non-content-files'].indexOf(file) === -1) {
|
if (this.config['non-content-files'].indexOf(file) === -1) {
|
||||||
const frontMatter = fm(data)
|
const frontMatter = fm(data)
|
||||||
|
|
||||||
if (frontMatter.attributes.draft) {
|
if (frontMatter.attributes.draft) {
|
||||||
|
|
|
@ -8,38 +8,41 @@ import manifest from '../../public/static/manifest.json'
|
||||||
|
|
||||||
export class ServerRenderer {
|
export class ServerRenderer {
|
||||||
|
|
||||||
constructor (head) {
|
constructor (head, config) {
|
||||||
this.head = head
|
this.head = head
|
||||||
|
this.config = config
|
||||||
}
|
}
|
||||||
|
|
||||||
render (req, res, next) {
|
render (req, res, next) {
|
||||||
|
|
||||||
const activeRoute = routes.find((route) => matchPath(req.url, route)) || {}
|
const activeRoute = routes.find((route) => matchPath(req.url, route)) || {}
|
||||||
const head = this.head
|
const head = this.head
|
||||||
|
const config = this.config
|
||||||
|
|
||||||
const promise = activeRoute.getData
|
const promise = activeRoute.getData
|
||||||
? activeRoute.getData(req.path)
|
? activeRoute.getData(req.path)
|
||||||
: Promise.resolve()
|
: Promise.resolve()
|
||||||
|
|
||||||
promise.then((data) => {
|
promise.then((data) => {
|
||||||
console.log(data)
|
const context = [data, config]
|
||||||
const markup = renderToString(
|
const markup = renderToString(
|
||||||
<Router location={req.url} context={{ data }}>
|
<Router location={req.url} context={{ context }}>
|
||||||
<App/>
|
<App/>
|
||||||
</Router>
|
</Router>
|
||||||
)
|
)
|
||||||
|
|
||||||
res.status(200).send(renderFullPage(markup, head, data))
|
res.status(200).send(renderFullPage(markup, head, data, config))
|
||||||
}).catch(next)
|
}).catch(next)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function renderFullPage (html, head, data) {
|
function renderFullPage (html, head, data, config) {
|
||||||
|
const initialData = [data, config]
|
||||||
return `
|
return `
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>${data[1].title}</title>
|
<title>${config.title}</title>
|
||||||
<!-- Google Fonts -->
|
<!-- Google Fonts -->
|
||||||
<link href="https://fonts.googleapis.com/css?family=Open+Sans|Open+Sans+Condensed:700&subset=latin-ext" rel="stylesheet" rel="preload">
|
<link href="https://fonts.googleapis.com/css?family=Open+Sans|Open+Sans+Condensed:700&subset=latin-ext" rel="stylesheet" rel="preload">
|
||||||
<!-- Font Awesome -->
|
<!-- Font Awesome -->
|
||||||
|
@ -47,7 +50,7 @@ function renderFullPage (html, head, data) {
|
||||||
<!-- Stylesheet -->
|
<!-- Stylesheet -->
|
||||||
<link href=${manifest['bundle.css']} rel="stylesheet" rel="preload">
|
<link href=${manifest['bundle.css']} rel="stylesheet" rel="preload">
|
||||||
<!-- Initial Data -->
|
<!-- Initial Data -->
|
||||||
<script>window.__INITIAL_DATA__ = ${serialize(data)}</script>
|
<script>window.__INITIAL_DATA__ = ${serialize(initialData)}</script>
|
||||||
${head.scripts.join('\n')}
|
${head.scripts.join('\n')}
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
Loading…
Reference in New Issue