Sample Code: Sending a Message

Message Sending Example ApplicationMany developers prefer to learn from sample code. Here is a small but self-contained application that authenticates the viewer and lets them send a message to themselves via member-to-member messaging.The application:

  • Displays a login button using an IN/Login tag which the viewer can use to authenticate and authorize the app
  • Uses the IN.API.Raw() API to send a message to the logged in user (from the logged in user)
  • Pops an alert on failure or reports success on the page

Here's code for the entire app. It'll then be broken down bit-by-bit. If you have questions about any pieces, read the JavaScript API Tutorial and JavaScript API Reference. If using this code for yourself, be sure to use your own API key that's been properly configured to work for your domain.The Code

1  <html xmlns="http://www.w3.org/1999/xhtml">
2  <head>
3  <title>LinkedIn JavaScript API Sample Application</title>

4  <!-- Load in the JavaScript framework and register a callback function -->
5  <script type="text/javascript" src="http://platform.linkedin.com/in.js">/*
6  api_key: YOUR_KEY_HERE
7  onLoad: onLinkedInLoad
8  authorize: true
9  */</script>
 
10 <script type="text/javascript">

11 function onLinkedInLoad() {
12     // Listen for an auth event to occur
13     IN.Event.on(IN, "auth", onLinkedInAuth);
14 } 

15 function onLinkedInAuth() {
16     // After they've signed-in, print a form to enable keyword searching
17     var div = document.getElementById("sendMessageForm");

18     div.innerHTML = '<h2>Send a Message To Yourself</h2>';
19     div.innerHTML += '<form action="javascript:SendMessage();">' +
20                  '<input id="message" size="30" value="You are awesome!" type="text">' +
21                  '<input type="submit" value="Send Message!" /></form>';
22 }
 
23 function SendMessage(keywords) {
24     // Call the Message sending API with the viewer's message
25     // On success, call displayMessageSent(); On failure, do nothing.
 
26     var message = document.getElementById('message').value; 
27     var BODY = {
28        "recipients": {
29           "values": [{
30             "person": {
31                "_path": "/people/~",
32             }
33           }]
34         },
35       "subject": "JSON POST from JSAPI",
36       "body": message
37     }

38     IN.API.Raw("/people/~/mailbox")
39           .method("POST")
40           .body(JSON.stringify(BODY)) 
41           .result(displayMessageSent)
42           .error(function error(e) { alert ("No dice") });
43 }

44 function displayMessageSent() {
45     var div = document.getElementById("sendMessageResult");
46      div.innerHTML += "Yay!";
47 }

48 </script>
49 </head>
50 <body>
51 <script type="IN/Login"></script>
52 <div id="sendMessageForm"></div>
53 <div id="sendMessageResult"></div>
54 </body>
55 </html>

The ExplanationLines 4-9 load the LinkedIn JavaScript API framework. The only required option is api_key, which is the API key you received when you created an application. The other two parameters are optional. They specify a callback function and automatically trigger authentication of viewers who have already granted your application access.Line 11 begins the JavaScript code to wire up the page to the JavaScript API. There are four functions used to make it work.The onLinkedInLoad() function is triggered by the JavaScript framework after it has completed initialization. Inside, you define a listener for an authentication (auth) event. This means the viewer has signed-in. This can occur because the framework detected a previous grant, or from an explicit sign-in. Line 51 contains a script tag to render a Sign-In button for you that handles all the authentication seamless.Once authorization occurs, onLinkedInAuth() kicks in, starting on Line 15. When the page first loads, all an unauth'd viewer sees is a button to Sign-In to LinkedIn. This function adds a form asking them to Send a Message to Yourself and includes a <form> with a search box. The form's action passes the value from the text input to SendMessage().On Lines 26-37, the message body is built using JSON, including the message typed in the "message" field.  Here's where the API request to LinkedIn takes place. The SendMessage() function calls the LinkedIn JavaScript API function IN.API.Raw() with the correct URL and body to send a message. This function calls the API resource for Messaging Between Connections to send the message and report success or failure.The final two methods, result() and error() take callback function. They're triggered on success and failure, respectively. Here we call displayMessageSent() on a good request and pop up a javascript alert on failure.Only the result() method is required for any JavaScript API call. Everything else is optional. Defaults will be used by the framework instead.The displayMessageSent() callback function simply adds a line to the sendMessageResult div indicating success.There's the IN/Login script block. This appears when the viewer is unauthenticated and disappears after they are.Next are the two divs where you paint the form and results. This is all done using JavaScript, so they are empty.That's it!