如何在具有python django作为后端的vue-cli应用程序中存储登录用户详细信息

Question

我制作了一个vue-cli登录表单，该表单需要在djnago rest api中通过令牌认证机制。我对如何从django api获取和存储凭据或令牌并将其存储在vue-cli应用程序中以验证前端用户感到困惑。

让我逐步解释您的情况

步骤1 ：我为python django框架制作了一个REST API，它以json格式提供响应数据，并且该api将执行所有功能，例如crud操作，身份验证。

步骤2 ：我在vue-cli中创建了一个登录表单，该表单将电子邮件和密码传递给其余的API，以执行令牌认证

step3 ：我的API响应令牌成功登录

step4 ：现在，由于不知道如何获取该令牌以及如何存储此令牌以在前端API中验证身份验证的用户而感到震惊

这又是我在vue-cli应用程序中的登录功能的样子

vue-js登录方法代码

login(){
this.$http.post(‘http://127.0.0.1:8000/api/aLogin/’,
{username:this.username,
password:this.password
}).then((response) => {
this.token = response.data;
});
console.log(this.token);
},

但是在上述方法中，我没有得到该令牌

django序列化器

class AdminLoginSerializer(serializers.Serializer):
    username = serializers.CharField()
    password = serializers.CharField()

    def validate(self, data):
        username = data.get("username", "")
        password = data.get("password", "")

        if username and password:
            user = authenticate(username=username, password=password)
            if user:
                if user.is_active:
                    data["user"] = user
                else:
                    msg = 'User is deactivated'
                    raise exceptions.ValidationError(msg)
            else:
                msg = "Unable to login with given credentials"
                raise exceptions.ValidationError(msg)
        else:
            msg = 'Must Provide Username and password'
            raise exceptions.ValidationError(msg)
        return data

django视图集

class AdminLoginView(APIView):
    def post(self, request):
        serializer = AdminLoginSerializer(data=request.data)
        serializer.is_valid(raise_exception=True)
        user = serializer.validated_data['user']
        token, created = Token.objects.get_or_create(user=user)
        return Response({"Authorization": token.key, 'id': token.user.id}, status=200)