I'm developing an app with react-native-webview.
And when I click a link with
<a href="sms:888888&body=Test Message">Click here</a>
I'm receiving error err_unknown_url_scheme.
Thanks
Able to solve the problem by editting the webview parameters.
<WebView
{...this.props}
bounces={false}
originWhitelist={["https://*", "http://*", "file://*", "sms://*"]}
allowFileAccess={true}
domStorageEnabled={true}
javaScriptEnabled={true}
geolocationEnabled={true}
saveFormDataDisabled={true}
allowFileAccessFromFileURLS={true}
allowUniversalAccessFromFileURLs={true}
/>
I was getting error regarding "mailto: and tel: links do not work in webview" and for my situation the fix was to adding this property in webview:
<WebView
// other props here
originWhitelist={['http://*', 'https://*', 'intent://*']}
/>
I had a similar problem with mailto
links within WebViews. I found that this is an open issue on react-native-webview. Modifying the originWhitelist
from {[*]}
to the explicit list as suggested in the answer didn't help me. But I could solve the problem by applying this fix . It provides a custom implementation for the onShouldStartLoadWithRequest
property. And I used
function onShouldStartLoadWithRequest(request){
if (!request || !request.url) {
return true;
}
// list of schemas we will allow the webview
// to open natively
if(request.url.startsWith("tel:") ||
request.url.startsWith("mailto:") ||
request.url.startsWith("maps:") ||
request.url.startsWith("geo:") ||
request.url.startsWith("sms:")
){
Linking.openURL(request.url).catch(er => {
console.log('Failed to open Link:', er.message);
});
return false;
}
// let everything else to the webview
return true;
}
For unknown reasons, even with overriding onShouldStartLoadWithRequest
method, webview crashed for me.
Version 11.0.0
of react-native-webview
, features a new option setSupportMultipleWindows
, which when set to true opens links that open in new tabs/windows (such as <a target="_blank">
) will now prompt to open in the system browser, rather than re-using the current WebView.
<WebView
// links that open in new tabs/windows will now prompt to open in the system browser
setSupportMultipleWindows={true}
// other props here
/>
Link that triggers tel
<a target="_blank" rel="nofollow noreferrer noopener" href="tel:+91xxxxxxxxx">Call now</a>
See https://github.com/react-native-webview/react-native-webview/issues/1084#issuecomment-735048835
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.