欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Flutter網(wǎng)絡(luò)請(qǐng)求Dio庫(kù)的使用及封裝詳解

 更新時(shí)間:2022年04月14日 11:34:51   作者:WEB前端李志杰  
本文主要介紹了Flutter網(wǎng)絡(luò)請(qǐng)求Dio庫(kù)的使用及封裝詳解,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧

Dart語(yǔ)言內(nèi)置的HttpClient實(shí)現(xiàn)了基本的網(wǎng)絡(luò)請(qǐng)求相關(guān)的操作。但HttpClient本身功能較弱,很多網(wǎng)絡(luò)請(qǐng)求常用功能都不支持,因此在實(shí)際項(xiàng)目中,我們更多是使用dio庫(kù)實(shí)現(xiàn)網(wǎng)絡(luò)請(qǐng)求。

注:Flutter官網(wǎng)同樣推薦在項(xiàng)目中使用Dio庫(kù)。

Dio文檔地址: pub.dev地址:dio | Dart Package

一、項(xiàng)目目錄結(jié)構(gòu)

在這里插入圖片描述

文件夾功能
components放置全局共用組件
router全局路由管理
service管理接口請(qǐng)求并對(duì)返回?cái)?shù)據(jù)進(jìn)行處理,復(fù)雜功能邏輯處理
storeprovider全局狀態(tài)管理
utile工具類,例如:接口請(qǐng)求工具類,數(shù)據(jù)持久化工具類,加密解密工具類……
views界面管理,實(shí)現(xiàn)界面UI繪制的代碼邏輯

二、封裝思路:

1、在DioRequest工具類中統(tǒng)一初始化網(wǎng)絡(luò)請(qǐng)求常見(jiàn)配置,實(shí)現(xiàn)請(qǐng)求攔截器、響應(yīng)攔截器以及錯(cuò)誤處理。

2、統(tǒng)一在service中管理接口請(qǐng)求,并且對(duì)返回的數(shù)據(jù)根據(jù)實(shí)際需求進(jìn)行處理,如果數(shù)據(jù)的修改需要更新UI或者需要全局共享該數(shù)據(jù),可以結(jié)合provider實(shí)現(xiàn)。

三、添加依賴

在pubspec.yaml文件中添加所需要的第三方依賴庫(kù)

dev_dependencies:
  flutter_test:
    sdk: flutter 
  # The "flutter_lints" package below contains a set of recommended lints to
  # encourage good coding practices. The lint set provided by the package is
  # activated in the `analysis_options.yaml` file located at the root of your
  # package. See that file for information about deactivating specific lint
  # rules and activating additional ones.
  flutter_lints: ^1.0.0
  # 數(shù)據(jù)請(qǐng)求
  dio: ^4.0.4

四、簡(jiǎn)單實(shí)現(xiàn)網(wǎng)絡(luò)請(qǐng)求

utils目錄中新建dio_request.dart文件實(shí)現(xiàn)DioRequest網(wǎng)絡(luò)請(qǐng)求的工具類。

import 'package:dio/dio.dart';
/// dio網(wǎng)絡(luò)請(qǐng)求配置表 自定義
class DioConfig {
  static const baseURL = 'http://117.34.71.31:8081/paas-admin'; //域名
  static const timeout = 10000; //超時(shí)時(shí)間
} 
// 網(wǎng)絡(luò)請(qǐng)求工具類
class DioRequest {
  late Dio dio;
  static DioRequest? _instance;
  /// 構(gòu)造函數(shù)
  DioRequest() {
    dio = Dio();
    dio.options = BaseOptions(
        baseUrl: DioConfig.baseURL,
        connectTimeout: DioConfig.timeout,
        sendTimeout: DioConfig.timeout,
        receiveTimeout: DioConfig.timeout,
        contentType: 'application/json; charset=utf-8',
        headers: {});
    /// 請(qǐng)求攔截器 and 響應(yīng)攔截機(jī) and 錯(cuò)誤處理
    dio.interceptors.add(InterceptorsWrapper(onRequest: (options, handler) {
      print("\n================== 請(qǐng)求數(shù)據(jù) ==========================");
      print("url = ${options.uri.toString()}");
      print("headers = ${options.headers}");
      print("params = ${options.data}");
      return handler.next(options);
    }, onResponse: (response, handler) {
      print("\n================== 響應(yīng)數(shù)據(jù) ==========================");
      print("code = ${response.statusCode}");
      print("data = ${response.data}");
      print("\n");
      handler.next(response);
    }, onError: (DioError e, handler) {
      print("\n================== 錯(cuò)誤響應(yīng)數(shù)據(jù) ======================");
      print("type = ${e.type}");
      print("message = ${e.message}");
      print("\n");
      return handler.next(e);
    }));
  }
  static DioRequest getInstance() {
    return _instance ??= DioRequest();
  }
}

五、實(shí)現(xiàn)登錄注冊(cè)服務(wù)

lib下新建service目錄,并在service目錄中新建login.dart文件。

import 'dart:convert';

import 'package:cyber_security/utils/http.dart';

class LoginService {
  /// 獲取用戶數(shù)據(jù)中心列表
  static Future<List> getDataCenter() async {
    var response = await DioRequest.getInstance().dio.get('/getDataCenter');
    var data = jsonDecode(response.toString());
    return data['dataCenterList'];
  }

  /// 登錄接口
  static login(value) async {
    var response = await DioRequest.getInstance()
        .dio
        .post('/sys/login', queryParameters: value);
    var data = jsonDecode(response.toString()); 
    /// 對(duì)返回的身份憑證全局持久化存儲(chǔ)
    return data['key'];
  }

  /// 獲取權(quán)限列表
  static menuNav() async {
    var response = await DioRequest.getInstance().dio.get('/sys/menu/nav');
    var data = jsonDecode(response.toString());
    return data['key'];
  }
}

六、使用service服務(wù)

@override
  void initState() {
    // TODO: implement initState
    super.initState();
    /// 請(qǐng)求用戶數(shù)據(jù)中心數(shù)據(jù)
    LoginService.getDataCenter().then((value) {
      setState(() {
        _dataCenterList = value;
      });
    });
  }

到此這篇關(guān)于Flutter網(wǎng)絡(luò)請(qǐng)求Dio庫(kù)的使用及封裝詳解的文章就介紹到這了,更多相關(guān)Flutter Dio庫(kù)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評(píng)論