通过 Flutter App 和 JSON Web Token 在 Django 中验证用户

Posted

技术标签:

【中文标题】通过 Flutter App 和 JSON Web Token 在 Django 中验证用户【英文标题】:Authenticate User In Django via Flutter App and JSON Web Token 【发布时间】:2019-10-15 10:27:11 【问题描述】:

如何通过我的 Flutter 应用在​​ Django-Rest-Framework 中对用户进行身份验证? 我以前在 Postman 中这样做过,我就是这样做的:

    将请求发布到 (IP:8000/get-token/) > 返回 JSON Web 令牌 使用承载令牌获取请求到 (IP:8000/database/exercises/) > 返回 JSON 文件! - 请注意,如果我不使用令牌,我将一无所获!

如何通过 Flutter http.post 请求复制它?

这就是我将如何进行注册过程(在这种情况下不使用令牌):

//text-field controllers
TextEditingController usernameController = TextEditingController();
TextEditingController passwordController = TextEditingController();

//post request
postRequest() async 
String _url = "IP:8000/get-token/";
var response = await http.post(
  Uri.encodeFull(_url),
  headers:  "Accept" : "application/json",
  body: 
    "username": "$usernameController.text",
    "password": "$passwordController.text",
  ,
  encoding: Encoding.getByName("utf-8"),
);

//Name TextField (Simplified Code)
Container(
  margin: EdgeInsets.only(bottom: 2, top: 25),
    child: TextField(
    controller: nameController,
      decoration: InputDecoration(
      hintText: "Name..."             
      ))
)

//Password TextField (Simplified Code)
Container(
  margin: EdgeInsets.only(bottom: 2, top: 25),
    child: TextField(
    controller: passwordController,
      decoration: InputDecoration(
      hintText: "Password..."             
      ))
)

//Simplified but you get what I mean
Inkwell(
  child: Container()
  onTap() 
  
    postRequest(),
    Navigator.push(Into-App)
  
)

我的问题是:我如何从这个请求中得到响应? (如果用户名和密码与数据库匹配)。

我如何使用我获得的令牌来响应未来的请求以在应用程序内获取数据?

Django 后端:

#urls
from rest_framework_simplejwt.views import TokenObtainPairView, TokenRefreshView

urlpatterns = [
    path('admin/', admin.site.urls),
    path('database/', include('PlanThatWorkout.urls')),
    path('get-token/', TokenObtainPairView.as_view()),
    path('refresh-token/', TokenRefreshView.as_view())
]

#settings
REST_FRAMEWORK = 
'DEFAULT_PERMISSION_CLASSES' : ('rest_framework.permissions.IsAuthenticated',),
'DEFAULT_AUTHENTICATION_CLASSES' : ('rest_framework_simplejwt.authentication.JWTAuthentication',),

【问题讨论】:

当服务器返回令牌时,您将其保存在客户端的localStorage中。然后,在后续请求中,您将在 http 请求标头中包含该 localStorage 对象。请注意,在生产环境中,您应该只在 HTTPS 中执行此操作。 【参考方案1】:

您可以通过使用dart:convert 解码您的响应来获取令牌。

import 'dart:convert';
Map<String, dynamic> data = jsonDecode(reponse);
final jwt = data['jwt-key'];

要持久化您的数据,您可以使用path_provider 将其保存在磁盘上写入文件中:

import 'dart:async';
import 'dart:io';

import 'package:flutter/foundation.dart';
import 'package:path_provider/path_provider.dart';

Future<File> write(String jwt) async 
    final directory = await getApplicationDocumentsDirectory();
    final path = directory.path;
    final file = File('$path/jwt.txt');
    return file.writeAsString('$jwt');


Future<String> read() async 
    try  in a file or using 
      final directory = await getApplicationDocumentsDirectory();
      final path = directory.path;
      final file = File('$path/jwt.txt');
      String contents = await file.readAsString();
      return contents;
     catch (e) 
      return '';
    
  

或使用shared_preferences。

【讨论】:

响应不能分配给字符串类型的参数 我通过登录修复了所有问题,如何使用令牌发出发布请求? 只需将您的令牌添加到身份验证标头即可。 headers: "Accept": "application/json", "Content-Type": "application/x-www-form-urlencoded", "Authentication": "Bearer $token"

以上是关于通过 Flutter App 和 JSON Web Token 在 Django 中验证用户的主要内容,如果未能解决你的问题,请参考以下文章

任何人都知道我是不是可以通过 Flutter Web 以某种方式提供 json 文件?

如何在 Flutter Mobile App 中加载和查询本地 json 数据

Flutter使用 json_serializable 解析 JSON 最佳方案

在运行时将图像从计算机上传并显示到 FLUTTER WEB APP

如何从存储中选择多个图像并在 Flutter 和 Flutter Web App 中显示? [关闭]

是否可以在 Flutter Web 和 Flutter App 中实现 Agora Video Call?