调整Django应用路由前缀后原有AJAX请求出现not found问题咨询

你修改根路由把field_plot应用挂载到/field_plot/路径下之后，该应用内部定义的所有子路由，都会自动拼上这个项目级的前缀：

• 原来挂载在根路径时，field_plot/urls.py里定义的^get_lines/$ 对应实际访问路径是 /get_lines/
• 现在挂载在/field_plot/下，同一个路由的实际访问路径已经变成了 /field_plot/get_lines/

但你前端AJAX代码里还是硬编码的旧绝对路径 /get_lines/，Django根路由里现在已经没有匹配这个地址的规则了，自然就会返回404。

• 快速临时修复：直接把前端所有AJAX请求的硬编码路径，加上新的路由前缀，比如把url: '/get_lines/' 改成 url: '/field_plot/get_lines/'。这种方法改动量小，但后续如果再调整应用的路由前缀，就要全量修改前端代码，维护成本很高。
• 工程化的长期方案：不要在前端硬编码接口路径，利用Django的URL反向解析能力自动生成准确的访问地址，从根源避免路径不匹配的问题：
  • 如果JS代码直接写在Django模板中，直接用模板标签生成路径即可，示例：

    $.ajax({
        // 自动匹配当前路由规则生成完整地址，无需手动拼接前缀
        url: "{% url 'get_lines' %}",
        // 顺带修正：原代码里的`data_type`是参数名拼写错误，jQuery正确的参数是`dataType`，建议修正
        dataType: 'json',
        success: function(data) {
            fillLinesMenu(JSON.parse(data))
            $("#form-lines option:eq(1)").attr("selected","selected");
            $("#form-lines").selectmenu("refresh")
        }
    })
    

  • 如果JS是独立的静态文件，无法直接使用Django模板标签，可以在模板页面的全局位置预定义所有需要用到的接口地址：

    <!-- 放在页面入口位置的全局脚本 -->
    <script>
    window.PLOT_API_CONFIG = {
        getLines: "{% url 'get_lines' %}",
        getPlot: "{% url 'get_plot' %}"
    }
    </script>
    

    再在独立的controller.js里直接引用全局配置的地址即可：

    $.ajax({
        url: window.PLOT_API_CONFIG.getLines,
        dataType: 'json',
        // 原有业务逻辑保持不变
    })
    

你可以直接在浏览器地址栏访问 http://localhost:8000/field_plot/get_lines/，如果能正常返回预期的JSON数据，就说明后端路由配置完全没问题，故障点只在前端请求路径和新路由规则不匹配。

内容的提问来源于stack exchange，提问作者António Dias