修复flutter webview上的net :: err_unknown_url_scheme whatsapp链接

请我想知道如何在 Flutter webview 应用程序中启动 WhatsApp 或在 Flutter 中从浏览器启动 WhatsApp,已经使用了许多没有错误的代码,但它们不起作用。我正在使用 mac m1 和 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(),
  )
),
);
}
}

主页.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() {}
   }

请帮我完成它。

stack overflow fix net::err_unknown_url_scheme whatsapp link on flutter webview
原文答案
author avatar

接受的答案

首先,添加 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';
    }
  }

答案:

作者头像

您可以使用 url_launcher 来启动 URL。

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

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

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

作者头像
String text = "Hello World !! Hey There";
String url = "https://wa.me/?text=${Uri.encodeFull(text)}";
if (await canLaunchUrl(Uri.parse(url))) {
await launchUrl(Uri.parse(url),
mode: LaunchMode.externalApplication);
}