WebView User-Agent (Android/iOS)

wv_user_agent is a simple Flutter plugin for retrieving the actual user agent of a device using the native WebView.

⚡ Features

• Retrieves the actual user agent string from the device's native WebView.
• Compatible with Android and iOS.
• Lightweight and easy to use.
• Works with the latest versions of Flutter, Dart, Android Studio, and Xcode.
• Inspired by fk_user_agent, but simpler and more up-to-date.

⚙️ Installation

This plugin is set the Null Safety.

1. From pub.dev

Run this command:

$ flutter pub add wv_user_agent

This will add a line like this to your package's pubspec.yaml (and run an implicit flutter pub get):

dependencies:
  wv_user_agent: latest_version

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

---

2. From github.com

Add this to your pubspec.yaml:

dependencies:
  wv_user_agent:
    git:
      url: https://github.com/jakkimcfly/wv_user_agent.git

Then run:

$ flutter pub get

📥 Import it

Now in your Dart code, you can use:

import 'package:wv_user_agent/wv_user_agent.dart';

💥 Comparison: Default User Agent vs. wv_user_agent

Source	Example User Agent
Default Flutter User-Agent	Dart/3.2 (dart:io)
User-Agent from wv_user_agent	Mozilla/5.0 (Linux; Android 13; Pixel 7 Pro) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/110.0.5481.153 Mobile Safari/537.36

🛠️ How it Works

• On Android, the plugin retrieves the user agent from WebView.settings.userAgentString.
• On iOS, the plugin evaluates JavaScript (navigator.userAgent) in a WKWebView.

💡 Why use this plugin?

Normally, when loading web pages inside a Flutter app using webview_flutter, the default user agent may not match the actual browser user agent. This can lead to issues such as:

• Websites detecting the app as a bot or crawler.
• Incorrect rendering of certain web pages.
• Blocking of specific features due to an unknown user agent.

With wv_user_agent, you get the actual user agent that a device's browser would use, ensuring correct web page behavior.

🚀 Example Usage

Below is an example showing how to use wv_user_agent to obtain the actual user agent and pass it to webview_flutter, ensuring that web pages load with the correct user agent.

import 'package:wv_user_agent/wv_user_agent.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

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

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String _userAgent = 'Loading...';
  late WebViewController _controller;

  @override
  void initState() {
    super.initState();
    _loadUserAgent();
  }

  // Fetches the actual User-Agent from the native WebView
  Future<void> _loadUserAgent() async {
    final ua = await WvUserAgent.userAgent;
    setState(() {
      _userAgent = ua;
    });

    // Initialize WebView with the fetched User-Agent
    _controller = WebViewController()
      ..setJavaScriptMode(JavaScriptMode.unrestricted)
      ..setUserAgent(_userAgent)
      ..loadRequest(Uri.parse('https://www.whatismybrowser.com/'));
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: const Text('User Agent Test')),
        body: Column(
          children: [
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: Text('User Agent: $_userAgent', textAlign: TextAlign.center),
            ),
            Expanded(
              child: WebViewWidget(controller: _controller),
            ),
          ],
        ),
      ),
    );
  }
}

💬 Questions?

Feel free to open an issue.

✨ Support

If you like this project, give it a ⭐ and share it with friends!