mirror of
https://github.com/apache/superset.git
synced 2024-09-06 13:57:40 -04:00
feat: Add error pages (#13144)
* add custom error pages for 404 and 500 responses * refactor error page styles into separate template * move error pages to superset-frontend * fix whitespace on error pages * refactor error pages to be generated by jinja * generate static error pages with webpack
This commit is contained in:
parent
483405fff9
commit
0318b6d4ae
BIN
superset-frontend/images/error404.png
Normal file
BIN
superset-frontend/images/error404.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 65 KiB |
BIN
superset-frontend/images/error500.png
Normal file
BIN
superset-frontend/images/error500.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 76 KiB |
323
superset-frontend/package-lock.json
generated
323
superset-frontend/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -111,6 +111,7 @@
|
|||||||
"fontsource-inter": "^3.0.5",
|
"fontsource-inter": "^3.0.5",
|
||||||
"geolib": "^2.0.24",
|
"geolib": "^2.0.24",
|
||||||
"global-box": "^1.2.0",
|
"global-box": "^1.2.0",
|
||||||
|
"html-webpack-plugin": "^4.5.1",
|
||||||
"immutable": "^4.0.0-rc.12",
|
"immutable": "^4.0.0-rc.12",
|
||||||
"interweave": "^11.2.0",
|
"interweave": "^11.2.0",
|
||||||
"jquery": "^3.5.1",
|
"jquery": "^3.5.1",
|
||||||
|
93
superset-frontend/src/staticPages/404.html
Normal file
93
superset-frontend/src/staticPages/404.html
Normal file
@ -0,0 +1,93 @@
|
|||||||
|
<!--
|
||||||
|
Licensed to the Apache Software Foundation (ASF) under one
|
||||||
|
or more contributor license agreements. See the NOTICE file
|
||||||
|
distributed with this work for additional information
|
||||||
|
regarding copyright ownership. The ASF licenses this file
|
||||||
|
to you under the Apache License, Version 2.0 (the
|
||||||
|
"License"); you may not use this file except in compliance
|
||||||
|
with the License. You may obtain a copy of the License at
|
||||||
|
|
||||||
|
http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
|
||||||
|
Unless required by applicable law or agreed to in writing,
|
||||||
|
software distributed under the License is distributed on an
|
||||||
|
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
KIND, either express or implied. See the License for the
|
||||||
|
specific language governing permissions and limitations
|
||||||
|
under the License.
|
||||||
|
-->
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=q, initial-scale=1.0">
|
||||||
|
<link rel="icon" type="image/png" href="<%= require('../../images/favicon.png')%>">
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com">
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap" rel="stylesheet">
|
||||||
|
<style>
|
||||||
|
html { height: 100%; }
|
||||||
|
body {
|
||||||
|
color: #1985A0;
|
||||||
|
font-family: 'Inter', sans-serif;
|
||||||
|
height: 100%;
|
||||||
|
margin: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items:stretch;
|
||||||
|
}
|
||||||
|
h1 {
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 88px;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 24px;
|
||||||
|
line-height: 40px;
|
||||||
|
width: 490px;
|
||||||
|
}
|
||||||
|
.button {
|
||||||
|
-webkit-appearance: button;
|
||||||
|
-moz-appearance: button;
|
||||||
|
appearance: button;
|
||||||
|
background-color: #1985A0; /* Green */
|
||||||
|
border: none;
|
||||||
|
color: white;
|
||||||
|
padding: 16px 38px;
|
||||||
|
text-align: center;
|
||||||
|
text-decoration: none;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 11px;
|
||||||
|
border-radius: 4px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
.error-page-content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
max-width: 1350px;
|
||||||
|
margin: auto;
|
||||||
|
width: 100%;
|
||||||
|
padding: 56px;
|
||||||
|
}
|
||||||
|
img {
|
||||||
|
width: 540px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<title>404: Not found | Superset</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="error-page-content">
|
||||||
|
<section>
|
||||||
|
<h1>Page not found</h1>
|
||||||
|
<p>Sorry, we cannot find t he page you are looking for. You may have mistyped the address or the page may have moved.</p>
|
||||||
|
<a href="/" class="button">Back to home</a>
|
||||||
|
</section>
|
||||||
|
<img alt="404" src="<%= require('../../images/error404.png')%>" width="540">
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
92
superset-frontend/src/staticPages/500.html
Normal file
92
superset-frontend/src/staticPages/500.html
Normal file
@ -0,0 +1,92 @@
|
|||||||
|
<!--
|
||||||
|
Licensed to the Apache Software Foundation (ASF) under one
|
||||||
|
or more contributor license agreements. See the NOTICE file
|
||||||
|
distributed with this work for additional information
|
||||||
|
regarding copyright ownership. The ASF licenses this file
|
||||||
|
to you under the Apache License, Version 2.0 (the
|
||||||
|
"License"); you may not use this file except in compliance
|
||||||
|
with the License. You may obtain a copy of the License at
|
||||||
|
|
||||||
|
http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
|
||||||
|
Unless required by applicable law or agreed to in writing,
|
||||||
|
software distributed under the License is distributed on an
|
||||||
|
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
KIND, either express or implied. See the License for the
|
||||||
|
specific language governing permissions and limitations
|
||||||
|
under the License.
|
||||||
|
-->
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=q, initial-scale=1.0">
|
||||||
|
<link rel="icon" type="image/png" href="<%= require('../../images/favicon.png')%>">
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap" rel="stylesheet">
|
||||||
|
<style>
|
||||||
|
html { height: 100%; }
|
||||||
|
body {
|
||||||
|
color: #1985A0;
|
||||||
|
font-family: 'Inter', sans-serif;
|
||||||
|
height: 100%;
|
||||||
|
margin: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items:stretch;
|
||||||
|
}
|
||||||
|
h1 {
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 88px;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 24px;
|
||||||
|
line-height: 40px;
|
||||||
|
width: 490px;
|
||||||
|
}
|
||||||
|
.button {
|
||||||
|
-webkit-appearance: button;
|
||||||
|
-moz-appearance: button;
|
||||||
|
appearance: button;
|
||||||
|
background-color: #1985A0; /* Green */
|
||||||
|
border: none;
|
||||||
|
color: white;
|
||||||
|
padding: 16px 38px;
|
||||||
|
text-align: center;
|
||||||
|
text-decoration: none;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 11px;
|
||||||
|
border-radius: 4px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
.error-page-content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
max-width: 1350px;
|
||||||
|
margin: auto;
|
||||||
|
width: 100%;
|
||||||
|
padding: 56px;
|
||||||
|
}
|
||||||
|
img {
|
||||||
|
width: 540px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<title>500: Internal server error | S uperset</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="error-page-content">
|
||||||
|
<section>
|
||||||
|
<h1>Internal server error</h1>
|
||||||
|
<p>Sorry, something went wrong. We are fixing the mistake now. Try again later or go back to home.</p>
|
||||||
|
<a href="/" class="button">Back to home</a>
|
||||||
|
</section>
|
||||||
|
<img alt="500" src="<%= require('../../images/error500.png')%>" width="540">
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
@ -23,6 +23,7 @@ const webpack = require('webpack');
|
|||||||
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
|
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
|
||||||
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
|
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
|
||||||
const CopyPlugin = require('copy-webpack-plugin');
|
const CopyPlugin = require('copy-webpack-plugin');
|
||||||
|
const HtmlWebpackPlugin = require('html-webpack-plugin');
|
||||||
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
||||||
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
|
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
|
||||||
const SpeedMeasurePlugin = require('speed-measure-webpack-plugin');
|
const SpeedMeasurePlugin = require('speed-measure-webpack-plugin');
|
||||||
@ -119,6 +120,20 @@ const plugins = [
|
|||||||
{ from: 'stylesheets', to: 'stylesheets' },
|
{ from: 'stylesheets', to: 'stylesheets' },
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
|
|
||||||
|
// static pages
|
||||||
|
new HtmlWebpackPlugin({
|
||||||
|
template: './src/staticPages/404.html',
|
||||||
|
inject: true,
|
||||||
|
chunks: [],
|
||||||
|
filename: '404.html',
|
||||||
|
}),
|
||||||
|
new HtmlWebpackPlugin({
|
||||||
|
template: './src/staticPages/500.html',
|
||||||
|
inject: true,
|
||||||
|
chunks: [],
|
||||||
|
filename: '500.html',
|
||||||
|
}),
|
||||||
];
|
];
|
||||||
|
|
||||||
if (!process.env.CI) {
|
if (!process.env.CI) {
|
||||||
@ -375,12 +390,25 @@ const config = {
|
|||||||
/* for css linking images (and viz plugin thumbnails) */
|
/* for css linking images (and viz plugin thumbnails) */
|
||||||
{
|
{
|
||||||
test: /\.png$/,
|
test: /\.png$/,
|
||||||
|
issuer: {
|
||||||
|
exclude: /\/src\/staticPages\//,
|
||||||
|
},
|
||||||
loader: 'url-loader',
|
loader: 'url-loader',
|
||||||
options: {
|
options: {
|
||||||
limit: 10000,
|
limit: 10000,
|
||||||
name: '[name].[hash:8].[ext]',
|
name: '[name].[hash:8].[ext]',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
test: /\.png$/,
|
||||||
|
issuer: {
|
||||||
|
test: /\/src\/staticPages\//,
|
||||||
|
},
|
||||||
|
loader: 'url-loader',
|
||||||
|
options: {
|
||||||
|
limit: 150000, // Convert images < 150kb to base64 strings
|
||||||
|
},
|
||||||
|
},
|
||||||
{
|
{
|
||||||
test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
|
test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
|
||||||
issuer: {
|
issuer: {
|
||||||
|
Loading…
Reference in New Issue
Block a user