关于ionic的schema

最新推荐文章于 2021-01-24 00:09:01 发布

weixin_33770878

最新推荐文章于 2021-01-24 00:09:01 发布

阅读量328

点赞数

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/u/783079/blog/790461

版权

2019独角兽企业重金招聘Python工程师标准>>>

ionic也是支持 schema 的，可以设置schema name，被其他app调用打开，也同样可以通过这个办法打开其他app，一般都是使用cordova的这个插件

https://github.com/EddyVerbruggen/Custom-URL-scheme

插件很好用，文档也写的有够详细，一般的时候在ionic上完全套用即可。

但是有一种情况下将有不同，就是其他app使用shema url带有参数，ionic app要获取参数，然后根据参数进行后续处理的情况。

比如：

<a href="mycoolapp://somepath?foo=bar">Open my app</a>

文档里描述，使用

function handleOpenURL(url) {
  console.log("received url: " + url);
}

看上去也很简单，但是....，这个handleOpenURL 是一个js的全局函数，也就是说无法在ionic的ctrl，service里直接使用。

鉴于此，有很多的办法，比如，先使用 handleOpenURL 函数获取url，然后将url存入 localStorage，然后在ionic代码里，比如$ionicPlatform.ready() 或 onDeviceReady() 里触发，localStorage里取出url进行后续处理，貌似是个好方法，但是我经过多次试验，发现一个问题，js是异步执行的，将url存入 storage 并不一定总先于取出 storage。存入是全局js函数，又没有好办法使用类似promise的方案，保证分别先后执行。

这个时候自然会想到能否利用事件触发，用这个为线索，还真找到了一个接近完美的方案，直接看代码:

写一个module，将全局函数handleOpenUrl封装进去，并触发了一个rootScope的广播

angular.module('MyCustomUrlHandler', [])

.run(['$rootScope', '$window', function($rootScope, $window) {
  $window.handleOpenURL = function(url) {
    $rootScope.$broadcast('customURL', url);
  };
}]);

然后在需要处理url的地方，响应这个广播：

angular.module('MyApp', ['MyCustomUrlHandler'])

.run(['$rootScope', function($rootScope) {
  $rootScope.$on('customURL', function(event, url) {
    alert('The URL is: ' +  url);
  });
}]);

这个想法非常棒，解决了这个问题，同时也给我们一个全局js 与 angularjs 进行通讯的一个好方法。

如果有兴趣，可以回到原帖看看其他讨论，也有其他方案，但是个人觉得这个最简介优雅：

https://forum.ionicframework.com/t/ios-url-schema-handling/3998/16

转载于:https://my.oschina.net/u/783079/blog/790461