django 登录在不刷新页面的情况下不会重定向

Question

我是一名前端开发人员，正在与使用 Django 的后端团队一起开发登录页面。在我的login.html 文件中，有一个表单可以从用户那里获取电话号码和密码。我通过 javascript 从 from 获取用户输入，并在验证后通过获取请求将其发送到后端。但有一个问题。后端人员说：“我通过您的请求正确获取了电话号码和密码，如果密码和电话号码正确且 Django 正确重定向，则将页面重定向到新的 url，但浏览器不会转到新页面，我应该刷新当我刷新浏览器时，它会正确地转到新页面”。 我在 stackoverflow 中搜索并检查了类似的 Django 重定向问题，但没有一个是我的问题。我也问过Gemini，但没有给我很好的答复。 我提供了 Django 重定向代码以及我的 Javascript 和 html 代码：

// ================================================ from validation:

      const form = document.querySelector("form");

      const phoneRegEx = /^09\d{9}$/;

      const formData = new FormData();

      form.addEventListener("submit", (event) => {
        event.preventDefault();
        const phone_value = document.querySelector(".phone").value;
        const passwordValue =                      document.querySelector(".password").value;
        document.querySelector(".phone").classList.remove("notValid");
        document.querySelector(".password").classList.remove("notValid");
        document.querySelector(".password-empty-error").style.display = "none";
        document.querySelector(".phone-empty-error").style.display = "none";
        document.querySelector(".phone-invalid-error").style.display = "none";
        if (phone_value && passwordValue) {
          if (phoneRegEx.test(phone_value)) {
            formData.append("phoneNumber", phone_value);
            formData.append("password", passwordValue);
            // for (const key of formData.keys()) {
            //     console.log(key, ":", formData.get(key));
            // }

            function getCookie(name) {
              let cookieValue = null;
              if (document.cookie && document.cookie !== "") {
                const cookies = document.cookie.split(";");
                for (let i = 0; i < cookies.length; i++) {
                  const cookie = cookies[i].trim();
                  // Does this cookie string begin with the name we want?
                  if (cookie.substring(0, name.length + 1) === name + "=") {
                    cookieValue = decodeURIComponent(
                      cookie.substring(name.length + 1)
                    );
                    break;
                  }
                }
              }
              return cookieValue;
            }
            const csrftoken = getCookie("csrftoken");
            fetch(window.location.href, {
              method: "POST",
              body: formData,
              headers: { "X-CSRFToken": csrftoken ? csrftoken : "" },
            })
              .then((response) => {
                return response.json();
              })
              .then((data) => {
                if (data.message === false) {
                  swal.fire({
                    icon: "error",
                    text: "رمز عبور اشتباه است!",
                  });
                }
              })
              .catch((err) => {});

<form action="/" method="post">
       {% csrf_token %}
       <div class="form-group">
                <input
                  placeholder="شماره موبایل"
                  class="form-control text-right phone"
                  type="text"
                  name="phone"
                />

                <small class="phone-empty-error text-danger">
                  لطفا این قسمت را خالی نگذارید
                </small>
                <small class="phone-invalid-error text-danger">
                  شماره موبایل نادرست است
                </small>
       </div>
       <div class="form-group">
                <input
                  placeholder="رمز عبور"
                  class="form-control text-right password"
                  type="password"
                  name="password"
                />

                <small class="password-empty-error text-danger">
                  لطفا این قسمت را خالی نگذارید
                </small>
        </div>
         <div class="container remember d-flex justify-content-                    between mt-3">
                <span>
                  <a class="text-dark" href="{% url 'forgot'      %}">فراموشی رمز</a>
                </span>
          </div>

              <button class="btn login-btn w-100 mt-3 mb-2"                          type="submit">
                 ورود
              </button>
             
</form>

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)

        return redirect(reverse('eadmin'))
    return JsonResponse({'message' : False})
else:
    if request.user.is_authenticated:
        return redirect(reverse('eadmin'))

    return render(request, '../templates/login/login.html')

Answer 1

salam dash sepehr ..... 看问题是从您的模板中提出的。在你的

login.html

中，你应该将phone标签的name属性更改为等于你的views.py。我的意思是您在模板中输入了 [ 电话 ]，并在登录视图中输入了 [ 电话号码 ]。这才是真正的问题。让它们相等，你就可以开始了。 还有一件事：你也需要删除这一行：

return JsonResponse({'message' : False})

从你的角度来看。进行更改并在此处发送评论。