How to use Proxyman with Flutter

Proxyman is a great tool for developers and QA to inspect and manipulate HTTP requests/responses.

Too bad Flutter doesn't use the system-level proxy, which is the underlying mechanic for most network inspectors like Proxyman to work. So, if you use Proxyman, you might not see any traffic from your Flutter Project.

The good news is there is a workaround for this issue by manually configuring Flutter’s HTTP client to use Proxyman as its proxy. Proxyman mentioned this problem and solution on their website here.

Problem

There is one problem with the solution mentioned on the website. We need to know the IP up front at compile time.

Dart HTTPClient Class

// Make sure to replace <YOUR_LOCAL_IP> with 
// the external IP of your computer if you're using Android. 
// You can get the IP in the Android Setup Guide window
String proxy = Platform.isAndroid ? '<YOUR_LOCAL_IP>:9090' : 'localhost:9090';

// Create a new HttpClient instance.
HttpClient httpClient = new HttpClient();

// Hook into the findProxy callback to set
// the client's proxy.
httpClient.findProxy = (uri) {
  return "PROXY $proxy;";
};

// This is a workaround to allow Proxyman to receive
// SSL payloads when your app is running on Android
httpClient.badCertificateCallback = 
  ((X509Certificate cert, String host, int port) => Platform.isAndroid);

HTTP Package

// Make sure to replace <YOUR_LOCAL_IP> with 
// the external IP of your computer if you're using Android. 
// You can get the IP in the Android Setup Guide window
String proxy = Platform.isAndroid ? '<YOUR_LOCAL_IP>:9090' : 'localhost:9090';

// Create a new HttpClient instance.
HttpClient httpClient = new HttpClient();

// Hook into the findProxy callback to set
// the client's proxy.
httpClient.findProxy = (uri) {
  return "PROXY $proxy;";
};

// This is a workaround to allow Proxyman to receive
// SSL payloads when your app is running on Android.
httpClient.badCertificateCallback = 
  ((X509Certificate cert, String host, int port) => Platform.isAndroid);

// Pass your newly instantiated HttpClient to http.IOClient.
IOClient myClient = IOClient(httpClient);

// Make your request as normal.
var response = myClient.get('/my-url');

Dio

// Make sure to replace <YOUR_LOCAL_IP> with 
// the external IP of your computer if you're using Android. 
// You can get the IP in the Android Setup Guide window
String proxy = Platform.isAndroid ? '<YOUR_LOCAL_IP>:9090' : 'localhost:9090';

// Create a new Dio instance.
Dio dio = Dio();

// Tap into the onHttpClientCreate callback
// to configure the proxy just as we did earlier.
(dio.httpClientAdapter as DefaultHttpClientAdapter).onHttpClientCreate = (client) { 
  // Hook into the findProxy callback to set the client's proxy.
  client.findProxy = (url) {
    return 'PROXY $proxy'?;
  };
  
  // This is a workaround to allow Proxyman to receive
  // SSL payloads when your app is running on Android.
  client.badCertificateCallback = (X509Certificate cert, String host, int port) => Platform.isAndroid;
}

This might not be a problem for developers, but if you want to release an app for QA or testers, we can't possibly know the IP of their network.

You can easily support sarunw.com by checking out this sponsor.

Note Taking:Quickly take note using Voice, Camera, or Typing

Try it for Free

Solution

There might be many ways to solve this, but in my case, I get help from https://github.com/kaivean/system_proxy.

system_proxy is a Flutter Plugin to get a system proxy setting. We will use this to grab a system proxy instead of hard-coded it.

I will show you how I use system_proxy with Dio.

Let's say we have a simple ApiClient class that holds an instance of Dio.

class ApiClient {
  late Dio dioClient;

  ApiClient({required String baseUrl}) {
    var options = BaseOptions(
      baseUrl: baseUrl,
    );

    dioClient = Dio(options);
  }
}

ApiClient(baseUrl: 'https://www.example.com/api');

We can get a system proxy and configure it to dioClient like this.

class ApiClient {
  late Dio dioClient;

  // 1
  ApiClient({required String baseUrl, Map<String, String>? proxy}) {
    var options = BaseOptions(
      baseUrl: baseUrl,
    );

    dioClient = Dio(options);

    if (proxy != null) {
      // 2
      final proxyString = '${proxy['host']}:${proxy['port']}';

      (dioClient.httpClientAdapter as DefaultHttpClientAdapter)
          .onHttpClientCreate = (client) {
        client.findProxy = (url) {
          return 'PROXY $proxyString';
        };

        client.badCertificateCallback =
            (X509Certificate cert, String host, int port) => Platform.isAndroid;
        return null;
      };
    }
  }
}

/// get system proxy
/// Has proxy, return: {port: 8899, host: 172.24.141.93}
/// no proxy, return: null
final proxy = await SystemProxy.getProxySettings();
// 3
final apiClient = ApiClient(baseUrl: 'https://www.example.com/api', proxy: proxy);

1 Accept proxy information in the constructor.
2 If proxy is not null, use that information to populate proxy. We use this in a place where we used to hard-coded our IP.
3 We inject the proxy that we get from system_proxy. SystemProxy.getProxySettings() is an async function, so we need to await for the result.