Django + DRF + Angular：应用程序呈现来自 auth 包的 JSON 响应，而不是重定向

Question

我正在开发一个带有 Django 后端、AngularJS 前端和一个 Django REST Framework (DRF) API 供前端使用的 web 应用程序。我已经发布了coupleother 关于如何在这种设置中处理身份验证的问题，但我想我已经大致弄清楚了如何去做。我正在使用 django-rest-auth 包并意识到我可以简单地将提供的login.html 模板中的表单操作更改为指向 django-rest-auth 端点之一。登录表单如下所示：

<div class="container">
   <section id="loginForm">
        <form action="/rest-auth/login/?format=json" method="post" class="signin_form" style="font-weight: 400; font-style: normal">
            {% csrf_token %}
            <h1 class="sports_blue">SIGN IN</h1>
                <label for="id_username" class="sr-only control-label">User name</label>
                {{ form.username }}
                <label for="id_password" class="sr-only control-label">Password</label>
                {{ form.password }}
                <input type="hidden" name="next" value="/dashboard" />
                <div class="checkbox">
                    <label>
                        <input type="checkbox" value="remember-me"> Remember me
                    </label>
                </div>
                <input type="submit" value="Sign In" class="btn btn-primary btn-block" />

            {% if form.errors %}
            <p class="validation-summary-errors">Please enter a correct user name and password.</p>
            {% endif %}
            <br />
            <p><b>Don't have an account?</b> <a><b>Sign up for free!</b></a></p>
        </form>
    </section>
   </div>

这会命中 auth 端点并成功登录，但不会呈现 next 中指定的 /dashboard，而是显示 JSON 响应（用户的令牌或错误）。

我认为这是因为香草 Django 身份验证后端不返回纯 JSON，但我不确定如何呈现 next 页面。我应该使用不同的模板吗？或者我是否需要在我的配置中进行其他更改以完全删除基本的 Django 身份验证？我在 settings.py 中仍然有 auth 中间件：

MIDDLEWARE_CLASSES = (
'django.middleware.common.CommonMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
# Uncomment the next line for simple clickjacking protection:
# 'django.middleware.clickjacking.XFrameOptionsMiddleware',
) 

我知道 django-rest-auth 作者也有一个 angular 模块用于此目的，但是它已经一年多没有更新了，所以我不确定它是否适合使用。有什么方法可以让我完全在前端包含登录而不是使用上面提到的模板？

Answer 1

login.html 是一个常用的 Django 模板，因此您似乎没有将 Angular 用于登录页面。 django-rest-auth 提供了一些用于身份验证的 API 端点，它们返回 JSON。

您正在尝试以前台模式（非 AJAX）从浏览器执行 POST，因此浏览器会向您显示该视图返回的任何内容 - JSON。端点不考虑?next。

此应用假定您使用的是 Angular 或其他 SPA，它们会使用 AJAX 发布到这些端点并实现重定向到 ?next 和其他 Javascript 功能。但不在 Django 模板中的 <form> 中使用 API 端点。

几个选项：

• 在 Angular 中实现身份验证视图，这将使用 django-rest-auth 端点。或使用boilerplate projects。

• 使用 Django 页面，但将 <form> 指向 Django 的默认登录视图或自定义 常规 Django 视图，该视图不是 API 端点但返回 text/html 或重定向到 @987654331 @。