使用linkedin登录并获取Angular2中的用户信息

时间:2017-04-19 17:57:26

标签: angular angular2-forms linkedin-api angular-components angular2-cli

我是Angular2的新手,我希望集成链接登录功能,并获取Angular2项目当前烧录的用户信息。

我已经在使用linkedin开发者帐户创建了应用,并且客户端ID 客户端密钥并尝试了以下代码,但它给了我错误

ZoneAwareError {__zone_symbol__error:错误:您必须指定有效的JavaScript API域作为此密钥配置的一部分。在......}

我尝试了使用双引号声明api键的方式(api_key:" 81zbsc62i53h5x"没有它(api_key:81zbsc62i53h5x)但是同样的错误来了。

包含在index.html

中的脚本下方
     <script type="text/javascript" src="http://platform.linkedin.com/in.js">
    api_key: 81zbsc62i53h5x
    authorize: true
    onLoad: onLinkedInLoad
    scope: r_fullprofile
  </script>
app.component.ts中的

代码

declare var IN: any;
export class AppComponent {
  onLinkedInLoad() {
    IN.Event.on(IN, "auth", this.onLinkedInAuth);
  }
  public onLinkedInAuth() {
    IN.API.Profile("me")
      .fields("firstName", "lastName")
      .result(this.displayProfiles)
      .error(this.displayProfilesErrors);
  }
  public displayProfiles(profiles) {
    var linkedinmember = profiles.values[0];
    console.log(JSON.stringify(linkedinmember));
    console.log(linkedinmember.firstName + " " + linkedinmember.lastName);
  }
  public displayProfilesErrors(error) {
    console.log(error.message);
    console.log(error);
  }
}

app.component.html登录按钮,然后点击

 <button (click)="onLinkedInLoad()" class="linkedin-btn">LinkedIn Login</button> 

任何帮助都非常感谢。

1 个答案:

答案 0 :(得分:1)

当您尝试将linkedin sdk与未注册的域集成时,会出现此错误。 您需要做两件事: 1.在linkedin应用面板中添加您的域名: Linkedin Panel

2.设置主机文件以在测试域时测试您的应用程序。