Azure 部署的 django 应用程序在生产中未在 Vuejs 前端显示媒体文件

Question

These are the packages that I am using:

Django==3.2
django-storages==1.12.3

I am trying to deploy a django REST API with Vuejs frontend on azure. This is my directory structure for the django API.

I have used djang-storages[azure] to use an azure container blob to store media files. I went through a tutorial to setup the blob connection with django. Some configuration that I did with settings.py are these

Settings.py

MEDIA_LOCATION = "media"

AZURE_ACCOUNT_NAME = "my account name"
AZURE_ACCOUNT_KEY="my token"
AZURE_CUSTOM_DOMAIN = f'{AZURE_ACCOUNT_NAME}.blob.core.windows.net'
AZURE_LOCATION="media"
AZURE_CONTAINER="media"

STATIC_LOCATION = "static"
STATIC_URL = f'https://{AZURE_CUSTOM_DOMAIN}/{STATIC_LOCATION}/'
STATICFILES_STORAGE = 'storages.backends.azure_storage.AzureStorage'
DEFAULT_FILE_STORAGE = 'el.custom_azure.AzureMediaStorage'
AZURE_CONNECTION_TIMEOUT_SECS=100

and my custom_azure.py looks like this:

custom_azure.py

from storages.backends.azure_storage import AzureStorage

class AzureMediaStorage(AzureStorage):
    account_name="eltechstorage"
    account_key="my token"
    azure_container="media"
    expiration_specs=None

urls.py

from django.contrib import admin
from django.urls import path,include
from django.contrib.staticfiles.urls import  staticfiles_urlpatterns
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
    path('admin/', admin.site.urls),
    path("",include("main.urls"))
]
urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

When I am using azure blob container to upload media files it is working perfectly in development environment and when I am testing the API from the deployed url, it is giving me the path of the file as expected on which if i go to, downloads the file for me, everything is working perfect. Below is attached a sample response from the API.

The Problem

But when I use the deployed version of both Django and Vuejs App, and I open the page, where the API returns the object containing link to the file. it displays a 404 error.

Answer 1

according to django doc, the static helper is only workable in debug mode. therefore, in your production environment, if you don't have debug mode enabled, then you static view will not be there. as a temporary measure, you can enable debug by put DEBUG=True in your application settings. as recommendation by django , you should serve your static files in a dedicate server in production environment.