【转】 React-Native调用浏览器和第三方APP
2017-09-11 11:37
302 查看
这个其实在RN的文档中已经写好了,不过最新的依然不需要做文档中的额外步骤。
直接在自定义的组件里面引用Linking,然后使用Linking的openURL函数即可,这个会自动选择系统的浏览器打开链接。
[javascript] view plain copy print?var url = ‘http://www.baidu.com’;
Linking.openURL(url)
.catch((err)=>{
console.log(’An error occurred’, err);
});
还可以使用canOpenURL做一次判断,是否是有效的地址,然后根据判断进行上面的操作:
[javascript] view plain copy print?Linking.canOpenURL(url)
.then((supported)=>{
if (!supported){
console.log(’Can\’t handle url: ’ + url);
Alert.alert(
’提示’,
’Can\’t handle url: ’ + url,
[
{text: ’OK’, onPress:()=>{}}
]
);
}else{
return Linking.openURL(url);
}
})
.catch((err)=>{
console.log(’An error occurred’, err);
Alert.alert(
’提示’,
’An error occurred: ’ + err,
[
{text: ’OK’, onPress:()=>{}}
]
);
});
后面发现文档中说了这么一句话:
你还可以使用其他类型的URL,比如一个地理位置(形如”geo:37.484847,-122.148386”或是一个通讯录名片,只要是可以通过{@code
Intent.ACTION_VIEW}打开的即可。
也就是说这个Linking可以打开更多的东西,然后参考了IOS的openURL,试了下打开App Store,通讯录等等,结果是令人满意的,都可以打开。
因此,在你做的APP中,如果需要用户跳转到App Store中对你的应用进行评价的话,也可以这样做:
[javascript] view plain copy print?var url = ‘itms-apps://’;
url = ’itms-apps://ax.itunes.apple.com/WebObjects/MZStore.woa/wa/viewContentsUserReviews?mt=8&onlyLatestVersion=true&pageNumber=0&sortOrdering=1&type=Purple+Software&id=APP_ID’;
//后面有个APP_ID,填写个人的APP_ID就可以跳转到评论地址了
Linking.canOpenURL(url)
上面这个是在网上看到的,itms-apps:// 打头的就是指的APP Store,还有其他的可以参考这个地址。这里详细列出了各种常用系统应用的url头。
注意:如果按照这个方式无法打开,按照官方文档上说的要在项目的Info.list中设置LSApplicationQueriesSchemes字段
具体这个如何添加,网上也有资料,可以自行搜索下。
原文链接:
http://blog.csdn.net/pz789as/article/details/53021283
直接在自定义的组件里面引用Linking,然后使用Linking的openURL函数即可,这个会自动选择系统的浏览器打开链接。
[javascript] view plain copy print?var url = ‘http://www.baidu.com’;
Linking.openURL(url)
.catch((err)=>{
console.log(’An error occurred’, err);
});
var url = 'http://www.baidu.com'; Linking.openURL(url) .catch((err)=>{ console.log('An error occurred', err); });
还可以使用canOpenURL做一次判断,是否是有效的地址,然后根据判断进行上面的操作:
[javascript] view plain copy print?Linking.canOpenURL(url)
.then((supported)=>{
if (!supported){
console.log(’Can\’t handle url: ’ + url);
Alert.alert(
’提示’,
’Can\’t handle url: ’ + url,
[
{text: ’OK’, onPress:()=>{}}
]
);
}else{
return Linking.openURL(url);
}
})
.catch((err)=>{
console.log(’An error occurred’, err);
Alert.alert(
’提示’,
’An error occurred: ’ + err,
[
{text: ’OK’, onPress:()=>{}}
]
);
});
Linking.canOpenURL(url) .then((supported)=>{ if (!supported){ console.log('Can\'t handle url: ' + url); Alert.alert( '提示', 'Can\'t handle url: ' + url, [ {text: 'OK', onPress:()=>{}} ] ); }else{ return Linking.openURL(url); } }) .catch((err)=>{ console.log('An error occurred', err); Alert.alert( '提示', 'An error occurred: ' + err, [ {text: 'OK', onPress:()=>{}} ] ); });
后面发现文档中说了这么一句话:
你还可以使用其他类型的URL,比如一个地理位置(形如”geo:37.484847,-122.148386”或是一个通讯录名片,只要是可以通过{@code
Intent.ACTION_VIEW}打开的即可。
也就是说这个Linking可以打开更多的东西,然后参考了IOS的openURL,试了下打开App Store,通讯录等等,结果是令人满意的,都可以打开。
因此,在你做的APP中,如果需要用户跳转到App Store中对你的应用进行评价的话,也可以这样做:
[javascript] view plain copy print?var url = ‘itms-apps://’;
url = ’itms-apps://ax.itunes.apple.com/WebObjects/MZStore.woa/wa/viewContentsUserReviews?mt=8&onlyLatestVersion=true&pageNumber=0&sortOrdering=1&type=Purple+Software&id=APP_ID’;
//后面有个APP_ID,填写个人的APP_ID就可以跳转到评论地址了
Linking.canOpenURL(url)
var url = 'itms-apps://'; url = 'itms-apps://ax.itunes.apple.com/WebObjects/MZStore.woa/wa/viewContentsUserReviews?mt=8&onlyLatestVersion=true&pageNumber=0&sortOrdering=1&type=Purple+Software&id=APP_ID'; //后面有个APP_ID,填写个人的APP_ID就可以跳转到评论地址了 Linking.canOpenURL(url)
上面这个是在网上看到的,itms-apps:// 打头的就是指的APP Store,还有其他的可以参考这个地址。这里详细列出了各种常用系统应用的url头。
注意:如果按照这个方式无法打开,按照官方文档上说的要在项目的Info.list中设置LSApplicationQueriesSchemes字段
具体这个如何添加,网上也有资料,可以自行搜索下。
原文链接:
http://blog.csdn.net/pz789as/article/details/53021283
相关文章推荐
- React-Native在APP调用浏览器或其他系统应用(Linking的使用)
- React Native跳转第三方APP
- react-native 调用第三方 SDK
- React Native调用系统的应用:电话、短信、邮件、浏览器等
- React Native调用系统的应用:电话、短信、邮件、浏览器等
- RN-第三方-react-native-camera,调用相机拍摄图片
- 在APP里调用第三方文件管理器进行管理文件
- React-Native开发App,修改图标和名字
- React Native 教程 demo1 认识js与app原生控件
- ios调用第三方程序打开文件,以及第三方调用自己的APP打开文件
- React Native之调用安卓原生控件
- React Native创建一个APP
- React-Native调试状态下App运行缓慢问题解决方案
- Android app中调用启动其他应用(系统应用和第三方应用)2016.10.25新增android 6.0打电话api
- React Native指南汇集了各类react-native学习资源、开源App和组件
- app调用浏览器打开网页的方法
- Android App 调用自带浏览器
- F8App-ReactNative项目源码分析4-js篇
- React-Native 之 GD (二十一)APP 打包
- 将第三方组件react-native-swiper应用在欢迎界面中