在 flutter webview 上修复 net::err_unknown_url_scheme whatsapp link

Question

请问我想知道如何在 Flutter webview 应用程序中启动 WhatsApp 或在 Flutter 中从浏览器启动 WhatsApp，使用了许多没有错误的代码，但它们没有 work.Am 使用 macm1 和 vscode

import 'package:coinpaga/Connectivity_Provider.dart';
import 'package:coinpaga/services/local_notification_service.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_messaging/firebase_messaging.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'homepage.dart';
import 'package:hexcolor/hexcolor.dart';
import 'package:colorful_safe_area/colorful_safe_area.dart';

///  Receive message when app is in background solution for on 
message
Future<void> backgroundHandler(RemoteMessage message)async{
  print(message.data.toString());
  print(message.notification!.title);
}
void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  LocalNotificationServices.initialize();
  await Firebase.initializeApp();
  FirebaseMessaging.onBackgroundMessage(backgroundHandler);
  runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
  Widget build(BuildContext context) {
return MultiProvider(
  providers: [
    ChangeNotifierProvider(
      create: (context) => ConnectivityProvider(),
      child: HomePage(),
    )
  ],
  child:MaterialApp(
  title: 'coinpaga',
  theme: ThemeData(
    primarySwatch: Colors.blue,
  ),
  debugShowCheckedModeBanner: false,
  home: ColorfulSafeArea(
    color: HexColor("#2e2a42"),
    top: true,
    bottom: false,
    left: false,
    right: false,
    child: HomePage(),
  )
),
);
}
}

Home.dart

   import 'package:coinpaga/Connectivity_Provider.dart';
   import 'package:coinpaga/no_internet.dart';
   import 'package:flutter/material.dart';
   import 'package:flutter_webview_plugin/flutter_webview_plugin.dart';
   import 'package:provider/provider.dart';

  class HomePage extends StatefulWidget {
  // ignore: unused_field
  final _flutterwebview = FlutterWebviewPlugin();
  HomePage({ Key? key }) : super(key: key);

  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
 @override
  void initState() {
    super.initState();
    Provider.of<ConnectivityProvider>(context, listen: 
false).startMonitoring();
  }
  @override
  Widget build(BuildContext context) {
    return pageUI();
  }
 @override
  void dispose() {
   _flutterwebview.dispose();
 super.dispose();
 }
}
  Widget pageUI() {
 return Consumer<ConnectivityProvider>(
builder: (context, model, child) {
  return model.isOnline 
? WebviewScaffold(
url: 'https://coinpaga.com',

withLocalStorage: true,
withJavascript: true,
scrollBar: false,
initialChild: Center(child: Text('Loading...')),
  ) : NoInternet();
 },
   );
}

  // ignore: camel_case_types
 class _flutterwebview {
  static void dispose() {}
   }

请帮我完成一下。

Answer 1

您可以使用 url_launcher 启动 URLs。

您可以给 https://api.whatsapp.com/send/?phone=(phone_number) URL 来启动。

要启动 WhatsApp 网站，请使用 launch('https://api.whatsapp.com/send/?phone=(phone_number)')

请确保您提供的国家/地区代码不带 (+)。

Answer 2

首先，添加 url_launcher，然后我使用此代码在 flutter webview 上启动 whatsapp 并运行。

WebView(
                initialUrl: getUrl(_url),
                javascriptMode: JavascriptMode.unrestricted,
                navigationDelegate: (NavigationRequest request) async {
                  if (request.url
                      .startsWith('https://api.whatsapp.com/send?phone')) {
                    print('blocking navigation to $request}');
                    List<String> urlSplitted = request.url.split("&text=");
              
                    String phone = "0123456789";
                    String message =
                        urlSplitted.last.toString().replaceAll("%20", " ");
                   
                    await _launchURL(
                        "https://wa.me/$phone/?text=${Uri.parse(message)}");
                    return NavigationDecision.prevent;
                  }

                  print('allowing navigation to $request');
                  return NavigationDecision.navigate;
                },
          
              )

_launchURL(String url) async {
    if (await canLaunch(url)) {
      await launch(url);
    } else {
      throw 'Could not launch $url';
    }
  }

在 flutter webview 上修复 net::err_unknown_url_scheme whatsapp link

fix net::err_unknown_url_scheme whatsapp link on flutter webview

android

ios

whatsapp

flutter

flutter-web