Django访问five_day_forecast.html时静态JS文件404无法识别问题

问题根因 #

你使用的相对路径static/capstone/five_day.js会基于当前访问页面的URL拼接资源地址：

• 你访问five_day_forecast.html的URL路径前缀是/five_day/，拼接后得到报错中的/five_day/static/capstone/five_day.js，不是正确的静态资源路径，所以返回404
• 你访问home.html时URL是站点根路径/，拼接后得到/static/capstone/temp.js刚好匹配正确的静态资源路径，所以可以正常加载

解决方法 #

方案1（Django官方推荐） #

使用Django内置的static模板标签生成资源路径，步骤如下：

1. 在five_day_forecast.html文件顶部添加模板标签加载声明

{% load static %}

2. 修改script标签的src属性为模板变量写法

<script src="{% static 'capstone/five_day.js' %}"></script>

该写法会自动拼接你在settings.py中配置的STATIC_URL前缀，无论当前页面处于什么URL路径下都能生成正确的资源地址。

方案2（临时快速修复） #

直接给资源路径添加开头的斜杠，强制从站点根路径解析资源：

<script src="/static/capstone/five_day.js"></script>

配置校验（可选） #

如果修改路径后仍然报错，确认settings.py中的基础静态资源配置正确：

• INSTALLED_APPS列表中已添加django.contrib.staticfiles
• 配置了STATIC_URL = 'static/'

内容的提问来源于stack exchange，提问作者user14567126