Hi i want to ask so i have a problem in WKWebView IOS
So i want to post message to JS like this
window.webkit.messageHandlers.postMessageListener.postMessage(JSON.stringify({data}))
but nothing happened in JS
otherwise in android
"window.postMessage(JSON.stringify({data}))"
just like this and the JS Give response for this
Now i want to ask whats wrong with my script ?
sorry for bad english grammar
Hi i want to ask so i have a problem in WKWebView IOS
So i want to post message to JS like this
window.webkit.messageHandlers.postMessageListener.postMessage(JSON.stringify({data}))
but nothing happened in JS
otherwise in android
"window.postMessage(JSON.stringify({data}))"
just like this and the JS Give response for this
Now i want to ask whats wrong with my script ?
sorry for bad english grammar
Share Improve this question asked May 27, 2020 at 4:30 fireflyfirefly 111 gold badge1 silver badge3 bronze badges 02 Answers
Reset to default 2For a simple explanation, you can check this article:
https://medium./@hoishing/using-javascript-with-wkwebview-64f94153ad0
If you want a more deep explanation, you can check this other article:
https://dev.to/gualtierofr/wkwebview-and-javascript-interaction-1pbl
In both they mention how Triggering Javascript Functions from Swift AND Receiving Javascript Messages
Anyway, if you execute this function in JavaScript:
window.webkit.messageHandlers.postMessageListener.postMessage(JSON.stringify({data}))
You must listening in Swift the name postMessageListener
in this way:
Setup the WKWebView
let preferences = WKPreferences()
preferences.javaScriptEnabled = true
let configuration = WKWebViewConfiguration()
configuration.preferences = preferences
// Here I am guessing that the Frame of the WebView is the entire Screen
let webView = WKWebView(frame: view.frame, configuration: configuration)
configuration.userContentController.add(self, name: "postMessageListener")
Conforming the Protocol WKScriptMessageHandler
func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
if message.name == "postMessageListener" {
// Manage your Data
}
}
Sending Data from WKWebview's
webpage to native code using postMessage
handler,
import UIKit
import WebKit
class ViewController: UIViewController, WKScriptMessageHandler {
lazy var webView: WKWebView = {
let webCfg:WKWebViewConfiguration = WKWebViewConfiguration()
// Setup WKUserContentController instance for injecting user script
var userController:WKUserContentController = WKUserContentController()
// Add a script message handler for receiving "buttonClicked" event notifications posted from the JS document using window.webkit.messageHandlers.postMessageListener.postMessage(JSON.stringify({data})) script message
userController.add(self, name: "nativeListener")
// Configure the WKWebViewConfiguration instance with the WKUserContentController
webCfg.userContentController = userController;
let webView = WKWebView(frame: CGRect(x: 0, y: 0, width: self.view.frame.width, height: self.view.frame.height), configuration: webCfg)
return webView
}()
override func viewDidLoad() {
super.viewDidLoad()
webView.configuration.preferences.javaScriptEnabled = true
self.view.addSubview(webView)
let urlToLoad = URL(string: "your_url_string")
// Do any additional setup after loading the view.
webView.load(URLRequest(url:urlToLoad!))
}
func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
if message.name == "nativeListener" {
print(message.body) // prints the data that is sent from javascript
}
}
}