Adding a 200 page for client-side routing
pushState and the HTML5 History API, or using a framework React, Angular, or Ember—you need to ensure that your URLs will reach your router.
To take advantage of this with Surge, add a
200.html file into the root of your project. Now, when a request for a URL comes in where you don’t have a static HTML page, it will reach your 200 page instead, allowing you to use your client-side router.
Create this file using your favourite text editor, or the command line:
echo '<h1>Hello, catch all</h1>' > 200.html
Once you’ve published your project, all requests will fallback to this page.
The 200 page and clean URLs
200.html file is a fallback, like the
404.html file, but for single page apps and client-side routing.
For example, a basic project might contain an
index.html page, and
about.html page, and a client-side router which has been included in
my-project.surge.sh/ ├─200.html ├─index.html ├─about.html └─app.js
Once this project is published on Surge, if a visitor requests
/about, that static page will be served as normal. If a visitor requests
/login, there is no static page to serve, but the 200 page will be served instead.
200.html file, you can load your app as you would normally, for example:
<!-- 200.html --> <script src="app.js"></script>
The 200 page helps you re-route all requests to your client-side application, improving the usefulness of your URLs whether you are using…