My webview contain (embed, code, ...) so because i used onMessage and injectedJavascript, i'm try console event in onMessage in ios and vitual android returns results, only physical android not return result, please let me keyword and why?? Thank you very much!
<WebView
{...otherProps}
javaScriptEnable={true}
domStorageEnabled={true}
mixedContentMode={'compatibility'}
source={{ html: templates[this.props.template]({html, fontSizeContent, fontSizeContentPre, highlightThemes, enableNightMode}) }}
onLoad={this.onLoad.bind(this)}
injectedJavaScript={this.injectedJavaScript()}
onMessage={this.onMessage.bind(this)}
scrollEnabled={false}
style={{
height: Math.max(realContentHeight, minHeight),
backgroundColor: enableNightMode ? COLORS.COLOR_NIGHT_MODE : COLORS.COLOR_UN_NIGHT_MODE
}}
/>
hackBefore() {
return Platform.OS === 'ios' ?
`
(function(){
var originalPostMessage = window.postMessage;
var patchedPostMessage = function(message, targetOrigin, transfer) {
originalPostMessage(message, targetOrigin, transfer);
};
patchedPostMessage.toString = function() {
return String(Object.hasOwnProperty).replace('hasOwnProperty', 'postMessage');
};
window.postMessage = patchedPostMessage; `
:
`
if (window.postMessage.length !== 1) {
window.postMessage = function(msg) {
setTimeout(function () {
window.postMessage(msg);
}, 5000);
}
}
`
}
hackAfter() {
return Platform.OS === 'ios' ? '})();' : ''
}
injectedJavaScript() {
return `
${this.hackBefore()}
NodeList.prototype.forEach = Array.prototype.forEach;
if (!Element.prototype.matches)
Element.prototype.matches = Element.prototype.msMatchesSelector || Element.prototype.webkitMatchesSelector;
if (!Element.prototype.closest)
Element.prototype.closest = function(s) {
var el = this;
if (!document.documentElement.contains(el)) return null;
do {
if (el.matches(s)) return el;
el = el.parentElement || el.parentNode;
} while (el !== null && el.nodeType === 1);
return null;
};
function dispatchAction(action, params) {
window.postMessage(JSON.stringify({
action,
params,
}));
};
${this.hackAfter()}
`
};
onMessage(event) {
console.log('event', event)
const { action, params } = JSON.parse(event.nativeEvent.data);
console.log('action', action)
console.log('params', params)
switch (action) {
case 'heightCaculated': {
return this.setState({
realContentHeight: params.height,
isRendering: false,
});
};
case 'addImages': {
this.props.resetImages();
params.imgs.map(img => Image.prefetch(img));
return this.props.addImages(params.imgs);
};
case 'openGallery': {
return navigator.navigate('Gallery', {
index: params.index,
})
};
default:
return null;
};
};