CODEWITHSUNDEEP
javascriptflutterdartmessage
Vekony Endre
Vekony Endre

Reputation: 45

Flutter listen to js messages

I have a Flutter app with a simple webvew plugin. In my login.js file I have a simple function that gives back username and password.

function saveUserPass(credentials){
        if (typeof Android !== 'undefined') {
            if (Android.saveValues !== 'undefined') {
                Android.saveValues(credentials.username, credentials.password);
            }
        }
    var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;    
    if (iOS) { 
    window.webkit.messageHandlers.saveValeus.postMessage({"name": credentials.username,"pwd": credentials.password}); 
    } 
    }

}

Is there a way to listen to those messages in Flutter?

Upvotes: 0

Views: 3081

Answers (1)

Christopher Moore
Christopher Moore

Reputation: 17123

You can use the javascriptChannels property of the WebView class.

For flutter - You need to create a new JavascriptChannel and pass it to your WebView constructor:

JavascriptChannel channel = JavascriptChannel(name: 'Print', onMessageReceived: (JavascriptMessage message) { print(message.message); });

WebView(
  javascriptChannels: {channel},
  ...
)

The onMessageReceived property of the channel can be used to handle the message in any way that you need.

For JS - Anytime you want to send a message from JS, call the name(in this case "Print").postMessage(message):

Print.postMessage('Hello');

Upvotes: 1

Related Questions