Flutter_学习记录_iOS 模拟器用Charles抓包

参考文章:
Flutter 使用Charles软件抓包

1. 前言

Flutter应用网络请求调试一直是业内难题,原因在于Dart语言标准库的网络请求不会走Wi-Fi代理,常规通过配置Wi-Fi代理来抓包的方式行不通。这给我们日常开发测试造成了很大的阻碍,严重降低工作效率。

2. 抓包解决方案

2.1 安装抓包工具Charles

请参考这个文章:charlse抓包和Mock数据

2.2 模拟器设置代理

首先,设置Charles允许抓包电脑数据,如下图设置:

其次,安装模拟器证书,如下图:

第三,打开模拟器的safari, 输入http://chls.pro/ssl, 安装证书,然后在模拟器的设置->通用->关于本机->证书信任设置,打开Charles的证书信任:

2.3 代码设置代理

通过如下步骤,查看本地网络的代理端口:

记住这个数据:

在代码中配置网络转发的端口, 我是在第一次网络请求的页面中配置的,代码如下:

dart 复制代码
import 'package:flutter/material.dart';
// 网络请求
import 'package:dio/dio.dart';
import 'package:dio/io.dart';

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {

  final dio = Dio();
  
  @override
  void initState() {
    super.initState();

    // TODO: --设置代理的地方,等待删除
     (dio.httpClientAdapter as DefaultHttpClientAdapter).onHttpClientCreate = (client) { 
          client.findProxy = (uri) {
            return 'PROXY 192.168.1.4:8888';
          };
     };
    // 获取轮播图的数据
    _getSwipterDataRequest();
    // 获取猜你喜欢的数据
    _getGuessYouLikeDataRequest();
  }
}

2.4代码解读

其中发挥作用的是,这几句代码:

dart 复制代码
final dio = Dio();
    // TODO: --设置代理的地方,等待删除
     (dio.httpClientAdapter as DefaultHttpClientAdapter).onHttpClientCreate = (client) { 
          client.findProxy = (uri) {
            return 'PROXY 192.168.1.4:8888';
          };
     };

其中192.168.1.4:8888 这个值是步骤2.3 让记住的端口, 同时也说明了:再次启动charles时,如果charles的端口变了,代码的设置的'PROXY 192.168.1.4:8888'这个值也要跟着变。

大概得设置就是这样~

相关推荐
KKei16382 小时前
Flutter for OpenHarmony 编程技能树APP技术文章
flutter·华为·harmonyos
KKei16382 小时前
Flutter for OpenHarmony 个人财务管理与记账APP
flutter·华为·harmonyos
KKei16383 小时前
Flutter for OpenHarmony 本地音乐播放器APP
flutter·华为·harmonyos
陆业聪3 小时前
两次Flutter全屏白踩坑复盘:Layout的静默失败,以及AI结对编程的认知盲区
flutter·ai编程·大前端·跨端开发
KKei16383 小时前
Flutter for OpenHarmony 外语单词背诵与听力训练APP
flutter·华为·harmonyos
KKei16384 小时前
Flutter for OpenHarmony学习小组组队与打卡APP技术文章
学习·flutter·华为·harmonyos
tangweiguo030519874 小时前
Flutter 集成排查与 APK 瘦身问题解决
flutter
KKei16384 小时前
Flutter for OpenHarmony学术论文管理APP技术文章
flutter·华为·harmonyos
程序员老刘·18 小时前
Perry能取代Flutter吗?跨平台的三种技术路线
flutter·跨平台开发·客户端开发