QR Code Generator Введение
QR-код — кратчайший путь с экрана или печатного листа в смартфон: ссылка на документ, контактные данные сотрудника, доступ к гостевой сети Wi-Fi, приглашение на мероприятие. Обычно такие коды создают на общедоступных сайтах, а значит, внутренняя ссылка, номер телефона или пароль сети вводятся в сервис, который в компании никто не контролирует. QR Code Generator переносит эту задачу в SharePoint: код строится в браузере пользователя, на странице вашей собственной интрасети.
QR Code Generator — это веб-часть SharePoint Framework для современных страниц SharePoint Online и Microsoft Teams. В этой статье представлено решение: где оно работает, что видит пользователь, какие данные можно закодировать, как оформить код и как забрать результат со страницы.
Где работает QR Code Generator
QR Code Generator развёртывается в клиенте Microsoft 365 из каталога приложений одним пакетом и становится доступной на каждом сайте клиента. Веб-часть можно разместить:
- на любой современной странице — странице сайта, новостной записи или домашней странице, в обычном разделе или в разделе во всю ширину;
- на странице приложения с одной веб-частью, где генератор является единственным содержимым страницы;
- в виде вкладки канала Microsoft Teams или личного приложения в Teams.
Веб-часть следует теме сайта, включая тёмные темы и цветовые варианты раздела страницы. Её интерфейс доступен на 50 языках, которые выбираются автоматически по языку пользователя.
📝 Заметка
QR Code Generator поддерживает только современные страницы. Добавить её на классические страницы нельзя.
Что видит пользователь
Веб-часть состоит из двух областей. Слева расположены вкладки данных — по одной на каждый тип данных — и под ними семь сворачиваемых разделов оформления: Фигура, Логотип, Цвета, Corner Square, Corner Dots, Error Correction и Size. Справа находится область предварительного просмотра QR-код с тремя кнопками: Обновить, Копировать и Скачать.
Изображение перестраивается после каждого изменения, поэтому пользователь видит результат прямо во время ввода. Если обязательное поле выбранной вкладки пусто, вместо кода выводится сообщение о том, что одно или несколько обязательных полей не заполнены, а кнопки недоступны, пока поле не будет заполнено.
Все настройки генератора находятся в самой веб-части. Область свойств содержит только группу Информация со сведениями о лицензии.
Типы данных
Веб-часть кодирует девять типов данных. Тип определяется вкладкой, а что делать с отсканированным кодом, смартфон решает по его содержимому.
| Вкладка | Что кодируется | Что происходит после сканирования |
|---|---|---|
| URL-адрес | Адрес веб-страницы | Страница открывается в браузере |
| Text | Любой обычный текст | Текст выводится на экран |
| vCard | Визитная карточка: имя, телефоны, электронная почта, организация, отдел, должность, веб-сайт и почтовый адрес | Телефон предлагает добавить новый контакт в адресную книгу |
| Wi-Fi | Имя сети, пароль, тип шифрования и признак скрытой сети | Телефон подключается к сети |
| Электронная почта | Получатель, тема и текст сообщения | Открывается почтовое приложение с подготовленным письмом |
| SMS | Номер телефона и текст сообщения | Открывается приложение сообщений с подготовленным текстом |
| Телефон | Номер телефона | Телефон предлагает позвонить по номеру |
| Location | Широта и долгота | Точка открывается в приложении карт |
| Event | Название, место, начало и окончание | Телефон предлагает добавить событие в календарь |
Поля каждой вкладки описаны в статье KB10264. Типы данных QR-кода: URL-адрес, текст, vCard, Wi-Fi, электронная почта, SMS, телефон, местоположение и событие.
Оформление
Код, созданный веб-частью, не обязан быть чёрно-белым. Разделы оформления позволяют привести его в соответствие с фирменным стилем:
- Фигура — шесть стилей точек, из которых состоит код; каждый показан картинкой;
- Цвета — цвет точек и цвет фона, оба с прозрачностью, и необязательный двухцветный градиент, линейный или радиальный;
- Corner Square и Corner Dots — форма и цвет трёх меток позиционирования в углах кода;
- Логотип — логотип компании в центре кода с настраиваемыми размером и отступом;
- Error Correction — какая часть кода может быть повреждена или закрыта без потери читаемости;
- Size — размер скачиваемого изображения, от 300 до 4000 пикселей.
См. статьи KB10265. Настройка оформления QR-кода: форма, цвета, градиент и углы и KB10266. Как добавить логотип компании в QR-код.
Получение результата
Кнопка Скачать сохраняет код в файл одного из четырёх форматов: PNG, JPEG, SVG или WebP. SVG — векторный формат, его можно печатать в любом размере без потери качества. Кнопка Копировать помещает код в буфер обмена как изображение PNG, готовое для вставки в письмо, документ или презентацию. Подробности — в статье KB10267. Скачивание и копирование QR-кода: PNG, JPEG, SVG и WebP.
Конфигурация сохраняется вместе со страницей
Всё, что настроено в веб-части во время редактирования страницы, — выбранная вкладка, введённые данные, цвета, форма точек, логотип и размер — сохраняется вместе со страницей. Автор страницы готовит код один раз, например для гостевой сети Wi-Fi в переговорной, и каждый посетитель страницы сразу видит этот код. См. статью KB10268. Публикация готового QR-кода на странице SharePoint.
Конфиденциальность
QR-код создаётся целиком в браузере. Данные, которые вводит пользователь, — пароли, контакты, координаты — не отправляются для генерации во внешний сервис. Пакет не запрашивает дополнительных разрешений API, поэтому на странице Доступ к API центра администрирования SharePoint ничего утверждать не нужно.
❗ Важно
Конфигурация, сохранённая вместе со страницей, хранится в свойствах веб-части в виде обычного текста. Любой, кто может открыть страницу, может прочитать сохранённые данные, включая пароль Wi-Fi. Публикуйте коды с конфиденциальными данными только на страницах с подходящей аудиторией.
Лицензирование
QR Code Generator устанавливается с пробным периодом. Группа Информация в области свойств показывает Состояние лицензии, Версию веб-части, Дату начала подписки и Клиент, которому она назначена. По окончании пробного периода веб-часть показывает уведомление вместо генератора, пока подписка не будет активирована.
Следующие шаги
💡 Совет
О развёртывании пакета, размещении веб-части на странице и создании первого кода см. статью KB10263. Как добавить QR Code Generator на страницу и создать первый QR-код.