How do I make Angular 2 routing work with App Engine on page refresh?

Question

I am trying to make an Angular 2 app running on App Engine Standard Environment. It works with the following app.yaml configuration when navigating within the app:

handlers:
- url: /api/.*
  script: _go_app

- url: (.*)/
  static_files: static\1/index.html
  upload: static

- url: (.*)
  static_files: static\1
  upload: static

I can click on a link from / to /clients or /clients/234234 and it works fine.

However if I refresh the browser in a non base path e.g. http://myapp.appspot.com/clients/234234 then I get a 404 error. I guess I need to serve my index.html from all paths which is what I thought (.*)/ and (.*) would do.

How can I set up my handlers/app so I can use HTML5 routing and not let this happen?

Dan · Accepted Answer · 2016-09-03 23:24:46Z

3

I have a bunch of static files that need to be served so I added their mappings first. I also (most importantly) changed the way index.html was served:

handlers:
- url: /api/.*
  script: _go_app

- url: /(.*\.svg)
  static_files: static/\1
  upload: static/(.*\.svg)

- url: /(.*\.js)
  static_files: static/\1
  upload: static/(.*\.js)

- url: /(.*\.map)
  mime_type: application/octet-stream
  static_files: static/\1
  upload: static/(.*\.map)

- url: (.*)/
  static_files: static/index.html
  upload: static

- url: (.*)
  static_files: static/index.html
  upload: static

answered Sep 3, 2016 at 23:24

Dan

5,3635 gold badges38 silver badges68 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How do I make Angular 2 routing work with App Engine on page refresh?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related