Why won't my CSS, images, and Java script load once my app is deployed on Azure?

Question

I am using VS code with Django and everything runs fine on my Local server, but once I deploy my app on Azure it wont load any of my images, CSS, and Java script. I am not using whitenoise. I do have my requirements.txt file. I have my allowed_hosts = ["*"]. Any help would be awesome!

Answer 1

It seems the server returns html page when requesting style.css, this can be a 404 page or default page. To understand whether the css send correctly, try browsing the css URL directly from the browser address bar.

for e.g. you may use <<your application address>>/static/style.css to load the style sheet. use this url in browser and see what it returns.

Hope this helps

Answer 2

Just adding to sreejukg and DillonJS -- For Django web app which includes static front-end files, kindly check the instructions on Managing static files in the Django documentation

If you haven’t done this already, kindly try these modifications:

Oryx runs manage.py collectstatic on your behalf unless you specify the DISABLE_COLLECTSTATIC env var. Make sure you've set STATIC_ROOT in settings.py:

// settings.py
STATIC_ROOT = './static/'

Or

having STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')

I understand you have mentioned you’re not levering Whitenoise - To host static files in your web app, you may add the whitenoise package to requirements.txt and the configuration for it to settings.py. It specifically serves those files that are found in the folder specified by the Django STATIC_ROOT variable.

Documentation- Serve static files for Django apps

Sample - You can find a Django working sample with static files for Web Apps On Linux