编程语言
首页 > 编程语言> > javascript-在Ionic中为外部API处理重定向Uri

javascript-在Ionic中为外部API处理重定向Uri

作者:互联网

因此,我已经构建了一个Webapp,并在Ionic中制作了一个相应的移动应用.我想制作一个渐进式Web应用程序,因为它可以使我的生活更轻松,但我想Apple还不支持.

(附:我在这方面很新)

因此,我正在使用id.me api来验证军事服务,该服务会在重定向uri中发回访问令牌以发出api请求.

我可以通过服务器或客户端通过两种方式执行此操作.

这是他们的网络流程
https://developer.id.me/documentation#oauth-overview

这就是我迷失离子的地方.

因此,要启动网络流,我必须将用户发送到id.me的授权端点,这将在inappbrowser中进行

https://api.id.me/oauth/authorize?client_id=CLIENT-ID&redirect_uri=REDIRECT-URI&response_type=token&scope=SCOPE

id.me在重定向上向其发送回访问令牌的目标…

从那里,我可以抢夺令牌,将其保存到本地存储并关闭inAppBrowser.我不知道在哪里设置uri?是本地主机吗?当您在平台上构建Ionic时,它是否在本地服务器上运行?

我会做这样的事情吗?

angular.module('myApp', ['ionic', 'ngCordova']).controller('AppCtrl', 

function($rootScope, $ionicPlatform, $cordovaInAppBrowser) {
    var callback = 'http://localhost:8100/callback';
    $scope.idAuth = function() {
      $ionicPlatform.ready(function() {
        var options = {
          location: 'yes',
          clearcache: 'no',
          toolbar: 'yes'
        };
        $cordovaInAppBrowser.open('https://api.id.me/oauth/authorize?client_id=CLIENT-ID&redirect_uri=callback&response_type=token&scope=SCOPE', '_blank', options)
      });
    };


    $rootScope.$on('$cordovaInAppBrowser:loadstart', function(e, event) {
      //and this function is called, so you do something like
      if(event.url === callback){;
        let token = event.url.match(/\#(?:access_token)\=([\S\s]*?)\&/)[1];
        $window.localStorage.setItem('token', token);
        $cordovaInAppBrowser.close();
      }
    });

现在,如果该回调uri被命中,它将运行该函数?

而且,这就是我迷路的地方.我知道这在本地开发中如何工作,但是当您将其构建并放在设备上时,该回调uri是否仍然存在? Ionic是否在设备本身的本地服务器上运行?

解决方法:

Ionic正在监听http://localhost/[YourCallBackURI].默认情况下,它在设备的端口80上运行,除非您另外更改了配置.在仿真器模式下运行时,将使用其他端口.

标签:angularjs,ionic-framework,cordova,javascript
来源: https://codeday.me/bug/20191118/2029603.html