status-im/react-native-webview
1
0
Fork 0
mirror of https://github.com/status-im/react-native-webview.git synced 2026-08-31 11:41:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(Android/iOS postMessage): refactoring the old postMessage implementation (#303)

Browse Source 
fixes #29
fixes #272
fixes #221
fixes #105
fixes #66

BREAKING CHANGE: Communication from webview to react-native has been completely rewritten. React-native-webview will not use or override window.postMessage anymore. Reasons behind these changes can be found throughout so many issues that it made sense to go that way.

Instead of using window.postMessage(data, *), please now use window.ReactNativeWebView.postMessage(data).

Side note: if you wish to keep compatibility with the old version when you upgrade, you can use the injectedJavascript prop to do that:

const injectedJavascript = `(function() {
  window.postMessage = function(data) {
    window.ReactNativeWebView.postMessage(data);
  };
})()`;

Huge thanks to @jordansexton and @KoenLav!
This commit is contained in:
Thibault Malbranche
2019-02-01 18:37:28 +01:00
committed by GitHub
parent 79afbd697d
commit f3bdab5a22
8 changed files with 63 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files
android/src/main/java/com/reactnativecommunity/webview/RNCWebViewManager.java
+10 -29
View File
@@ -109,7 +109,7 @@ public class RNCWebViewManager extends SimpleViewManager<WebView> {
protected static final String HTML_ENCODING = "UTF-8";
protected static final String HTML_MIME_TYPE = "text/html";
protected static final String BRIDGE_NAME = "__REACT_WEB_VIEW_BRIDGE";
protected static final String JAVASCRIPT_INTERFACE = "ReactNativeWebview";
protected static final String HTTP_METHOD_POST = "POST";
@@ -138,8 +138,9 @@ public class RNCWebViewManager extends SimpleViewManager<WebView> {
if (!mLastLoadFailed) {
RNCWebView reactWebView = (RNCWebView) webView;
reactWebView.callInjectedJavaScript();
reactWebView.linkBridge();
emitFinishEvent(webView, url);
}
}
@@ -239,6 +240,10 @@ public class RNCWebViewManager extends SimpleViewManager<WebView> {
mContext = c;
}
/**
* This method is called whenever JavaScript running within the web view calls:
* - window[JAVASCRIPT_INTERFACE].postMessage
*/
@JavascriptInterface
public void postMessage(String message) {
mContext.onMessage(message);
@@ -312,11 +317,11 @@ public class RNCWebViewManager extends SimpleViewManager<WebView> {
}
messagingEnabled = enabled;
if (enabled) {
addJavascriptInterface(createRNCWebViewBridge(this), BRIDGE_NAME);
linkBridge();
addJavascriptInterface(createRNCWebViewBridge(this), JAVASCRIPT_INTERFACE);
} else {
removeJavascriptInterface(BRIDGE_NAME);
removeJavascriptInterface(JAVASCRIPT_INTERFACE);
}
}
@@ -342,30 +347,6 @@ public class RNCWebViewManager extends SimpleViewManager<WebView> {
}
}
public void linkBridge() {
if (messagingEnabled) {
if (ReactBuildConfig.DEBUG && Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
// See isNative in lodash
String testPostMessageNative = "String(window.postMessage) === String(Object.hasOwnProperty).replace('hasOwnProperty', 'postMessage')";
evaluateJavascript(testPostMessageNative, new ValueCallback<String>() {
@Override
public void onReceiveValue(String value) {
if (value.equals("true")) {
FLog.w(ReactConstants.TAG, "Setting onMessage on a WebView overrides existing values of window.postMessage, but a previous value was defined");
}
}
});
}
evaluateJavascriptWithFallback("(" +
"window.originalPostMessage = window.postMessage," +
"window.postMessage = function(data) {" +
BRIDGE_NAME + ".postMessage(String(data));" +
"}" +
")");
}
}
public void onMessage(String message) {
dispatchEvent(this, new TopMessageEvent(this.getId(), message));
}