问题描述

在App Service for Linux环境中,部署Django应用,访问应用页面时候,出现css、js等静态资源文件加载失败问题。

浏览器Console提示的错误消息为:

Refused to apply style from '<URL>' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

问题分析

根据错误消息,初步怀疑是Django的静态文件配置路径不对。所以需要根据Django静态文件设置,查看是否配置 STATIC_URL。 

当项目在本地运行时,STATIC_URL设置如下:

STATIC_URL = 'static/'

但当部署到云上环境时候,需要考虑从环境变量中读取部署后(非开发环境路径)的静态文件夹路径:

STATIC_URL = os.environ.get("DJANGO_STATIC_URL", "/static/")
STATIC_ROOT = os.environ.get("DJANGO_STATIC_ROOT", "./static/")

然后,在App Service 的应用程序配置页面查看  DJANGO_STATIC_ROOT 和 DJANGO_STATIC_URL 是否配置并配置正确。

参考资料

How to manage static files (e.g. images, JavaScript, CSS):https://docs.djangoproject.com/en/4.0/howto/static-files/

【Azure 应用服务】在Azure App Service for Linux环境中,部署的Django应用,出现加载css、js等静态资源文件失败的更多相关文章

  1. 【Azure 应用服务】PHP应用部署在App Service for Linux环境中,上传文件大于1MB时,遇见了413 Request Entity Too Large 错误的解决方法

    问题描述 在PHP项目部署在App Service后,上传文件如果大于1MB就会遇见 413 Request Entity Too Large 的问题. 问题解决 目前这个问题,首先需要分析应用所在的 ...

  2. 【Azure 应用服务】App Service For Windows 环境中部署Python站点后,如何继续访问静态资源文件呢(Serving Static Files)?

    问题描述 当创建一个App Service 后,运行时环境和版本选择Windows 和 Python 3.6. 登录Kudu 站点查看,默认的文件有 web.config, hostingstart- ...

  3. 【Azure 应用服务】一个 App Service 同时部署运行两个及多个 Java 应用程序(Jar包)

    问题描述 如何在一个AppService下同时部署运行多个Java 应用程序呢? 问题解答 因为App Service的默认根目录为 wwwroot.如果需要运行多个Java 应用程序,需要在 www ...

  4. 【Azure 应用服务】在 App Service for Windows 中自定义 PHP 版本的方法

    问题描述 在App Service for Windows的环境中,当前只提供了PHP 7.4 版本的选择情况下,如何实现自定义PHP Runtime的版本呢? 如 PHP Version 8.1.9 ...

  5. 【Azure 应用服务】App Service For Linux 部署PHP Laravel 项目,如何修改首页路径为 wwwroot\public\index.php

    问题描述 参考官方文档部署 PHP Laravel 项目到App Service for Linux环境中,但是访问应用时候遇见了500 Server Error 错误. 从部署的日志中,可以明确看出 ...

  6. 【Azure 应用服务】App Service for Linux 中实现 WebSocket 功能 (Python SocketIO)

    问题描述 使用 python websockets 模块作为Socket的服务端,发布到App Service for Linux环境后,发现Docker Container无法启动.错误消息为: 2 ...

  7. 【Azure 应用服务】NodeJS Express + MSAL 应用实现AAD集成登录并部署在App Service Linux环境中的实现步骤

    问题描述 实现部署NodeJS Express应用在App Service Linux环境中,并且使用Microsoft Authentication  Library(MSAL)来实现登录Azure ...

  8. 【Azure 应用服务】App Service For Linux 如何在 Web 应用实例上住抓取网络日志

    问题描述 在App Service For Windows的环境中,我们可以通过ArmClient 工具发送POST请求在Web应用的实例中抓取网络日志,但是在App Service For Linu ...

  9. 【Azure 应用服务】App Service For Linux 部署Java Spring Boot应用后,查看日志文件时的疑惑

    编写Java Spring Boot应用,通过配置logging.path路径把日志输出在指定的文件夹中. 第一步:通过VS Code创建一个空的Spring Boot项目 第二步:在applicat ...

  10. 【Azure 应用服务】Azure App Service For Linux 上实现 Python Flask Web Socket 项目 Http/Https

    问题描述 在上篇博文"[Azure 应用服务]App Service for Linux 中实现 WebSocket 功能 (Python SocketIO)"中,实现了通过 HT ...

随机推荐

  1. 基于javaPoet的缓存key优化实践

    一. 背景 在一次系统opsreview中,发现了一些服务配置了@Cacheable注解.@cacheable 来源于spring cache框架中,作用是使用aop的方式将数据库中的热数据缓存在re ...

  2. echarts api的介绍

    参考的地址:https://echarts.apache.org/zh/api.html echarts.init echarts.init(dom?: HTMLDivElement|HTMLCanv ...

  3. Java-Stream-flatMap

    Leave leave1 = new Leave("1","1",new Date(),CollUtil.newArrayList("A", ...

  4. ROS节点通信(三)action

    官方wiki:http://wiki.ros.org/actionlib 目录 1.说明 2.代码示例 2.1.定义数据结构 2.1.1.goal 2.1.4.result 2.1.3.feedbac ...

  5. Yarp 与 Nginx性能大比拼不出所料它胜利了!

    Yarp 与 Nginx 性能大比拼 测试环境: Ubuntu 22.04.3 LTS (GNU/Linux 6.5.0-14-generic x86_64) Intel(R) Xeon(R) CPU ...

  6. 10、数据库学习规划:MySQL - 学习规划系列文章

    MySQL数据库是笔者认识的几个流行的数据库之一.类似于Linux重装系统,其也是开源的,最主要是有很多的社区支持,众多的开发者对其能够进行使用,所以其功能也挺强大,便于使用.通过对MySQL数据库的 ...

  7. Apache和Nginx是什么?|Nginx和Reactor是什么?|网路IO的本质|阻塞队列|异步非阻塞IO

    前言 那么这里博主先安利一些干货满满的专栏了! 首先是博主的高质量博客的汇总,这个专栏里面的博客,都是博主最最用心写的一部分,干货满满,希望对大家有帮助. 高质量干货博客汇总https://blog. ...

  8. C语言无锁高并发安全环形缓冲队列设计(一)

    1.前言 队列,常用数据结构之一,特点是先进先出. 队列是一种特殊的线性表,特殊之处在于它只允许在表的前端(front)进行删除操作,而在表的后端(rear)进行插入操作,和栈一样,队列是一种操作受限 ...

  9. Mac 和 windows上 好用的截图 工具 Snipaste

    Snipaste 官网:https://zh.snipaste.com/ ========================= 使用方法,比较简单,可以官网查看

  10. ASP.NET Core分布式项目实战(运行Consent Page)--学习笔记

    任务21:运行Consent Page 修改 Config.cs 中的 RequireConsent 为 true,这样登录的时候就会跳转到 Consent 页面 修改 ConsentControll ...