Надстройка встречи Office 365 Outlook не запускается

При попытке загрузить надстройку встречи Outlook возникают проблемы. Наша команда отображается в пользовательском интерфейсе ленты, и надстройка пытается запуститься, и мы можем отслеживать вызовы нашего Wev-приложения. Мы не получаем никаких ошибок, 404 или 500 при трассировке, и служба отвечает нашей первой html-страницей, содержащей текст и кнопку для инициирования нашей аутентификации.

Но после возврата html Outlook просто останавливает счетчик для надстройки, и ничего не отображается. Есть ли хорошие способы отладить это, чтобы понять, что происходит?

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>

office-addins office365 outlook-addin ms-office office-js
person forsmyr    schedule 26.05.2016    source источник

Ответы (2)


arrow_upward
3
arrow_downward

TL; DR: похоже, вы хотите открыть страницу для авторизации. Для этого используйте API displayDialogAsync.

Глядя на ваш код, я не вижу в нем ничего плохого. Более того, описанное вами поведение действительно правильно в соответствии с имеющимся у вас кодом.

Я вижу, что у вас есть функция с именем «commandFunction», которая принимает параметр «событие». Я предполагаю, что в вашем манифесте есть ExecuteFunction, которая вызывает commandFunction.

Поэтому, когда пользователь нажимает кнопку вашей надстройки в пользовательском интерфейсе ленты окна встречи, Outlook загружает вашу веб-страницу в формате html, вызывает «Office.initialize», показывает счетчик по умолчанию для вашего приложения чуть выше поля «Тема» окна окно встречи, а затем вызовите «commandFunction». Единственный код внутри этой функции - «event.completed», поэтому Outlook вызывает этот код, который в основном завершает выполнение вашего приложения, после чего Outlook удаляет счетчик по умолчанию, чтобы сигнализировать о завершении. Это именно то, что вы переживаете.

Вы должны запустить любой соответствующий код внутри "commandFunction" перед вызовом "event.completed". Так, например, вы можете добавить код, который добавит уведомление / информационную панель к встрече перед вызовом «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 для аутентификации пользователя перед продолжением выполнения вашего приложения. В этом случае вы должны использовать API «displayDialogAsync», вызывая его внутри «commandFunction» перед «event.completed». Это откроет окно IE, которое указывает на URL-адрес страницы аутентификации. Пример кода ниже:

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);
        }
    );
}

Документация по API displayDialogAsync находится по адресу: https://github.com/OfficeDev/office-js-docs/blob/master/reference/shared/officeui.md

Для отладки откройте IE, перейдите в «Свойства обозревателя» -> «Вкладка« Общие »» -> нажмите кнопку «Настройки», чтобы открыть окно «Настройки данных веб-сайта». На вкладке «Временные файлы Интернета» в разделе «Проверять наличие новых версий сохраненных страниц» выберите «Каждый раз, когда я посещаю веб-страницу». Щелкните ОК.

Теперь перейдите на вкладку «Дополнительно» -> раздел «Настройки» и снимите флажок со следующего:

  • Отключить отладку скриптов (Internet Explorer)
  • Отключить отладку скриптов (Другое)

Затем проверьте следующее:

  • Отображать уведомление о каждой ошибке скрипта

Затем добавьте «отладчик;» как первая строка в "commandFunction":

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

Это предложит вам отладить код при запуске приложения. И вы можете отлаживать в Visual Studio и просматривать свой код, если у вас есть другие проблемы.

person KwameAD    schedule 26.05.2016
comment
DialAPI - обязательное условие или вариант? Работает ли стандартный window.open в контексте рабочего стола офиса? - person Einarsson; 27.05.2016
comment
Кстати, мы пытаемся открыть HTML / JS Aurelia SPA справа в окне приложения, чтобы вы не могли связывать свои встречи с контактами (из нашего приложения). - person Einarsson; 27.05.2016
comment
Это была проблема с файлом манифеста, мы пытались использовать функцию панели задач, это не то, для чего предназначалось решение commandFunction и т. Д. - person Einarsson; 27.05.2016

arrow_upward
-1
arrow_downward

В вставленном HTML-коде нет ссылки на Office.js: <script src="https://appsforoffice.microsoft.com/lib/1/hosted/Office.js" type="text/javascript"></script>

person lgaud    schedule 26.05.2016
comment
Извините, я не включил ‹head› файла, а сценарий включен в заголовок. - person forsmyr; 26.05.2016
comment
Тогда ваш код действительно не так прост. Я вижу много вещей, которые выглядят наполовину реализованными, и не совсем понятно, что вы пытаетесь сделать. Вы пытаетесь установить стиль для кнопки, которой не существует. Вам нужна базовая справка по JavaScript / HTML, а не по надстройке Office. Начните пытаться создать минимально полный пример - person lgaud; 26.05.2016
comment
Igaud: кнопка создается на стороне сервера выполнения и помещается в поле ‹! - входа в систему -› заполнитель. Приложение безупречно работает в веб-офисе, единственная проблема - заставить его работать в режиме рабочего стола. - person Einarsson; 27.05.2016