Level: Beginning
Prerequisite: General JavaScript Programming
Next Steps: JSAPI Profile Tutorial, JSAPI Network Streaming Tutorial, JSAPI Connections Tutorial
Summary: Whether you're just trying to get some simple interaction in your page or authenticate the user in able to present a more complicated interactive application, authenticating the user is the first step. This tutorial will teach you to load the framework and present a login button in your page.
In order to authenticate a user using the javascipt API, you need to do at least two steps. First, you need to load the JSAPI framework, with optional parameters to specify how it should load. Next, you need to provide a login method for the user to authenticate. Once you have those in place, you can add handlers to the authentication events to customize your application's behavior when the user logs in.
Before you can do anything with the API, you'll need to get a key for our system. Go to the Developer Portal and create an account. Once you've done that, you can get a key by adding an application.
When setting up the key for your application, you need to set the Javascript domain. The JSAPI will not work unless the hostname in the browser field matches this host. Details on this field can be found on the Configuration and Compatibility document.
While the easiest method of authenticating a user for the JSAPI is to use one of the login buttons, some sites have implemented the OAuth 1.0a flow used by the REST API. Whichever type of authentication you use for the user, the JSAPI will recognize that the member has already logged in, as long as the key and hostname are the same. This happens automatically, requiring no additional code by the developer.
If a user has logged in using the JSAPI, a permanent token for the REST APIs can be generated from the JSAPI token. Details on this process are in the Token Exchange documentation.
For the most basic framework, put the following in the head of your document:
This is the preferred method of using basic authentication in applications which only need very basic functionality and interaction. This login button provides the ability to access basic information about the user using the templating feature in the JSAPI.
This will create a button like this one (go ahead, log in to see how it works!)
In the body of your document, add a login button.
It renders as:
When you provide HTML within the login button script, that text will be displayed to the member once they've authenticated.
Note: This is the preferred method of using basic authentication in applications which only need very basic functionality and interaction.
If you want to use this functionality to personalize the user's experience, you can use the JSAPI templating language to access the information you get when the user is authenticated.
If you want functionality beyond the basic login/templating, you will need to add handlers for authentication events. The most direct way to do this is to put listeners directly on the button.
When building any interactive applications, an application needs to know how to handle the events provided by LinkedIn. The JSAPI provides event handling for loading, authentication, and logout.
You can set a handler to fire when the framework has finished loading by modifying how you load the framework.
When you do this, you can register specific handlers for the authentication events. More detailed information on these calls can be found in the Events section of the JavaScript API Reference.
Alternatively, you can set event handlers for the authentication events directly on the Login button: