Django登录验证通过后重定向，浏览器需刷新才跳转问题求助

当使用fetch发送异步AJAX请求时，后端返回的redirect重定向响应不会自动触发浏览器跳转。这是因为AJAX请求的重定向是在请求层面完成的——fetch会自动跟随重定向并获取目标页面的内容，但这个过程不会修改浏览器当前的URL或页面，所以你看不到跳转效果，只有手动刷新时，浏览器才会读取已登录的会话信息并跳转到对应页面。

最直接可靠的方式是让后端在登录成功时返回包含跳转URL的JSON响应，前端收到后主动触发页面跳转。

1. 修改Django后端代码 #

将登录成功后的redirect改为返回包含跳转地址的JsonResponse：

def Login(request):
    if request.method == 'POST':
        phone_number = request.POST.get('phoneNumber')
        password = request.POST.get("password")
        user = authenticate(request, username=phone_number, password=password)
        if user is not None and user.is_active:
            login(request, user)
            # 返回跳转URL给前端
            return JsonResponse({'redirect_url': reverse('eadmin')})
        return JsonResponse({'message' : False})
    else:
        if request.user.is_authenticated:
            return redirect(reverse('eadmin'))
        return render(request, '../templates/login/login.html')

2. 修改前端JavaScript代码 #

在fetch的响应处理逻辑中，检查是否存在redirect_url，如果有则主动跳转：

fetch(window.location.href, {
  method: "POST",
  body: formData,
  headers: { "X-CSRFToken": csrftoken || "" },
})
.then((response) => response.json())
.then((data) => {
  if (data.redirect_url) {
    // 跳转到后端指定的页面
    window.location.href = data.redirect_url;
  } else if (data.message === false) {
    swal.fire({
      icon: "error",
      text: "رمز عبور اشتباه است!",
    });
  }
})
.catch((err) => {
  console.error('请求失败:', err);
});

如果不想调整后端逻辑，可以通过fetch的响应URL判断是否发生了重定向，然后手动跳转：

fetch(window.location.href, {
  method: "POST",
  body: formData,
  headers: { "X-CSRFToken": csrftoken || "" },
})
.then((response) => {
  // 对比响应URL和当前页面URL，判断是否重定向
  if (response.url !== window.location.href) {
    window.location.href = response.url;
    return Promise.resolve(null); // 中断后续JSON解析逻辑
  }
  return response.json();
})
.then((data) => {
  if (data && data.message === false) {
    swal.fire({
      icon: "error",
      text: "رمز عبور اشتباه است!",
    });
  }
})
.catch((err) => {
  console.error('请求失败:', err);
});

这种方式的局限性在于：如果重定向目标页面返回的不是JSON格式，后续的response.json()会抛出错误，因此需要额外处理。

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