2016-05-26 19 views
0

Outlookの予定のアドインを読み込もうとするときに問題が発生しています。私たちのコマンドはリボンUIに表示され、アドインが開始しようとしており、wev-appへの呼び出しをトレースできます。トレース中に404または500のエラーは発生していません。このサービスは、最初のhtmlページにテキストとボタンを含み、認証を開始します。Office 365 Outlookの予定のアドインが起動しない

しかし、htmlが返された後、単にaddinのスピナーが停止し、何も表示されません。何が起こっているのかを理解するためにこれをデバッグする良い方法はありますか?

htmlページは非常に単純で、以下のコードのみが含まれています。

<head> 
    <title>Office-bokning</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1"> 
    <meta name="apple-mobile-web-app-capable" content="yes"> 
    <meta name="apple-mobile-web-app-status-bar-style" content="black"> 
    <meta name="format-detection" content="telephone=no"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <link rel="stylesheet" href="https://appsforoffice.microsoft.com/fabric/2.2.0/fabric.min.css"> 
    <link rel="stylesheet" href="https://appsforoffice.microsoft.com/fabric/2.2.0/fabric.components.min.css"> 
    <script src="https://appsforoffice.microsoft.com/lib/1/hosted/Office.js" type="text/javascript"></script> 
    <!--[authentication-popup-script]--> 
    <script> 
     startCheck = function() { 
      var checkCode = setInterval(function() { 

       localStorage.setItem('dummy', "dummy"); 
       localStorage.removeItem('dummy'); 
       var code = localStorage.getItem('code'); 
       var externalProviderUserId = localStorage.getItem('externalProviderUserId'); 

       function readCookie(name) { 
        var nameEQ = name + "="; 
        var ca = document.cookie.split(';'); 
        for (var i = 0; i < ca.length; i++) { 
         var c = ca[i]; 
         while (c.charAt(0) == ' ') c = c.substring(1, c.length); 
         if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length); 
        } 
        return null; 
       } 

       var fallbackCode; 
       var fallbackExternalProviderUserId; 

       if (/^((?!chrome|android).)*safari/i.test(navigator.userAgent)) { 
        fallbackCode = readCookie('NAME_OF_COOKIE'); 
        fallbackExternalProviderUserId = readCookie('externalProviderUserId'); 
       } 
       console.log("code " + code); 
       if (code || fallbackCode) { 
        clearInterval(checkCode); 

        var http = new XMLHttpRequest(); 
        var url = [URL] 
        http.open("POST", url, true); 

        //Send the proper header information along with the request 
        http.setRequestHeader("Content-type", "text/plain"); 
        //var that = this; 
        http.onreadystatechange = function() { 
         if (http.readyState == 4 && http.status == 200) { 
          localStorage.removeItem('code'); 
          localStorage.removeItem('externalProviderUserId'); 
          window.location.href = "[URL]"; 
          //location.reload(); 
         } 
        } 
        http.send(params); 
       } 
      }, 1000); 
     } 

     startCheck(); 
    </script> 
</head> 
    <body class="container-fluid" style="padding-left: 0px; padding-right: 0px; height: 100%"> 
     <p> 
      Some text describing the addin... 
     </p> 
     <!--[popup-button]--> 
     <script> 
      Office.initialize = function (reason) { 
       console.log("authorize office init" + reason); 
       var butan = document.getElementById('loginButton'); 
       if (butan) 
        butan.style.display = 'block'; 
      } 

      function commandFunction(event) { 
       event.completed(); 
      } 
     </script> 
    </body> 

答えて

3

TL; DR:それはあなたが認証のためのページをポップアップ表示したいようです。これを行うには、displayDialogAsync APIを使用します。

コードを見ると、間違ったことはありません。さらに、あなたが記述した振る舞いは、あなたが持っているコードに従って実際には正しいです。

"event"パラメータを取る "commandFunction"という名前の関数があります。私の推測では、あなたのマニフェストにcommandFunctionを呼び出すExecuteFunctionがあることです。

アポイントウィンドウのリボンでアドインのボタンをクリックすると、Outlookはあなたのhtmlウェブページを読み込み、 "Office.initialize"を呼び出し、あなたのアプリのデフォルトスピナーを "Subject "フィールドを呼び出し、" commandFunction "を呼び出します。この関数内の唯一のコードは "event.completed"なので、Outlookはそのコードを呼び出します。これは基本的にアプリケーションの実行を終了します。その時点で、Outlookはシグナル補完のためにデフォルトのスピナーを削除します。それはまさにあなたが経験していることです。

「event.completed」を呼び出す前に、「commandFunction」内の関連するコードを実行する必要があります。たとえば、 "event.completed"を呼び出す前に通知メッセージ/情報バーを予定に追加するコードを追加することができます。以下のサンプルコード:

function commandFunction(event) 
{ 
    Office.context.mailbox.item.notificationMessages.addAsync 
    (
     "some_unique_id_such_as_a_guid", 
     { 
      type: Office.MailboxEnums.ItemNotificationMessageType.InformationalMessage, 
      persistent: false, 
      message: "hello world", 
      icon: "default_icon" 
     }, 
     function (asyncResult) 
     { 
      // check asyncResult.status 
      // do something 
      event.completed(true); 
     } 
    ); 
} 

あなたがあなたのアプリケーションの実行に進む前に認証するユーザーのためのHTMLウィンドウを開きたいことが表示されます。その場合、 "displayDialogAsync" APIを "event.completed"の前に "commandFunction"内で呼び出すことによって使用する必要があります。これにより、認証ページのURLを指すIEウィンドウが開きます。以下のサンプルコード:

function commandFunction(event) 
{ 
    Office.context.ui.displayDialogAsync 
    (
     "https://ur/to/auth/page", 
     { 
      width: 50, 
      height: 45, 
      requireHTTPS: true 
     }, 
     function (asyncResult) 
     { 
      // check asyncResult.status 
      // do something 
      event.completed(true); 
     } 
    ); 
} 

displayDialogAsync APIのドキュメントはである:デバッグのためhttps://github.com/OfficeDev/office-js-docs/blob/master/reference/shared/officeui.md

、オープンIEは、[インターネットオプション]に移動 - > '[全般]タブ' - > '設定' をクリックしてくださいボタンをクリックして[ウェブサイトのデータ設定]ウィンドウを開きます。 [インターネット一時ファイル]タブの[新しいバージョンの保存したページを確認する]で[ウェブページにアクセスするたびに]を選択します。 OKをクリックします。

  • 無効にスクリプトのデバッグ(その他)

    • 無効にスクリプトのデバッグ(Internet Explorerなど)

    :> '設定' セクションを、次のチェックを外します -

    今すぐ[詳細]タブに移動します次に、以下を確認してください:

    • すべてのスクリプトエラーに関する通知を表示してください

    次に、「debugger;」を追加します。 "commandFunction"の最初の行に:

    function commandFunction(event) 
    { 
        debugger; 
        // add other code below... 
    } 
    

    これは、アプリケーションを実行すると、コードをデバッグするように求められます。また、Visual Studioでデバッグし、その他の問題がある場合はコードを実行することができます。

  • +0

    dialogAPIは必須であるかオプションですか?標準のwindow.openはオフィスデスクトップのコンテキストで動作しますか? – Einarsson

    +0

    私たちがしようとしていることは、あなたの連絡先(私たちのアプリから)にあなたの予定を接続することができないように、appiontmentウィンドウの右側にHTML/JS Aurelia SPAを開きます。 – Einarsson

    +0

    それをSovled、それはマニフェストファイルに問題があった、私たちはtaskpane関数を使用しようとしていた、それはcommandFunctionの解決策などではなかった。 – Einarsson

    -1

    あなたはOffice.jsへの参照を持っていません貼り付けHTML:<script src="https://appsforoffice.microsoft.com/lib/1/hosted/Office.js" type="text/javascript"></script>

    +0

    申し訳ありませんが、ファイルのは含まれていませんでした。このスクリプトは頭に含まれています。 – forsmyr

    +0

    あなたのコードはあまり単純ではありません。私は中途半端に実行されるように見える多くのものを見て、あなたがしようとしていることは本当に明確ではありません。存在しないボタンにスタイルを設定しようとしています。 Officeアドインヘルプではなく、基本的なJavaScript/HTMLヘルプが必要です。 – lgaud

    +0

    Igaud:ボタンは実行時サーバサイドで作成され、<! - login button - >プレースホルダに配置されます。このアプリケーションはWebofficeで完璧に動作しますが、唯一の問題はデスクトップモードで動作させることです。 – Einarsson

    関連する問題