I’ve a flutter app and this app also contain a pwa. I use in webview_flutter.
In pwa I have a button “share”. What I need is:
When I tap on on this share button inside the pwa I need the flutter app open the share widget.
I start to try using method as addJavaScriptChannel, runJavaScript as in the code I add below.
The problem is that I can’t get the click action of that button.
This button is make in this way by watching it in inspect.
I try several times, this is one of the latest times. I need to understand how to get the result. Also in different ways.
I can also contact the dev who create that button to change small things.
< code > import 'dart:async' ;
import 'package:flutter/material.dart' ;
import 'package:get/get.dart' ;
import 'package:share_plus/share_plus.dart' ;
import 'package:shared_preferences/shared_preferences.dart' ;
import 'package:webview_flutter/webview_flutter.dart' ;
Widget inAppWebViewCustom ({
required SharedPreferences prefs,
bool hideHeaderFooter = false ,
final RxBool isLoading = true . obs ;
final WebViewController controller = WebViewController () ;
controller. setJavaScriptMode ( JavaScriptMode. unrestricted ) ;
controller. setBackgroundColor ( const Color ( 0x00000000 )) ;
void saveGetTokenFunction ({
required bool hideHeaderFooter,
required Rx < bool > isLoading,
required WebViewController controller,
required SharedPreferences prefs,
await controller. runJavaScript ( '' '
document.querySelector(' header ').style.display = ' none ';
document.querySelector(' footer ').style.display = ' none ';
final Object? accessToken = await controller. runJavaScriptReturningResult (
'localStorage.getItem("accessToken");' ,
if ( accessToken != null &&
!accessToken. toString () . contains ( 'null' ) &&
appToken. value != accessToken. toString ()) {
await prefs. setString ( kAccessToken, accessToken. toString ()) ;
appToken. value = accessToken. toString () . replaceAll ( '"' , '' ) ;
if ( appToken. value != '' ) {
await controller. runJavaScript (
'window.localStorage.setItem("accessToken", "${appToken.value})";' ,
controller. addJavaScriptChannel (
onMessageReceived: ( JavaScriptMessage message ) {
if ( message. message == 'share' ) {
Share. share ( 'Text to share' , subject: 'subject' ) ;
controller. setNavigationDelegate (
onProgress: ( int progress ) async {
if ( progress == 100 ) isLoading. value = false ;
onPageStarted: ( String url ) async {
if ( appToken. value != null &&
!appToken. value . toString () . contains ( 'null' )) {
await controller. runJavaScript (
'window.localStorage.setItem("accessToken", "${appToken.value})";' ,
onPageFinished: ( String url ) async {
const Duration ( seconds: 1 ) ,
( Timer t ) = > saveGetTokenFunction (
hideHeaderFooter: hideHeaderFooter,
onWebResourceError: ( WebResourceError error ) {} ,
onNavigationRequest: ( NavigationRequest request ) {
return NavigationDecision. navigate ;
onUrlChange: ( UrlChange UrlChange ) async {
await controller. runJavaScript ( '' '
const button = document.getElementsByClassName(' MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textInherit MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorInherit MuiButton-disableElevation MuiButton-root MuiButton-text MuiButton-textInherit MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorInherit MuiButton-disableElevation css-1a0ejbe ');
mychannel.postMessage(' share ');
controller. loadRequest ( Uri. parse ( url )) ;
child: CircularProgressIndicator (
color: AppColors. primary ,
WebViewWidget ( controller: controller ) ,
<code>import 'dart:async';
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:share_plus/share_plus.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:webview_flutter/webview_flutter.dart';
Widget inAppWebViewCustom({
required String url,
required SharedPreferences prefs,
bool hideHeaderFooter = false,
}) {
final RxBool isLoading = true.obs;
final WebViewController controller = WebViewController();
controller.setJavaScriptMode(JavaScriptMode.unrestricted);
controller.setBackgroundColor(const Color(0x00000000));
Timer? timer;
void saveGetTokenFunction({
required bool hideHeaderFooter,
required Rx<bool> isLoading,
required WebViewController controller,
required SharedPreferences prefs,
}) async {
isLoading.value = false;
if (hideHeaderFooter) {
await controller.runJavaScript('''
document.querySelector('header').style.display = 'none';
document.querySelector('footer').style.display = 'none';
''');
}
final Object? accessToken = await controller.runJavaScriptReturningResult(
'localStorage.getItem("accessToken");',
);
if (accessToken != null &&
accessToken != '' &&
!accessToken.toString().contains('null') &&
appToken.value != accessToken.toString()) {
await prefs.setString(kAccessToken, accessToken.toString());
timer?.cancel();
appToken.value = accessToken.toString().replaceAll('"', '');
} else {
if (appToken.value != '') {
await controller.runJavaScript(
'window.localStorage.setItem("accessToken", "${appToken.value})";',
);
timer?.cancel();
}
}
}
controller.addJavaScriptChannel(
'mychannel',
onMessageReceived: (JavaScriptMessage message) {
if (message.message == 'share') {
Share.share('Text to share', subject: 'subject');
}
},
);
controller.setNavigationDelegate(
NavigationDelegate(
onProgress: (int progress) async {
if (progress == 100) isLoading.value = false;
},
onPageStarted: (String url) async {
if (appToken.value != null &&
appToken.value != '' &&
!appToken.value.toString().contains('null')) {
await controller.runJavaScript(
'window.localStorage.setItem("accessToken", "${appToken.value})";',
);
}
},
onPageFinished: (String url) async {
timer = Timer.periodic(
const Duration(seconds: 1),
(Timer t) => saveGetTokenFunction(
isLoading: isLoading,
controller: controller,
prefs: prefs,
hideHeaderFooter: hideHeaderFooter,
),
);
},
onWebResourceError: (WebResourceError error) {},
onNavigationRequest: (NavigationRequest request) {
return NavigationDecision.navigate;
},
onUrlChange: (UrlChange UrlChange) async {
await controller.runJavaScript('''
const button = document.getElementsByClassName('MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textInherit MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorInherit MuiButton-disableElevation MuiButton-root MuiButton-text MuiButton-textInherit MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorInherit MuiButton-disableElevation css-1a0ejbe');
mychannel.postMessage('share');
''');
},
),
);
controller.loadRequest(Uri.parse(url));
return Stack(
children: <Widget>[
if (isLoading.value)
const Center(
child: CircularProgressIndicator(
color: AppColors.primary,
),
)
else
Container(),
WebViewWidget(controller: controller),
],
);
}
</code>
import 'dart:async';
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:share_plus/share_plus.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:webview_flutter/webview_flutter.dart';
Widget inAppWebViewCustom({
required String url,
required SharedPreferences prefs,
bool hideHeaderFooter = false,
}) {
final RxBool isLoading = true.obs;
final WebViewController controller = WebViewController();
controller.setJavaScriptMode(JavaScriptMode.unrestricted);
controller.setBackgroundColor(const Color(0x00000000));
Timer? timer;
void saveGetTokenFunction({
required bool hideHeaderFooter,
required Rx<bool> isLoading,
required WebViewController controller,
required SharedPreferences prefs,
}) async {
isLoading.value = false;
if (hideHeaderFooter) {
await controller.runJavaScript('''
document.querySelector('header').style.display = 'none';
document.querySelector('footer').style.display = 'none';
''');
}
final Object? accessToken = await controller.runJavaScriptReturningResult(
'localStorage.getItem("accessToken");',
);
if (accessToken != null &&
accessToken != '' &&
!accessToken.toString().contains('null') &&
appToken.value != accessToken.toString()) {
await prefs.setString(kAccessToken, accessToken.toString());
timer?.cancel();
appToken.value = accessToken.toString().replaceAll('"', '');
} else {
if (appToken.value != '') {
await controller.runJavaScript(
'window.localStorage.setItem("accessToken", "${appToken.value})";',
);
timer?.cancel();
}
}
}
controller.addJavaScriptChannel(
'mychannel',
onMessageReceived: (JavaScriptMessage message) {
if (message.message == 'share') {
Share.share('Text to share', subject: 'subject');
}
},
);
controller.setNavigationDelegate(
NavigationDelegate(
onProgress: (int progress) async {
if (progress == 100) isLoading.value = false;
},
onPageStarted: (String url) async {
if (appToken.value != null &&
appToken.value != '' &&
!appToken.value.toString().contains('null')) {
await controller.runJavaScript(
'window.localStorage.setItem("accessToken", "${appToken.value})";',
);
}
},
onPageFinished: (String url) async {
timer = Timer.periodic(
const Duration(seconds: 1),
(Timer t) => saveGetTokenFunction(
isLoading: isLoading,
controller: controller,
prefs: prefs,
hideHeaderFooter: hideHeaderFooter,
),
);
},
onWebResourceError: (WebResourceError error) {},
onNavigationRequest: (NavigationRequest request) {
return NavigationDecision.navigate;
},
onUrlChange: (UrlChange UrlChange) async {
await controller.runJavaScript('''
const button = document.getElementsByClassName('MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textInherit MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorInherit MuiButton-disableElevation MuiButton-root MuiButton-text MuiButton-textInherit MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorInherit MuiButton-disableElevation css-1a0ejbe');
mychannel.postMessage('share');
''');
},
),
);
controller.loadRequest(Uri.parse(url));
return Stack(
children: <Widget>[
if (isLoading.value)
const Center(
child: CircularProgressIndicator(
color: AppColors.primary,
),
)
else
Container(),
WebViewWidget(controller: controller),
],
);
}