Django项目中如何执行fetch请求不与页面当前pathname路径冲突

架构老林

2026-9-27

问题原因

本质是你使用的相对路径的浏览器解析规则导致的：不带前导/的路径会被浏览器自动拼接在当前页面所在的父路径后，根路径下的页面拼接逻辑刚好匹配你的路由，而/profile/xxx路径下的页面会多拼接一层profile/，最终生成不存在的请求路径。

解决方案

按推荐优先级排序：

最简单快速修复：直接给fetch路径加前导/，修改为 /tweets/${tweetid}
加了前导/的路径会被浏览器识别为站点根路径的绝对路径，不管当前页面在哪个子路径下，最终请求路径都会是你的域名/tweets/xxx，完全匹配你配置的Django路由。
更符合Django规范的无硬编码方案：用Django模板的url标签生成路径
避免后续修改urls.py的路由规则后还要同步改JS代码的硬编码路径，操作如下：
1. 先给你的tweet详情路由加name标识，urls.py配置参考：
```
path('tweets/<int:tweetid>', your_view_func, name='tweet-detail')
```
2. 在公共基础模板（或者用到该JS的HTML页面）里提前渲染路由前缀为全局JS变量：
```
<script>
// 先用0作为占位id生成路径，再切掉末尾的0，保留通用前缀
window.TWEET_API_PREFIX = "{% url 'tweet-detail' 0 %}".slice(0, -1);
</script>
```
3. JS里的fetch路径改写成：${window.TWEET_API_PREFIX}${tweetid}
站点部署在子目录的特殊场景：
可以在settings.py中自定义全局站点前缀配置，模板渲染路径时统一带上前缀即可，避免出现根路径偏移的问题。