Tools used
D3 js: v4.11.0react-native: v0.60.3react-native-webview: v9.3.0
Previously I was using react-native 0.59.8 and I was using WebView from react-native, in this version WebView was working fine, SVG was also loading perfectly, but after upgrading react native to 0.60.3, I also have to take WebView from react-native-webview,
React Native WebView :-
<WebViewscrollEnabled = {true}originWhitelist={["*"]}javaScriptEnabled={true}source={{ uri: isAndroid ? "file:///android_asset/widget/index.html" : "./widget/index.html" }}// useWebKit={false}allowUniversalAccessFromFileURLs={true}allowFileAccess={true}scalesPageToFit={true}onMessage={this.getSelectedSeat}ref={component => (this.webview = component)}style={{ width: deviceWidth, height: deviceHeight }}/>
Calling:
this.webview.postMessage("data");
Capturing in HTML:
this.window.addEventListener("message", data => {}
Loading SVG in HTML :-
function loadSVG(svgURL) { d3.xml( svgURL, function (xml) { if (xml != null) { var importedFile = document.importNode(xml.documentElement, true); d3.select("#layout") .node() .append(importedFile); } }, err => { alert('error') } ); }
In android same code is working fine, but not in iOS, every time xml is null, but it was fine in the older version of WebView where I was taking WebView from react-native, I don't know what I'm missing, may be some property. Please Help.
Update:I'm getting error message: {"isTrusted":true}, I think this is Cross-Origin related issue, is there any way to disable this in iOS WKWebView?