Question

我刚刚开始使用Ionic 2移动应用。

我正在设置update password进程，用户可以在其中输入电子邮件，点击＆＃34;发送密码更新电子邮件＆＃34;按钮，然后通过电子邮件发送链接。他们可以点击该链接，将他们带到可以更新密码的页面。

如何在电子邮件中向他们发送链接，点击该链接会打开应用并将其带到特定页面？

更复杂的是我也有一个网络应用程序。因此，如果我向他们发送电子邮件，我应该显示update password on website和update password on mobile app个链接吗？或者我应该只是添加一个链接到网站？

Answer 1

要从链接打开移动应用程序，您需要集成名为cordova-plugin-customurlscheme的cordova插件。使用此插件，您可以注册您的应用程序独有的自定义URL“协议”（例如myAwesomeApp：// register？token = 123）。使用自定义URL安装插件后，单击以myAwesomeApp开头的任何链接：//将打开您的应用程序，并触发挂钩在名为handleOpenUrl的窗口对象上的函数，该函数接受url作为param。在那里，您可以根据网址参数进行路由。

let self = this;
(<any>window).handleOpenURL = function handleOpenURL(url) {
  setTimeout(() => {
    if (url && url.indexOf('\register') !== -1) {
      let token = URLHelper.getParameterByName(url, 'token');
      self.setAsRoot(ConfirmEmailPage, { activationToken: token });
    }
  }, 0);
};

至于处理您的网络应用程序，您可以做的是以下（这是我目前正在做的）：

在线主持一个页面（例如www.myAwesomeWebsite.com/register?token=123），该页面检查用户是否来自移动设备（更具体地说是iOS或Android）。如果是这样，页面加载会将它们重定向到myAwesomeApp：// register？token = 123链接，并有一个按钮，说明从应用程序商店安装应用程序，并带有指向您的移动应用程序的链接。如果用户有应用程序，应用程序将通过重定向打开，如果他们没有，他们将收到警告说无法找到链接或某事情，点击确定后他们将看到从应用程序商店按钮安装应用程序。如果用户不是来自移动设备，只需将其重定向到您的网络应用myAwesomeWebApp.com/register?token=123。

另一个选择是使用第三方服务进行深层链接，例如branch

希望有所帮助。

编辑：由于我发布了这个答案，Ionic团队已经推出了自己的深度链接插件，这样可以简化应用程序内部的一些连接。他们的详细博文可以找到here。实质上你安装他们的插件：

cordova plugin add ionic-plugin-deeplinks --variable URL_SCHEME=ionichats --variable DEEPLINK_SCHEME=https --variable DEEPLINK_HOST=ionic-hats.com

然后像这样挂钩：

import {Component, ViewChild} from '@angular/core';
import {Platform, Nav, ionicBootstrap} from 'ionic-angular';
import {Deeplinks} from 'ionic-native';

import {AboutPage} from './pages/about/about';
import {HatDetailPage} from './pages/hat/hat';

@Component({
  template: '<ion-nav [root]="rootPage"></ion-nav>',
})
class MyApp {
  @ViewChild(Nav) nav:Nav;

  constructor(private _platform: Platform) {}

  ngAfterViewInit() {
    this._platform.ready().then(() => {
      Deeplinks.routeWithNavController(this.nav, {
        '/about-us': AboutPage,
        '/hats/:hatId': HatDetailPage
      });
    });
  }
});

ionicBootstrap(MyApp);

请注意，虽然这可以改善插件的接口，但它并没有改变您必须使用其他机制来处理与您的Web应用程序结合的深层链接的事实。

点击电子邮件链接时，将用户发送到移动应用上的页面

1 个答案: