2015-09-30 2 views
1

Je suis un peu bloqué sur ce problème que j'ai avec un complément Outlook Mail. J'utilise un compte développeur Office 365, où le courrier Add-In affichera (en ligne, dans le navigateur): enter image description hereAppel du service Web à partir du complément Outlook Mail

Je veux appeler un service Web REST lorsque je clique sur le bouton.

Tout d'abord, permettez-moi de mon poste HTML:

<html> 
<head> 
    <meta charset="UTF-8" /> 
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" /> 
    <title></title> 
    <script src="../../Scripts/jquery-1.9.1.js" type="text/javascript"></script> 

    <link href="../../Content/Office.css" rel="stylesheet" type="text/css" /> 
    <script src="https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js" type="text/javascript"></script> 

    <!-- To enable offline debugging using a local reference to Office.js, use:      --> 
    <!-- <script src="../../Scripts/Office/MicrosoftAjax.js" type="text/javascript"></script> --> 
    <!-- <script src="../../Scripts/Office/1.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> 
    <!--Header and Footer tags not supported--> 
    <div id="content-main"> 
     Click this button to test the create method 
     <br /> 
     <label id="lblMessage">Message will appear here</label> 
     <button id="btnTest" type="button">Perform Test Create</button> 

     <!--<iframe id="my_api_iframe"></iframe>--> 
    </div> 
</body> 
</html> 

C'est le code HTML de ce que nous voyons dans la première capture d'écran.

Le code Office.initialize JS, pour ceux qui veulent voir:

Office.initialize = function (reason) { 
     //_mailbox = Office.context.mailbox; 
     ////Request identity token from Exchange Server. 
     //_mailbox.getUserIdentityTokenAsync(getTokenCallback); 

     $(document).ready(function() { 
      app.initialize(); 
      //SET Variables 
      loggedInUserDisplayName = Office.context.mailbox.userProfile.displayName; 
      loggedInUserEmailAddress = Office.context.mailbox.userProfile.emailAddress; 
      var conversationID = Office.context.mailbox.item.conversationId; 
      var internetMessageID = Office.context.mailbox.item.internetMessageId; 
      var itemID = Office.context.mailbox.item.itemId; 

      //$('#lblMessage').text("ConversationID:" + convoID + " InternetMessageID:" + intMessID + " ItemID:" + itemID); 

      $("#btnTest").click(function() { 
       GetList(); 
       //GetList2(); 
      }); 
     }); 
    }; 

J'ai essayé différentes façons de le faire. Lorsque le bouton est cliqué, il appelle la fonction spécifiée, voici quelques façons que j'ai essayé:

function GetList() { 
     jQuery.support.cors = true; 
     $.ajax({ 
      type: "GET", 
      url: [URL to WebMethod], 
      success: function (data, textStatus) { 
       $('#lblMessage').text("Success"); 
      }, 
      error: function (xhr, textStatus, errorThrown) { 
       $('#lblMessage').text("Error: " + errorThrown + " StatusCode: " + textStatus + " XHR: " + xhr.readyState); 
      } 
     }); 
    } 

Mais lorsque le bouton est cliqué et j'appeler cette fonction, est l'erreur que je reçois: enter image description here

La 2ème fonction j'ai essayé:

function GetList2() { 
     $.ajax({ 
      type: "GET", 
      url: [URL to WebMethod], xhr: function() { 
       return new ($('#my_api_iframe')[0].contentWindow.XMLHttpRequest)(); 
      }, success: function (html) { 
       // format and output result 
       $('#lblMessage').text(html); 
      }, error: function (xhr, textStatus, errorThrown) { 
       // format and output result 
       $('#lblMessage').text(errorThrown); 
      } 
     }); 
    } 

Mais en vain. Ceci est l'erreur que je reçois: enter image description here

fonction Last j'ai essayé:

function getTokenCallback(asyncResult) { 
     var token = asyncResult.value; 

     // Create a web service call and pass the token as part of the call. 
     _xhr = new XMLHttpRequest(); 
     _xhr.open("GET", [URL to WebService]); 
     _xhr.setRequestHeader("Content-Type", "application/xml; charset=utf-8"); 
     _xhr.onreadystatechange = readyStateChange; 

     var request = new Object(); 
     request.token = token; 
     request. 
     request.phoneNumbers = _om.get_item().getEntities().phoneNumbers; 

     _xhr.send(JSON.stringify(request)); 
    } 

Mais je reçois la même erreur « accès est refusé » comme avant, au moment où je fais la _xhr.open ().

Est-ce que quelqu'un peut peut-être m'aider dans la bonne direction pour obtenir ces services REST appelés? Ils renvoient tous des données au format XML, c'est pourquoi j'ai utilisé ContentType de "application/xml".

Toute aide sera grandement appréciée, même si c'est une façon complètement différente de ce que j'essaie de faire :).

+0

Vous faites une demande CORS? En d'autres termes, le service REST a-t-il la même origine que votre page? –

+0

S'il se trouve sur un domaine différent et que vous ne pouvez pas (ou ne voulez pas) utiliser CORS, vous pouvez toujours effectuer le traitement côté serveur pour extraire le fichier à la place. Puis servez-le du serveur à votre javascript (sur le même domaine) en tant qu'objet XML ou JSON. Voir http://blogs.msdn.com/b/officeapps/archive/2013/06/10/create-a-web-service-for-an-app-for-office-using-the-asp-net-web -api.aspx –

+0

@Gab Royer - Non, le complément fonctionne sur office365.com et le service auquel je veux accéder est sur localhost. –

Répondre

0

Votre élément HTML iframe est mis en commentaire. Essayez de le décommenter. Au moins c'est pourquoi le GetList2() échoue.

changer Alors

<!--<iframe id="my_api_iframe"></iframe>--> 

à

<iframe id="my_api_iframe"></iframe>