如何解决MIME类型（'text/html'）不是支持的样式表MIME类型

尼耳多
394 阅读1分钟

我有一个django + reactjs的应用程序，我已经部署在digitalocean应用平台。我正在使用reactjs的生产构建，用命令npm rub build ，并将其与django一起服务。我正在使用 digitalocean 空间进行静态和媒体文件的传输和服务。

现在，在部署之后，我在控制台中得到了以下错误：

Refused to apply style from 'https://solvelitigation.com/static/css/main.e8b3c255.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

Refused to apply style from 'https://solvelitigation.com/static/css/main.e8b3c255.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

efused to execute script from 'https://solvelitigation.com/static/js/main.a796034b.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

Manifest: Line: 1, column: 1, Syntax error.

Refused to apply style from 'https://solvelitigation.com/static/css/main.e8b3c255.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

由于上述错误，页面中没有任何东西被呈现出来。

我不知道为什么会发生这种情况，也不知道如何解决这些问题。请向我建议如何解决这个问题

我已经尝试了很多SO的解决方案，但似乎没有一个对我有用。当我试图从localhost运行应用程序时，我也得到了同样的错误。

以下是我的设置

cdn/conf.py(我在这里配置了我的空间设置)

AWS_ACCESS_KEY_ID= os.environ.get("AWS_ACCESS_KEY_ID")

AWS_SECRET_ACCESS_KEY= os.environ.get("AWS_SECRET_ACCESS_KEY")

AWS_STORAGE_BUCKET_NAME = "bucket name"

AWS_S3_ENDPOINT_URL="endpoint"

AWS_DEFAULT_ACL = 'public-read'

AWS_S3_OBJECT_PARAMETERS = {
    "CacheControl":"max-age=86400",
}

AWS_LOCATION = f"location of the bucket"

STATIC_URL = f'{AWS_S3_ENDPOINT_URL}/static/'

MEDIA_URL =  f'{AWS_S3_ENDPOINT_URL}/media/'

DEFAULT_FILE_STORAGE = "solvelitigation_back.cdn.backends.MediaRootS3Boto3Storage"

STATICFILES_STORAGE = "solvelitigation_back.cdn.backends.StaticRootS3Boto3Storage"

settings.py(在这里被导入的设置如下)

from .cdn.conf import (
AWS_ACCESS_KEY_ID,
AWS_SECRET_ACCESS_KEY,
AWS_STORAGE_BUCKET_NAME,
AWS_S3_ENDPOINT_URL,
AWS_DEFAULT_ACL,
AWS_S3_OBJECT_PARAMETERS,
AWS_LOCATION,
STATIC_URL,
MEDIA_URL,
DEFAULT_FILE_STORAGE,
STATICFILES_STORAGE,
)


AWS_ACCESS_KEY_ID
AWS_SECRET_ACCESS_KEY
AWS_STORAGE_BUCKET_NAME
AWS_S3_ENDPOINT_URL
AWS_DEFAULT_ACL
AWS_S3_OBJECT_PARAMETERS
AWS_LOCATION
STATIC_URL
MEDIA_URL
DEFAULT_FILE_STORAGE
STATICFILES_STORAGE

STATIC_ROOT = BASE_DIR / 'staticfiles' 

MEDIA_ROOT = BASE_DIR / 'mediafiles'

STATICFILES_DIRS = [
        BASE_DIR / 'build/static',
    ]

urls.py

urlpatterns = [
    path('admin/', admin.site.urls),
    path('account/',include('account.urls')),
    path('civil/',include('civil.urls')),
    path('criminal/',include('criminal.urls')),
    path('corporate/',include('corporate.urls')),
    path('service/',include('service.urls')),
    path('taxation/',include('taxation.urls')),
]
urlpatterns += static(settings.STATIC_URL,
                          document_root=settings.STATIC_ROOT)
urlpatterns += static(settings.MEDIA_URL,
                          document_root=settings.MEDIA_ROOT)


# This is will cath the routes in the frontend and 404 errors
urlpatterns += [re_path(r'^.*', TemplateView.as_view(template_name='index.html'))]

index.html这是从反应中导入的html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="icon" href="/static/images/favicon-icon.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />

    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />

  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
  </body>
</html>
avatar
文章
阅读
粉丝