Routed url does not exist upon refresh

Learn
1

Hi guys. I’m building a web app with Elm as the frontend and flask as the backend. The app consists of a home page and several tutorial pages linked from it. The only issue is this:

  1. In the home page, click on the left-most button to enter the first tutorial
  2. Once you are in the first tutorial page, you can see that the page URL changes to http://106.15.39.117:8080/tutorial/Intro%20to%20Machine%20Learning
  3. Refresh the page or directly visit the URL in step 2 and you will get a page not found error.

However, the above issue never happens when I tested the app using elm-live on localhost. Does it have anything to do with how flask and elm-live serve files differently? How can I fix this? Thanks.

Front-end Elm code: https://github.com/AlienKevin/AIWaffle-website
Back-end python code: https://github.com/jimmy-zx/AIwaffle_Server1

2

This is because the server doesn’t recognise the paths e.g. /tutorial/
You server needs to accept any path and server the Elm application.
e.g. if you hit /tutorial/, the backend needs to serve an html with the Elm app

3

I see. Do you have any idea how this can be done in Flask?

4

No sorry, try searching for flask route catch all

5

Thank you very much. I think I can figure it out on my own from your answer.

6

Following Sebastian’s solution, you could use flask’s method render_template('some_html_file.html') (returning it from the view method that catches your route) and then initialize your elm app from there.

7

Thanks, I finally solved the issue yesterday.