Any ideas about how to automate browser refresh when developing a FastAPI app?

[wlad]

First check

• I added a very descriptive title to this issue.
• I used the GitHub search to find a similar issue and didn't find it.
• I searched the FastAPI documentation, with the integrated search.
• I already searched in Google "How to X in FastAPI" and didn't find any information.
• I already read and followed all the tutorial in the docs and didn't find an answer.
• I already checked if it is not related to FastAPI but to Pydantic.
• I already checked if it is not related to FastAPI but to Swagger UI.
• I already checked if it is not related to FastAPI but to ReDoc.
• After submitting this, I commit to one of:
  • Read open issues with questions until I find 2 issues where I can help someone and add a comment to help there.
  • I already hit the "watch" button in this repository to receive notifications and I commit to help at least 2 people that ask questions in the future.
  • Implement a Pull Request for a confirmed bug.

Background

I've started learning FastAPI to develop web applications. What I am really missing is an automatic Browser refresh after any code change (including static files, templates, etc.). This seems to be a standard feature in almost any Javascript framework. Frontend people have several terms for that: auto reload / refresh, hot reload / refresh (hotreload), live reload / refresh (livereload), ...

May be a good starting point is something like https://github.com/lepture/python-livereload(?) Or should one better stick to something from JS ecosystem?

An old post of mine related to Flask may provide additional background:
https://stackoverflow.com/questions/56972813/how-to-automate-browser-refresh-when-developing-an-flask-app-with-python

[ArcLightSlavik]

Have you tried uvicorn/gunicorn reload arguments? While they won't reload the browser they will auto reload if you change an endpoint, don't think they auto reload on templates though (i almost never work with templates so if anyone can confirm/deny would be great)

On the javascript comparison. I don't completely agree with it, it is widely a standard feature in js because it more closely relies to the design/flow of the program. Most people i know do not use templates and have flask/fastapi as just endpoints, for which the reload argument from above works perfectly.

[ycd]

I actually didn't understand what live-reload does

You can use

uvicorn app_name:app --reload

Which will automatically apply the changes to your server. But if you are talking about completely refreshing the page(like F5), it's a different case i guess.

[ArcLightSlavik]

If your using gunicorn you can also watch for template reloads. Won't reload the browser but it's the closest you can get.

[wlad]

Have you tried uvicorn/gunicorn reload arguments?

Yes, I'm aware of uvicorn app_name:app --reload

I was thinking more about the F5 like browser page reload.

With --reload-extra-file FILES things are getting warmer but still not as hot as a real hot-reload 😆

[gturbo]

FYI I had the same problem and solved it in chrome using the following "live reload" extension.
https://chrome.google.com/webstore/detail/live-reload/jcejoncdonagmfohjcdgohnmecaipidc/related?hl=en

[JarnoRFB]

@gturbo Which settings did you use for the live reload extension? I am trying to reload the swagger docs and set

Host URL: http://127.0.0.1:8000/docs/
Source file URLs: 
  http://127.0.0.1:8000/openapi.json

together with main:app --reload, but it does not seem to work.

[vrslev]

@wlad Hi there! I recently found package that helps with this problem, arel.
Here's example how to use it with FastAPI.

[bart314]

FWIW, I have been using a (rather ancient, 2011) ruby-script by a [http://brettterpstra.com](Bret Terpstra), which in turn is based on [a script by a Carlo Zottman](<https://github.com/carlo/haml-sass-file-watcher)) to automatically reload Chrome whenever a change in the mentioned file-types are detected. This to full satisfaction. I couldn't find the original, so I've create a gist of it.