Как реализовать OAuth.io с помощью Ionic Framework для LinkedIn?

Я создал приложение LinkedIn и получил идентификатор клиента и client_secret.

Теперь внутри интегрированного API OAuth.io создан API и добавлены ключи и область разрешений.

Я хочу запустить этот проект с помощью Ionic Framework. Что нужно сделать для ее достижения.

P.S. Я новичок в Ionic Framework и OAuth.io. Поэтому, пожалуйста, не обращайте внимания на мой стиль постановки вопроса.

весь index.html:

<!DOCTYPE html>
<html>
 <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <script src="js/ng-cordova.min.js"></script>
    <script src="js/ng-cordova-oauth.min.js"></script>
    <script src="cordova.js"></script>

    <script src="js/app.js"></script>
</head>

 <body ng-controller="MainCtrl">
<button class="button" ng-click="linkedInLogin()">Login via LinkedIn</button>
 </body>
</html>

весь app.js:

angular.module('starter', ['ionic', 'ngCordova', 'ngCordovaOauth'])

.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
if(window.cordova && window.cordova.plugins.Keyboard) {
  cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
  cordova.plugins.Keyboard.disableScroll(true);
}
if(window.StatusBar) {
  StatusBar.styleDefault();
 }
});
})
.controller("MainCtrl", function($scope, $cordovaOauth) {
document.addEventListener( "deviceready", onDeviceReady );
  function onDeviceReady( event ) {
      // on button click code
      $scope.linkedInLogin = function(){
        OAuth.initialize('07IxSBnzVoGGQL2MpvXjSYakagE')
        OAuth.popup('linkedin').done(function(result) {
            // Here you will get access token
            console.log(result)
              result.me().done(function(data) {
                  // Here you will get basic profile details of user
                  console.log(data);  
              })
        });
      };
  }
});

ionic-framework linkedin-api linkedin oauth.io
person Himanshu K    schedule 29.03.2016    source источник

Ответы (3)


arrow_upward
4
arrow_downward

Пожалуйста, выполните шаги и приведенный ниже код:
1) создайте проект из терминала как ionic start linkedinlogin Blank
2) cd linkedinlogin project
3) добавьте необходимую платформу в терминал как ionic add platform ****
4) Добавьте файл ng-cordova.min.js над файлом cordova.ja в наш проект
5) Установите ng-cordova-oauth as bower install ng-cordova-oauth - S
6) Затем включите файл ng-cordova-oauth.min.js в index.html
7) Вставьте «ngCordova» и «ngCordovaOauth» в качестве зависимости в файл app.js
8) В index.html создайте кнопку для входа через linkedin
9) В app.js создайте контроллер с приведенным ниже кодом
10) Обновите платформу Cordova, если указанный выше плагин не работает

$cordovaOauth.linkedin(clientId, clientSecret, ['r_basicprofile', 'r_emailaddress']).then(function(success){
      //Here you will get the access_token

      console.log(JSON.stringify(success));

      $http({method:"GET", url:"https://api.linkedin.com/v1/people/~:(email-address,first-name,last-name,picture-url)?format=json&oauth2_access_token="+success.access_token}).success(function(response){

        // In response we will get firstname, lastname, emailaddress and picture url
        // Note: If image is not uploaded in linkedIn account, we can't get image url

        console.log(response);
      }, function(error){
        console.log(error);
      })
    }, function(error){
      console.log(error);
    })
person HARITHA UPPARA    schedule 30.03.2016
comment
Я знаю этот метод. но я должен использовать OAuth.io - person Himanshu K; 30.03.2016
comment
Это нужно отметить как правильный ответ! использовать нгКордова - person Jason; 14.09.2016

arrow_upward
1
arrow_downward

Я думаю, вы читали плагины ngCordova.

person Anurag Pandey    schedule 29.03.2016
comment
Я должен использовать OAuth.io - person Himanshu K; 30.03.2016

arrow_upward
0
arrow_downward

Используя oauth.io, я реализовал вход через linkedin:

Выполните следующие действия:
1. Создайте приложение на oauth.io и получите открытый ключ.
2. Нажмите на меню "Интегрированные API" на левой боковой панели.
3. Теперь нажмите Зеленая кнопка ADD APIs в правом верхнем углу.
4. Теперь выполните поиск и выберите LinkedIn.
5. Теперь добавьте идентификатор клиента и секрет клиента в ключи и область разрешений.
6. используйте ниже команда для добавления плагина в проект:

cordova plugin add https://github.com/oauth-io/oauth-phonegap

7. Код контроллера см. ниже.

document.addEventListener( "deviceready", onDeviceReady );
  function onDeviceReady( event ) {
      // on button click code
      $scope.linkedInLogin = function(){
        OAuth.initialize('your public key')
        OAuth.popup('linkedin').done(function(result) {
            // Here you will get access token
            console.log(result)
              result.me().done(function(data) {
                  // Here you will get basic profile details of user
                  console.log(data);  
              })
        });
      };
  }

Надеюсь, это может помочь вам ..

person HARITHA UPPARA    schedule 30.03.2016
comment
Вы не написали ng-click для кнопки на html-странице.. напишите, как показано ниже. - person HARITHA UPPARA; 30.03.2016
comment
вы дважды написали функцию ng-click... я написал код для нажатия кнопки в моем коде контроллера (на 7-м шаге)... так что вы просто включаете мой код контроллера в свой контроллер... не добавляйте строки извлечения - person HARITHA UPPARA; 30.03.2016
comment
На странице html вы не упомянули ng-app=starter... включите это, как показано ниже.. ‹body ng-app=starter ng-controller =MyCtrl› - person HARITHA UPPARA; 31.03.2016