Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit 40ba6e9

Browse files
committed
fix: error page rendering and route
1 parent e96e7b4 commit 40ba6e9

File tree

4 files changed

+21
-37
lines changed

4 files changed

+21
-37
lines changed

‎common/js/components/common/index.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
export { default as ErrorPage } from './ErrorPage';
21
export { default as Footer } from './Footer';
32
export { default as Header } from './Header';
43
export { default as Loading } from './Loading';

‎common/js/components/common/ErrorPage/index.js renamed to ‎common/js/pages/Error/index.js

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,3 @@
1-
/**
2-
* 404.js
3-
* Renders a 404 page.
4-
*/
5-
61
import React from 'react';
72
import PropTypes from 'prop-types';
83

‎common/js/routes/index.js

Lines changed: 4 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,9 @@
1-
'use strict';
2-
1+
import Error from '@pages/Error';
32
import Home from '@pages/Home';
43
import Todos from '@pages/Todos';
54

65
export default [
7-
{
8-
path: '/',
9-
exact: true,
10-
component: Home
11-
},
12-
{
13-
path: '/todos',
14-
exact: true,
15-
component: Todos
16-
}
6+
{ path: '/', exact: true, component: Home },
7+
{ path: '/todos', exact: true, component: Todos },
8+
{ path: '*', component: Error }
179
];

‎server/renderer/handler.js

Lines changed: 17 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@ import { Provider } from 'react-redux';
33
import { StaticRouter, matchPath } from 'react-router';
44
import { setMobileDetect, mobileParser } from 'react-responsive-redux';
55
import { renderToString } from 'react-dom/server';
6-
import { ErrorPage } from '@components/common';
76
import { getBundles } from 'react-loadable/webpack';
87
import Loadable from 'react-loadable';
98
import render from './render';
@@ -25,7 +24,8 @@ if (config.enableDynamicImports) {
2524
}
2625

2726
export default function handleRender(req, res) {
28-
const initialState = {};
27+
let context = {}, modules = [], initialState = {};
28+
2929
// Create a new Redux store instance
3030
const store = configureStore(initialState);
3131

@@ -82,29 +82,16 @@ export default function handleRender(req, res) {
8282

8383
const matches = matchRoutes(routes);
8484

85-
// No matched route, render a 404 page.
85+
// No matched route, send an error.
8686
if (!matches.length) {
87-
res.contentType('text/html');
88-
res.status(404).send(render(<ErrorPage code={404} />, finalState));
89-
return;
87+
return res.status(500).send('Server Error');
9088
}
9189

92-
// There's a match, render the component with the matched route, firing off
93-
// any fetchData methods that are statically defined on the server.
94-
const fetchData = matches.map(match => {
95-
const { fetchData, ...rest } = match; // eslint-disable-line no-unused-vars
96-
97-
// return fetch data Promise, excluding unnecessary fetchData method
98-
return match.fetchData({ store, ...rest });
99-
});
100-
101-
let context = {}, modules = [];
102-
10390
const getComponent = () => {
10491
let component = (
10592
<Provider store={store}>
10693
<StaticRouter context={context} location={req.baseUrl}>
107-
<App />
94+
<App />
10895
</StaticRouter>
10996
</Provider>
11097
);
@@ -120,19 +107,30 @@ export default function handleRender(req, res) {
120107
return component;
121108
};
122109

110+
// There's a match, render the component with the matched route, firing off
111+
// any fetchData methods that are statically defined on the server.
112+
const fetchData = matches.map(match => {
113+
const { fetchData, ...rest } = match; // eslint-disable-line no-unused-vars
114+
115+
// return fetch data Promise, excluding unnecessary fetchData method
116+
return match.fetchData({ store, ...rest });
117+
});
118+
123119
// Execute the render only after all promises have been resolved.
124120
Promise.all(fetchData).then(() => {
125121
const state = store.getState();
126122
const html = renderToString(getComponent());
127123
const bundles = stats && getBundles(stats, modules) || [];
128124
const markup = render(html, state, bundles);
125+
const status = matches.length && matches[0].match.path === '*' ? 404 : 200;
129126

130127
// A 301 redirect was rendered somewhere if context.url exists after
131128
// rendering has happened.
132129
if (context.url) {
133130
return res.redirect(302, context.url);
134131
}
135132

136-
return res.status(200).send(markup);
133+
res.contentType('text/html');
134+
return res.status(status).send(markup);
137135
});
138136
}

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /