我用NativeScript构建了东西-第3部分

OAuth + NativeScript

这是第三部分系列的最后一部分。 在第1部分中，我将基于NativeScript的POV作为解决方案。 在第2部分中，我讨论了使用Angular + NativeScript进行更改检测。 在最后一部分中，我将介绍如何将OAuth工作流程集成到NativeScript应用程序中。 以下内容假设您对OAuth 2.0有所了解。

OAuth

在NativeScript中使用OAuth提供了一些障碍。 特别是如果您使用Google作为提供商。 过去（2-3年前），您可以在本机应用程序中执行OAuth，只需将Web视图嵌入到您的应用程序中，允许用户浏览工作流程并查看弹出的code或token的URL。另一端。 如今，Google已消除了该集成渠道（有关安全性，可用性…… yada yada yada😜），您需要使用真正的OS浏览器来引导用户完成工作流程。 这使其更加复杂。 现在，您不仅要查看嵌入式浏览器的URL，还必须了解操作系统将自定义协议的链接路由到您的应用程序的能力。 所以现在看起来像这样

1. 使用callbackURL（例如customprotocol://google/oauth浏览器打开到OAuth工作流程
2. 用户通过工作流程
3. 在auth工作流程结束时，浏览器将重定向到customprotocol://google/oauth?code=blahblah
4. 发生这种情况时，操作系统将拦截该链接并将事件路由到您的应用程序。 因此，您需要侦听它们，拉出code参数，然后从OAuth提供程序请求令牌。

对于iOS，这表示为：

1. 提供一个SFSafariViewController （上面的步骤1）。
2. 通过实现侦听UIApplicationDelegate （上面的步骤4）中的链接：

  -（布尔）应用程序：（UIApplication *）app 
  openURL：（NSURL *）url 
 选项：（NSDictionary  *）选项 

最后，对于NativeScript，您需要：

• SFSafariViewController ：

  ... 
 让safariVC = new SFSafariViewController（{URL：url}）; 
  page.ios.presentViewControllerAnimatedCompletion（safariVC，true，null）; 

• 实施自定义应用程序委托：

 导出类AppDelegate扩展了UIResponder实现 
  UIApplicationDelegate { 

 公共静态ObjCProtocols = [UIApplicationDelegate]; 

  applicationOpenURLOptions？（app：UIApplication，url：NSURL， 
 选项：NSDictionary ）：布尔值{ 
  //从网址中拉出您需要的参数 
  //并对其进行处理。 
  } 

• 将您的自定义应用程序委托挂接到应用程序中。 在app/main.ts ：

 从“应用程序”中导入*作为应用程序； 
 从“ app.delegate”导入{AppDelegate} 
  … 
  if（application.ios）application.ios.delegate = AppDelegate; 
  … 

就是这样。

结论

希望我的痛苦可以节省一些时间。 一如既往，请让我知道我是否错过了这里的船，或者您想了解更多细节。

谢谢阅读！