2016-07-20 15 views
5

Angular2'de LinkedIn Kimlik Doğrulama ile ilgili bir sorunum var benim kodum.Angular2 içinde Linkedin Nasıl Entegre Edilir

import {Component , OnInit , NgZone} from 'angular2/core'; 
import {HTTP_PROVIDERS} from 'angular2/http'; 
import {ROUTER_DIRECTIVES , Router} from 'angular2/router'; 

declare var IN : any; 

@Component({ 
    directives : [ROUTER_DIRECTIVES], 
    selector : '.main', 
    providers : [HTTP_PROVIDERS], 
    templateUrl : './app/registration/employee.reg.html' 
}) 

export class EmployeeRegistrationComponent implements OnInit{ 

constructor(private zone : NgZone){ 
    this.zone.run(() => { 
     $.proxy(this.OnLinkedInFrameworkLoad, this); 
    }); 
} 

ngOnInit(){ 
    var linkedIn = document.createElement("script"); 
    linkedIn.type = "text/javascript"; 
    linkedIn.src = "http://platform.linkedin.com/in.js"; 
    linkedIn.innerHTML = "\n"+ 
     "api_key: **********\n" + 
     "authorize: true\n" + 
     "onLoad:" + this.OnLinkedInFrameworkLoad ; 
    document.head.appendChild(linkedIn); 

    var script = document.createElement("script"); 
    script.type = "in/Login"; 
    document.body.appendChild(script); 
} 

OnLinkedInFrameworkLoad =() => { 
    IN.Event.on(IN, "auth", this.OnLinkedInAuth); 
} 

OnLinkedInAuth =() => { 
    IN.API.Profile("me").result(result => this.ShowProfileData); 
} 

ShowProfileData(profiles) { 
    console.log(profiles); 
    var member = profiles.values[0]; 
    var id=member.id; 
    var firstName=member.firstName; 
    var lastName=member.lastName; 
    var photo=member.pictureUrl; 
    var headline=member.headline; 

    //use information captured above 
    } 

} 

Konsol Fırlatma hatası: angular2-polyfills.js:1250 Uncaught Error: Could not execute 'function() {'. Please provide a valid function for callback.

benim yaptığım yanlış olduğunu Bana yardım edin ...

+0

böylece için dom komut dosyası etiketi eklemek için izin açısal nedir? –

+0

evet .. javascript dom işlevlerini kullanıyorum .. komut dosyalarını işlemek için –

+0

@DoubleH Bunu hiç işe aldınız mı? Bunu uygulamakta zorlanıyorum ve böyle bir şeyin nasıl yapılacağı konusunda çok az belge var. – pwborodich

cevap

1

ben ilk komut etiketinde kaynak kod çıkışını kontrol ederek sorunu buldum.

Sorun, nereye koyduğunuzu geçerli:

"onLoad:" + this.OnLinkedInFrameworkLoad; 

Bu çıkış gibi olacaktır: Resmi developper belgelerinde diyor gibi

onLoad: function() {↵   IN.Event.on(IN, "auth", _this.OnLinkedInAuth);↵  } 

Ve

Önemli!

Başka bir alan ayırıcısı olmadığı için etiketlerdeki argümanlar arasındaki satır sonları önemlidir. İşlenen HTML'nizden boşlukları kesen bir şablon dili veya kod küçültücü kullanıyorsanız, bu etiket içindeki satır sonlarını korumak için bir istisna yapmanız gerekeceğini unutmayın. Aksi takdirde, düzgün bir şekilde ayrıştırılmayacaktır.

Kaynak: Ben Eğik 2 ile LinkedIn giriş sorunu çözmek için ama tekrar başka çözümler bu benim için çalışıyor

0

çalışacağız henüz nasıl bulmuyorum https://developer.linkedin.com/docs/getting-started-js-sdk


:

import { Component, OnInit, NgZone } from '@angular/core'; 

    export class RegistrationComponent implements OnInit{ 

constructor(private ngZone: NgZone) { 
     window['onLinkedInLoad'] =() => ngZone.run(() => this.onLinkedInLoad()); 
     window['displayProfiles'] = (profiles) => ngZone.run(() => this.displayProfiles(profiles)); 
     window['displayProfilesErrors'] = (error) => ngZone.run(() => this.displayProfilesErrors(error)); 
    } 

    ngOnInit() { 
       var linkedIn = document.createElement("script"); 
         linkedIn.type = "text/javascript"; 
         linkedIn.src = "http://platform.linkedin.com/in.js"; 
         linkedIn.innerHTML = "\n" + 
          "api_key: ****\n" + 
          "authorize: true\n" + 
          "onLoad: onLinkedInLoad\n"+ 
          "scope: r_basicprofile r_emailaddress"; 
         document.head.appendChild(linkedIn); 
         var script = document.createElement("script"); 
         script.type = "in/Login"; 
         document.body.appendChild(script); 
       } 

       public onLinkedInLoad() { 
         IN.Event.on(IN, "auth", this.onLinkedInProfile); 
       } 

       public onLinkedInProfile() { 
          IN.API.Profile("me") 
           .fields("id", "firstName", "lastName", "email-address") 
           .result(this.displayProfiles) 
           .error(this.displayProfilesErrors); 
       } 
       public displayProfiles(profiles) { 
        console.log(profiles); 
       } 
       public displayProfilesErrors(error) { 
         console.debug(error); 
       } 
       //Invoke login window with button 
       public liAuth() { 
        IN.User.authorize(function() { 
          console.log('authorize callback'); 
        }); 
       } 
      } 
0

Kullandığınız javascript dom işlevleri, bunu değiştirmeniz gerekir:

Buna
"onLoad:" + this.OnLinkedInFrameworkLoad ; 

:

"onLoad: onLinkedInLoad"; 

Şimdi index.html 'nin <head> eklemek bu

<script type="text/javascript"> 

// Setup an event listener to make an API call once auth is complete 
function onLinkedInLoad() { 
    IN.Event.on(IN, "auth", getProfileData); 
} 

// Handle the successful return from the API call 
function onSuccess(data) { 
    console.log(data); 
} 

// Handle an error response from the API call 
function onError(error) { 
    console.log(error); 
} 

// Use the API call wrapper to request the member's basic profile data 
function getProfileData() { 
    IN.API.Raw("/people/~").result(onSuccess).error(onError); 
} 

</script> 
İlgili konular