Symfony投票系统AJAX请求报No route found 404错误如何解决？

核心原因 #

你遇到的404错误是前端硬编码的URL路径和Symfony项目实际部署的路径前缀不匹配导致的。你本地运行时项目并没有部署在域名根目录，所以直接请求/comments/xxx会找不到对应路由。

修复方案 #

方案1：动态生成路由（永久有效，适配所有环境，推荐） #

不要在JS代码里硬编码URL前缀，通过Twig模板动态生成正确的路由地址传给前端：

1. 在渲染投票组件的Twig模板中，给投票容器增加data-vote-url属性：

<div class="js-vote-arrows" 
     data-vote-url="{{ path('app_comment_show', {id: comment.id}) }}">
  <!-- 原有投票箭头、票数展示代码 -->
</div>

2. 修改JS代码，直接使用动态生成的路径：

var $container = $('.js-vote-arrows');
$container.find('a').on('click', function(e) {
    e.preventDefault();
    var $link = $(e.currentTarget);

    $.ajax({
        url: $container.data('vote-url') + '/' + $link.data('direction'),
        method: 'POST'
    }).then(function(data) {
        $container.find('.js-vote-total').text(data.votes);
    });
});

方案2：临时验证方案 #

如果要快速验证接口本身是否正常，可以手动把JS里的URL前缀补全：

// 把前缀替换成你实际的项目访问路径即可
url: '/dev/public/comments/10/vote/'+$link.data('direction'),

如果请求成功，就可以确认是路径前缀的问题，后续还是建议用方案1避免不同环境下路径不兼容。

其他可选排查点 #

• 命令行执行php bin/console debug:route app_comment_show，确认路由已经被Symfony正常加载，路径规则匹配正确
• 如果本地使用Symfony CLI，直接执行symfony server:start启动服务，用输出的本地域名（默认是https://127.0.0.1:8000）访问项目，此时硬编码的根路径/comments/xxx也可以正常访问
• 如果修复路径后出现403错误，需要在AJAX请求中带上CSRF令牌：
  先在页面头部增加meta标签存储令牌：

  <meta name="csrf-token" content="{{ csrf_token('comment-vote') }}">
  

  再给AJAX请求加请求头：

  $.ajax({
      url: 你的请求地址,
      method: 'POST',
      headers: {
          'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
      }
  })
  

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