从 NativeScript vue iOS 中的电子邮件链接打开应用程序

Posted 2023-04-13

【中文标题】从 NativeScript vue iOS 中的电子邮件链接打开应用程序

【英文标题】：Opening app from email link in NativeScript vue iOS

【发布时间】：2019-10-14 05:47:38

【问题描述】：

编辑更多关于如何在vue中使用这个插件的解释，请看NativeScript vue, vuex and urlhandler

---

我正在尝试这样做，以便电子邮件中的链接可以打开我正在构建的应用程序（它是我正在构建的用于学习 NativeScript 的测试应用程序）。我在 ios 上使用 https://www.npmjs.com/package/nativescript-urlhandler 和 NativeScript vue。

在platforms/ios/######/app/App_Resources/iOS/Info.plist我已经添加了

<key>CFBundleURLTypes</key>
<array>
   <dict>
       <key>CFBundleURLName</key>
       <string>com.#######.######</string>
   </dict>
   <dict>
       <key>CFBundleURLSchemes</key>
       <array>
           <string>mycustomappfoobar</string>
       </array>
   </dict>
</array>

在 app.js 中，我添加了：

const handleOpenURL = require("nativescript-urlhandler").handleOpenURL;


handleOpenURL(function(appURL) 
    console.log('Got the following appURL', appURL);
  );

点击mycustomappfoobar://test（电子邮件中的链接）时没有任何反应...

我查看了 Angular 示例，并且在初始化时调用了 handleOpenURL...所以我尝试将 handleOpenURL 放在 vues 挂载的钩子中——但这也不起作用。真是难住了……

new Vue(
    mounted() 
      handleOpenURL(function(appURL) 
        console.log('Got the following appURL', appURL);
      );
    ,
    render: h => h("frame", [h(Home)]),
    store: Store
).$start();

【问题讨论】：

插件与点击链接打开应用无关。它是由操作系统通过识别您在构建时列出的 url 方案 (CFBundleURLSchemes) 来完成的。该插件仅负责捕获用于打开应用程序的 URL 和参数。尝试干净的构建，确保包含您的 CFBundleURLSchemes 更改。

谢谢@Manoj - 我尝试了一个干净的构建（但是，它似乎淘汰/覆盖了我放入 info.plist 的方案）。

糟糕，刚刚注意到您正在更新错误的信息 plist，这是自动生成的，基本上是平台文件夹中的任何内容。使用App_Resources/iOS/info.plist 中的那个。

谢谢 - 我现在就去试试这个:)

太棒了！ - 我收到一条错误消息，“合并 CFBundleURLTypes：需要属性 CFBundleTypeRole！” - 但这一切都有效......谢谢！ :D

【参考方案1】：

您更新错误info.plist。基本上平台文件夹中的任何内容都是自动生成的。使用App_Resources/iOS/info.plist 中的那个。

【参考方案2】：

你打电话给handleOpenURL 太晚了。这应该在创建 Vue 上下文之前调用，以便可以在幕后适当地扩充 UIAppDelegate。

^{来自https://github.com/hypery2k/nativescript-urlhandler/blob/cd6939119910b6345e444055ad17716a7c0ad1d6/demo/app/app.ts}

import  handleOpenURL, AppURL  from 'nativescript-urlhandler';

import './app.scss';
import './bundle-config';
import * as app from 'application';

handleOpenURL((appURL: AppURL) => 
    console.log('handleOpenURL', appURL);
);

app.start( moduleName: 'main-page' );

【讨论】：

感谢@Ian MacDonald。这是示例打字稿吗？ （就像在 handleOpenURL 上调用参数的方式一样？）。我一直在 vue 之前调用它......但是在我试图弄清楚为什么它对我不起作用时，在 vue 的挂载钩子中尝试了它......结果它不起作用，因为我很愚蠢通过将我的配置放在错误的文件中...

编辑 - 在 vue 中，您需要从 mount 中调用handlOpenURL，否则您将无法访问所有方法....请参阅***.com/questions/56365775/…