javascript - Office 365 Word Add in using adal.js -

i creating add-in user data outlook using graph api in online word document.

my code below.

app.js

/* common app functionality */ window.config = { tenant: 'mod197124.onmicrosoft.com', clientid: 'db75fcfa-7a70-463a-aa7d-01f2f6b6acd6', postlogoutredirecturi: window.location.origin, endpoints: { officegraph: 'https://graph.microsoft.com', }, cachelocation: 'localstorage' };

var app = (function () { "use strict";

var app = {};  // common initialization function (to called each page) app.initialize = function () {     var authcontext = new authenticationcontext(config);      var $userdisplay = $(".app-user");     var $signinbutton = $(".app-login");     var $signoutbutton = $(".app-logout");      // check & handle redirect aad after login     var iscallback = authcontext.iscallback(window.location.hash);     authcontext.handlewindowcallback();      if (iscallback && !authcontext.getloginerror()) {         window.location = authcontext._getitem(authcontext.constants.storage.login_request);     }      // check login status, update ui     var user = authcontext.getcacheduser();     if (user) {         $userdisplay.html(user.username);         $userdisplay.show();         $signinbutton.hide();         $signoutbutton.show();     } else {         $userdisplay.empty();         $userdisplay.hide();         $signinbutton.show();         $signoutbutton.hide();     }      // register navbar click handlers     $signoutbutton.click(function () {         authcontext.logout();     });     $signinbutton.click(function () {         authcontext.login();     });      $('body').append(         '<div id="notification-message">' +             '<div class="padding">' +                 '<div id="notification-message-close"></div>' +                 '<div id="notification-message-header"></div>' +                 '<div id="notification-message-body"></div>' +             '</div>' +         '</div>');      $('#notification-message-close').click(function () {         $('#notification-message').hide();     });       // after initialization, expose common notification function     app.shownotification = function (header, text) {         $('#notification-message-header').text(header);         $('#notification-message-body').text(text);         $('#notification-message').slidedown('fast');     }; };  return app; })(); 

home.js

///

(function () { "use strict";

// initialize function must run each time new page loaded office.initialize = function (reason) {     $(document).ready(function () {         app.initialize();         $('#get-data-from-selection').click(getdatafromselection);     }); };  // reads email address current document selection , displays user information function getdatafromselection() {     var baseendpoint = 'https://graph.microsoft.com';     var authcontext = new authenticationcontext(config);      office.context.document.getselecteddataasync(office.coerciontype.text,         function (result) {             if (result.status === office.asyncresultstatus.succeeded) {                 authcontext.acquiretoken(baseendpoint, function (error, token) {                     if (error || !token) {                         app.shownotification("no token: " + error);                     }                     var email = authcontext._user.username;                     var url = "https://graph.microsoft.com/beta/" + config.tenant + "/users/" + email;                     var html = "<ul>";                     $.ajax({                         beforesend: function (request) {                             request.setrequestheader("accept", "application/json");                         },                         type: "get",                         url: url,                         datatype: "json",                         headers: {                             'authorization': 'bearer ' + token,                         }                     }).done(function (response) {                         html += getpropertyhtml("display name", response.displayname);                         html += getpropertyhtml("address", response.streetaddress);                         html += getpropertyhtml("postal code", response.postalcode);                         html += getpropertyhtml("city", response.city);                         html += getpropertyhtml("country", response.country);                         html += getpropertyhtml("photo", response.thumbnailphoto);                         $("#results").html(html);                     }).fail(function (response) {                         app.shownotification(response.responsetext);                     });                 });             } else {                 app.shownotification('error:', result.error.message);             }         }     ); }  function getpropertyhtml(key, value) {     return "<li><strong>" + key + "</strong> : " + value + "</li>"; } 

})();

home.html

<!-- enable offline debugging using local reference office.js, use:                        --> <!-- <script src="../../scripts/office/microsoftajax.js" type="text/javascript"></script>  --> <!-- <script src="../../scripts/office/1/office.js" type="text/javascript"></script>  -->  <link href="../app.css" rel="stylesheet" type="text/css" /> <script src="../app.js" type="text/javascript"></script>  <link href="home.css" rel="stylesheet" type="text/css" /> <script src="home.js" type="text/javascript"></script> </head> <body> <div id="content-header">     <button href="javascript:;" class="btn-success app-logout">logout</button>     <button href="javascript:;" class="btn-success app-login">login</button>     <strong><span class='app-user navbar-text'></span></strong> </div> <div id="content-main">     <div class="padding">         <button id="get-data-from-selection">get data selection</button>          <div id="results"></div>     </div> </div> </body> </html> 

code working log in , log out functionality. when going fetch data outlook using function "getdatafromselection", facing below exception.

exception:

how can authenticate user word add-in outlook data in taskpanal of word?

thanks, dipen shah