Yammer REST API for Dummies

So you are about to start developing with the Yammer REST API? You probably have a lot of questions and that is totally expected, I had loads of questions myself when I started off. The aim of this blog post is to get you up and running with minimal effort by providing practical sample codes and hopefully, answer most of your newbie questions. If you are able to post a message to Yammer in 27 minutes using the Yammer Javascript SDK, then this blog post has served its purpose. Let's get started. 

The first thing you want to do is to register an app in your Yammer network. Note down your Client ID (a.k.a App ID) and Client Secret values because you're going to need them. 

Post message to a yammer group

Next, you'd need to create a basic HTML page and include the JS SDK resource with the data-app-id definition as shown below:

 
   <script type="text/javascript" data-app-id="PASTE_YOUR_CLIENT_ID_HERE" src="https://c64.assets-yammer.com/assets/platform_js_sdk.js"></script>  
 

Once that's done, write the PostMessage function:   

  function postMessage() {  
     yam.getLoginStatus( function(response) {  
       if (response.authResponse) {  
        //call the yamPostRequest function if the user is logged in
       yamPostRequest(this);  
       } else {  
        //redirect the user to log in
        alert("not logged in")  
         yam.login( function (response) {  
        //re-check if the user is now logged in, then call the yamPostRequest function
          if (!response.authResponse) {  
           yamPostRequest(this);  
          }  
         });  
       }  
     });  
   }  

The postMessage function checks if there is a valid yammer oauth token in the user's browser and if the app is verified by the user. If the user is not logged in, "yam.login" is used to pop up the yammer login screen. You'd need to enable popups from *yammer.com in your browser for this work. Once the code verifies that the user is logged in, it will then invoke the yamPostRequest function shown below: 

  function yamPostRequest(val) {  
   var msg_value = document.getElementById('msg_body').value;  
   var groupID = document.getElementById('group_id').value;  
    if(msg_value ==""){  
     alert ("Message body cannot be empty!");  
     return false;  
    }  
    if(groupID==""){  
    var conf = confirm("Group ID is empty, message will be posted to All Company") ;
    if(conf==false){return false;}
    }  
 yam.platform.request(  
   {   
    url: "https://api.yammer.com/api/v1/messages.json"  
    , method: "POST"  
    , data: {  
     "body" : msg_value,  
     "group_id" : groupID  
    }  
    , success: function (msg) { alert("Post was Successful!"); }  
    , error: function (msg) { alert("Post was Unsuccessful"); }  
    }  
    )  
 }  

The yamPostRequest function accept message body and group ID as form inputs, validate the inputs and POST the request to Yammer's messages REST endpoint. 

Next, create the HTML form:

   <form name="myForm" method="get" action="">  
  <table cellspacing="2" cellpadding="2" border="0">  
   <tr>  
   <td align="right">GroupID</td>  
   <td>  
   <input type="text" name="group_id" id="group_id" />   
  </td>  
  </tr>  
  <tr>  
   <td align="right">Body</td>  
   <td>  
   <textarea rows="4" cols="50" name="msg_body" id="msg_body"></textarea>  
  </td>  
  </tr>  
 <tr>  
  <td align="right"></td>  
  <td><input type="button" value="Post Message" onclick ="postMessage();" /></td>  
  </tr>  
  </table>  
 </form>  

In all, your project layout should look like this - https://codio.com/iogbole/yam-jssdk-101

That's all about the coding aspect, but an attempt to run your code will result to Cross Origin Resource Sharing (CORS) error; so the next and final step is to open the registered app in Yammer and add the host name of your web server to the app's Javascript Origins: 

 

 

Feel free to download the code from github, change the data-app-id value in script.js and Yammer-ON. 

The next part of this blog will demonstrate how to GET contents from yammer using the Javascript SDK and AngularJS

Next -> Consuming Yammer RESTful APIs using AngularJS 

Tweet to @israel_ogbole

[bing_translator]