Поддержка старых браузеров Майкрософт и версий Office

  • Статья
  • Чтение занимает 6 мин

Важно!

Internet Explorer и устаревшая версия Microsoft Edge по-прежнему используются в надстройках Office

Некоторые сочетания платформ и версий Office, включая бессрочные версии Office 2019, по-прежнему используют элементы управления webview, которые поставляются с Internet Explorer 11 и устаревшая версия Microsoft Edge (на основе EdgeHTML) для размещения надстроек, как описано в статье Браузеры, используемые надстройками Office. . Мы рекомендуем (но не требовать), чтобы вы поддерживали эти сочетания, по крайней мере в минимальной мере, предоставляя пользователям надстройки корректное сообщение о сбое при запуске надстройки в этих веб-представлениях. Помните о следующих дополнительных моментах:

  • Office в Интернете больше не открывается в Internet Explorer или устаревшая версия Microsoft Edge. Следовательно, AppSource не тестирует надстройки в Office в Интернете в этих браузерах.
  • AppSource по-прежнему тестирует сочетания версий платформы и классических версий Office, использующих Internet Explorer и устаревшая версия Microsoft Edge. Однако он выдает предупреждение только в том случае, если надстройка не поддерживает эти браузеры. Надстройка не отклоняется AppSource.
  • Средство Script Lab больше не поддерживает Internet Explorer.

Надстройки Office — это веб-приложения, которые отображаются в IFrame при выполнении на Office в Интернете. Надстройки Office отображаются с помощью встроенных элементов управления браузера при запуске в Office в Windows или Office на Компьютере Mac. Внедренные элементы управления браузера предоставляются операционной системой или браузером, установленным на компьютере пользователя.

Если вы планируете поддерживать более старые версии Windows и Office, надстройка должна работать во внедренных элементах управления браузера, используемых этими версиями. Например, элементы управления браузера на основе Internet Explorer 11 (IE11) или устаревшая версия Microsoft Edge (на основе EdgeHTML). Сведения о том, какие сочетания Windows и Office используют эти элементы управления браузера, см. в статье Браузеры, используемые надстройками Office.

Определение браузера, в котором выполняется надстройка во время выполнения

Надстройка может обнаружить браузер, в котором она работает, прочитав свойство window.navigator.userAgent . Это позволяет надстройке либо предоставлять альтернативный интерфейс, либо корректно завершать сбой. Ниже приведен пример, определяющий, работает ли надстройка в IE11 или устаревшая версия Microsoft Edge.

if (navigator.userAgent.indexOf("Trident") !== -1) {
    /*
       IE11 is the browser in use. Do one of the following:
        1. Provide an alternate add-in experience that doesn't use any of the HTML5
           features that aren't supported in IE11.
        2. Enable the add-in to gracefully fail by adding a message to the UI that
           says something similar to:
           "This add-in won't run in your version of Office. Please upgrade either to
           perpetual Office 2021 or to a Microsoft 365 account."
    */
} else if (navigator.userAgent.indexOf("Edge") !== -1) {
    /*
       Microsoft Edge Legacy is the browser in use. Do one of the following:
        1. Provide an alternate add-in experience that's supported in Microsoft Edge Legacy.
        2. Enable the add-in to gracefully fail by adding a message to the UI that
           says something similar to:
           "This add-in won't run in your version of Office. Please upgrade either to
           perpetual Office 2021 or to a Microsoft 365 account."
    */
} else {
    /* 
       Another browser, other than IE11 or Microsoft Edge Legacy, is in use.
       Provide a full-featured version of the add-in here.
    */
}

Важно!

Обычно считывать userAgent свойство не рекомендуется. Убедитесь, что вы знакомы со статьей Обнаружение браузера с помощью агента пользователя, включая рекомендации и альтернативы для чтения userAgent. В частности, если вы предоставляете альтернативный интерфейс надстройки для поддержки использования Internet Explorer 11, рассмотрите возможность обнаружения признаков вместо тестирования агента пользователя.

По состоянию на 30 сентября 2021 г. текст в разделе Какая часть агента пользователя содержит нужные сведения? датируется до выпуска Internet Explorer 11. Это по-прежнему в целом точно, и таблицы в разделе английской версии статьи актуальны. Аналогичным образом текст и в большинстве случаев таблицы в версиях статьи, отличных от английского, устарели.

Просмотр сведений о поддержке браузеров и версий Office

Чтобы получить дополнительные сведения о поддержке определенных браузеров и версий Office, перейдите на соответствующую вкладку.

Важно!

Internet Explorer 11 не поддерживает некоторые функции HTML5, такие как мультимедиа, запись и расположение. Если надстройка должна поддерживать Internet Explorer 11, необходимо либо разработать надстройку, чтобы избежать этих неподдерживаемых функций, либо надстройка должна определить, когда используется Internet Explorer, и предоставить альтернативный интерфейс, который не использует неподдерживаемые функции. Дополнительные сведения см. в разделе Определение браузера, в котором выполняется надстройка во время выполнения.

Поддержка последних версий JavaScript

Internet Explorer 11 не поддерживает версии JavaScript, более поздние, чем ES5. Если вы хотите использовать синтаксис и функции ECMAScript 2015 или более поздней версии или TypeScript, у вас есть два варианта, как описано в этой статье. Вы также можете объединить эти два метода.

Использование транспилера

Вы можете написать код в TypeScript или современном JavaScript, а затем транспилировать его во время сборки в ES5 JavaScript. Полученные файлы ES5 передаются в веб-приложение надстройки.

Есть два популярных транспилеров. Оба они могут работать с исходными файлами, которые являются TypeScript или JavaScript после ES5. Они также работают с файлами React (JSX и TSX).

Сведения об установке и настройке транспилировщика в проекте надстройки см. в документации по любой из них. Для автоматизации транспиляции рекомендуется использовать средство выполнения задач, например Grunt или WebPack . Пример надстройки, использующий tsc, см. в статье Надстройка Office Майкрософт Graph React. Пример, в котором используется babel, см. в статье Надстройка автономного хранилища.

Примечание.

Если вы используете Visual Studio (не Visual Studio Code), tsc, вероятно, проще всего использовать. Вы можете установить поддержку для него с помощью пакета nuget. Дополнительные сведения см. в статье JavaScript и TypeScript в Visual Studio 2019. Чтобы использовать babel с Visual Studio, создайте скрипт сборки или используйте обозреватель средства выполнения задач в Visual Studio с такими инструментами, как Средство выполнения задач WebPack или Средство выполнения задач NPM.

Использование полизаполнения

Polyfill — это Более ранняя версия JavaScript, которая дублирует функциональные возможности более поздних версий JavaScript. Polyfill работает в браузерах, которые не поддерживают более поздние версии JavaScript. Например, строковый метод startsWith не входит в версию JavaScript ES5 и поэтому не будет выполняться в Internet Explorer 11. Существуют библиотеки polyfill, написанные на ES5, которые определяют и реализуют startsWith метод. Рекомендуется использовать библиотеку polyfill core-js .

Чтобы использовать библиотеку polyfill, загрузите ее, как и любой другой файл или модуль JavaScript. Например, можно использовать <script> тег в HTML-файле домашней страницы надстройки (например <script src="/js/core-js.js"></script>, ) или import оператор в файле JavaScript (например, import 'core-js';). Когда обработчик JavaScript видит такой метод, как startsWith, он сначала посмотрит, есть ли метод с таким именем, встроенный в язык. Если это так, он вызовет собственный метод. Если метод не является встроенным и только если он не является встроенным, подсистема будет искать его во всех загруженных файлах. Таким образом, полизаполненные версии не используются в браузерах, поддерживающих собственную версию.

Импорт всей библиотеки core-js приведет к импорту всех функций core-js. Вы также можете импортировать только те polyfills, которые требуются надстройке Office. Инструкции о том, как это сделать, см. в разделе Api CommonJS. Библиотека core-js содержит большинство необходимых полизаполнения. Существует несколько исключений, подробно описанных в разделе Отсутствующие Polyfills документации core-js. Например, он не поддерживает fetch, но можно использовать выборку polyfill.

Пример надстройки, использующий core.js, см. в статье Надстройка Word Angular2 StyleChecker.

Тестирование надстройки в Internet Explorer

См. статью Тестирование Internet Explorer 11.

См. также