Работа с ресурсами. Управление картинками, документами на сайте
Управление ресурсами
Ресурс - это фото или документ, прикрепленный к некой сущности (по entityCode и itemID).
Компонент дает возможность вывести галерею ресурсов (фото или документы), возможность редактировать их и возможность загрузить новые ресурсы.
Ресурсы крепятся к некоторым сущностям (entityCode). О том как получить ссылку на ресурс можно ознакомиться здесь, о том как загружать файл, когда задействовано диалоговое окно читать здесь.
Вывод и функции зависят от 2 режимов:
isSingle - определяет будет ли привязываться 1 ресурс для данной сущности (например аватар человека) или целая коллекция ресурсов.
read/write - может ли пользователь управлять коллекцией ресурсов (загружать, редактировать, удалять) или нет.
Создание ресурса
1.Добавляем на страницу сниппет компонента:
<div class="as-resourceManager" data-code="{typeCode}" data-itemid="falcon-space--rabota-s-resursami"></div>
2. В меню "Компоненты" выбираем "Типы ресурсов", далее нажимаем кнопку "Добавить" и вводим код ресурса (имя).
Также здесь стоит упомянуть и о загрузке файлов с drop областью и гибкой разметкой (загрузка файлов путем перетаскивания их на нужную область страницы сайта, а также без использования дополнительного диалогового окна). Сниппет компонента:
<div class="as-files" data-code="productImages" data-itemid="5" data-disabledeleteconfirm="1" data-successmsg=" "></div>
Настройка ресурса
Код - код типа ресурса (используется в сниппете)
Код объекта - код некоего объекта в системе (не привязан жестко к какой-то таблице).
Не путайте код сущности (Товар) и код Типа ресурса (настройка как будет работать компонент).
К одной сущности может быть в итоге привязано несколько типов ресурсов.
Роли на чтение - кто может просматривать картинки (через запятую без пробелов. Если указано all - то доступ имеют все. Если * - то только авторизованные пользователи).
Роли на запись - Кто может загружать и редактировать записи (через запятую без пробелов. Если указано all - то доступ имеют все. Если * - то только авторизованные пользователи). Также о об установке прав доступа на менеджер ресурсов можно почитать здесь.
Галка Одиночная картинка - если Да, то работаем только с 1 ресурсом для сущности.
Галка Показывать настройки загрузки - отображать при Upload дополнительные опции загрузки (для картинок).
Возможность загрузки - если Да, то можно будет загружать файлы (для ролей на загрузку).
Показать сразу в полный размер - если Да, то в менеджер грузятся сразу полноразмерные картинки а не thumb.
Загружать без трансформации (LoadWithoutTransform). Если да - то картинки не меняют размеров при загрузке. Также эта настройка влияет на обработку имен файлов. Если она стоит Да, то имя файла никак не обрабатывается (через dbo.str_processURL для исключения различных спецзнаков и транслитерации).
Показать галерею - если да, то можно будет просматривать список ресурсов.
Максимальный размер файла в МБ - насколько большой файл можно загружать. Внимание! Есть системное ограничение на файлы в 12Мб.
Фильтр для файлов - регулярное выражение на фильтрацию файлов (Regex).
Высота и ширина картинки - задает прямоугольник, в который должно быть вписано изображение.
Высота и ширина миниатюры - задает прямоугольник, в который должно быть вписано thumb изображения.
Отношение для обрезки - соотношение сторон для ручного обрезания фото (как загружать фото с обрезкой можно почитать здесь).
Картинка по умолчанию - путь к фото, которое будет показываться когда нет элементов для отображения в менеджере.
Водяной знак - URL путь к картинке водяного знака (будет ставить посередине каждого изображения при Upload).
Внимание! Не влияет при установке на уже ранее загруженные изображения.
Качество сохранения картинок - качество сохранения картинки от 10 до 100.
Добавлять поля к картинке (и миниатюре) при загрузке - при несовпадении пропорций и размеров картинка будет дополняться белыми полями.
Путь сохранения - указывается некий путь в /uploads к файлу или папке. Если папка, то в нее будет сохраняться файл со своим именем.
Если файл - то имя файла будет жестко определено этим параметром. Например: если указали /docs, то сохранение файлов будет идти в /uploads/docs/
Дополнительные параметры сниппета ресурсов (as-resourceManager):
-
data-title="Товар 1" - задаем внешнюю подпись у картинки. Если не указано, то используется подпись, связанная с ресурсом (по умолчанию это имя файла).
Это поле также используется в заголовке диалогового окна (при показе полноэкранной картинки). -
data-hideTitle="1" - скрываем подпись у картинки (находится под картинкой).
- data-hideLinks = "1" - скрываем ссылки в режиме редактирования.
-
data-link="/product/1" - если задана ссылка, то при клике на картинку идет переход по данной ссылке. Если нет ссылки - то показ полной картинки в диалоговом окне.
-
data-carouselEnabled="1" - если указано 1, то при нажатии на картинку будет показываться слайдер из картинок в диалоговом окне.
-
data-bigFirst="1" - если 1, то первая картинка в показе будет большой, а все остальные маленькие (например, для использования на странице товара).
-
data-compact="1" - если 1, то галерея картинок (или документов) будет показана в уменьшенном виде.
-
data-ultracompact="1" - если 1, то галерея картинок (или документов) будет показана в очень уменьшенном виде. Обычно используется для вывода в таблицах.
-
data-emptyText="Нет фото" - Если нет элементов, то будет показана эта надпись. Если пробел - то не выводится сообщение, что нет элементов.
-
data-uploadTitle - задает заголовок окна загрузки файлов.
- data-hideEmpty - если равно 1 и совсем нет элементов, то всему компоненту ставится класс hide.
- data-progressStyle - стилизация полоски прогресса - заменяет стилизацию в элементе .progress-bar. Пример:
progress-bar-striped bg-success. https://getbootstrap.com/docs/4.0/components/progress/
- data-immediateSelectFile="" - если 1, то при нажатии на кнопку Загрузить появляется модальное окно и автоматически нажимается кнопка Выбор файлов.
- data-downloadArchive="1" - если 1, то будет кнопка скачивания всех файлов через упаковку в zip (обновление сентябрь 22). Аналогичная настройка есть у as-files.
Специальные настройки в /settings
- "resource.blockExtensions", по умолчанию - ".js,.html,.htm,.asp,.php,.aspx" - файлы с какими разрешениями нельзя пропускать (иначе возникает риск атаки XSS - злоумышленник загружает файл со скриптами, а пользователь открывает его)
- "resource.maxFilenameLength", по умолчанию "160", максимальная длина названия файла (у операционной системы сервера может быть ограничение на длину пути к файлу).
- "resource.disableProcessName", по умолчанию "0" - если 1, то имя файла не будет обрабатываться через dbo.[str_processURL] (по умолчанию имена файлов обрабатываются, чтобы в URL к файлу не было спецсимволов).
Дополнительные действия после выполнения операции с ресурсами
Вы можете выполнить некоторые действия после загрузки (upload), удаления (delete) или обновления полей ресурса (edit).
Для этого необходимо реализовать процедуры rs_{entityCode}_{action}_callback (редактировать их можно будет в управлении типами ресурсов).
action - upload, delete, edit.
На вход принимает: typeCode(тип ресурса), itemID, resourceID (если загрузка нескольких файлов - то первый файл), username.
На выходе:
SELECT 1. ResultModel(Result, Msg, Actions). Actions позволяют сделать некоторые действия в браузере (например, обновить часть экрана).
SELECT 2. Вызов внешних действий.
Примечание
-
Файлы хранятся в папке /uploads/rs/{entiyCode}/{itemID}
-
Не путайте entityCode (код сущности, например product) и typeCode (настройки вывода компонента, например manageProdyctImages)
-
Если необходимо проверить права доступа дополнительно (на основе itemID), то необходимо создать хранимую процедуру с именем rs_{entityCode}_hasAccess.
На входе typeCode, username, itemID, right (read or write). На выходе - модель ResultModel (поля Result bit, Msg nvarchar(256)). Управление процедурой есть на странице управления компонентом. -
Для не картинок используются типовые иконки типов - pdf, excel, word, text и other.
-
Вы можете установить по умолчанию картинку для варианта, когда не загружено ресурсов.
Для этого прописываем путь к картинке в параметре defaultImagePath для ResourceType. -
Вы можете обрезать картинки. Установите в пикселях для типов ресурсов Width и Height. Картинка в итоге впишется в этот прямоугольник по размерам и сохранится в jpg.
-
Для картинок также сохраняется thumbUrl. Его размеры управляются через тип ресурса - thumbWidth, thumbHeight.
Для других типов в роли превью выступает значок типа файла. -
Для получения URL картинки в SQL можно использовать функцию [dbo].[rs_resourceLink] (entityCode, itemID, isThumb)
SELECT [dbo].[rs_resourceLink] ('product', 1014, 0)
Также по теме:
- как вставить менеджер ресурсов в форму с нужным itemID
- массовая загрузка картинок в систему ресурсов
- как поставить фильтр на типы файлов и как ограничить форматы загрузки картинок.
Возможные проблемы и их решения:
Google поиск по нашей документации
- Руководства
- Основа Falcon Space
- Основные компоненты
- Возможности
- Коммуникация с пользователем
- Дизайн, стилизация, юзабилити
- Лендинги
- Универсальный API
- Примеры интеграций
- Каталоги
- Навигация
- Документы
- Дополнительные компоненты
- Продвижение, SEO
- Системные моменты
- Системное администрирование
- HOWTO
- Таблицы
- Формы
- Загрузка файлов, картинок Работа с ресурсами. Управление картинками, документами на сайте Таблицы. Как сделать в колонке таблицы управление файлами (картинками или документами) Как увеличить размер подгружаемых файлов (как загружать большие файлы) Передача файлов по FTP Подгружаемые файлы Не грузится файл через менеджер ресурсов Поддержка Webp формата для оптимизации картинок Файлы загружаются на сервер, но при скачивании выходит ошибка 404.3 (загрузка ODT, Проблема с MIME типами) Массовая оптимизация картинок в менеджерах ресурсов Не выводятся картинки на сайте (401, 403 ошибка при загрузке картинок) Загрузка на форме текстовых файлов и обработка их в процедуре SaveItem Как установить JS callback после выполнения crop картинки Загрузка файлов с drop областью и гибкой разметкой (компонент as-files) Не отображается картинка юзера справа вверху Как изменить текст когда нет загруженных картинок в компонентеas-resourceManager? Обработка спецсимволов в названии файлов (чтобы не было проблем со скачиванием) Управление файлами на сервере (файловый менеджер) Как поставить водяной знак на картинку при загрузке Как приводить картинки к заданным размерам при загрузке на сайт Как оптимизировать качество картинок при загрузке на сайт Чем отличается код типа ресурса от типа объекта Как создавать для загружаемой картинки копии с разными размерами Как загружать файл, когда задействовано диалоговое окно Как загрузить файл по конкретному пути Как получить ссылку на ресурс Как установить права доступа на менеджер ресурсов? Как сделать возможность грузить только 1 фото Как поставить фильтр на типы файлов, как ограничиь форматы загрузки картинок? Как искать битые ресурсы, картинки Как дополнительно обработать событие после удаления или добавления фоток Как загружать фото с обрезкой Не выводятся картинки в менеджере ресурсов. Что делать? Как вставить менеджер ресурсов в форму с нужным itemID Массовая загрузка картинок в систему ресурсов Подбор оптимальных параметров менеджера ресурсов
- Работа с SQL
- HOWTO JS
- HOWTO Верстка
- Решение проблем
Выгода от использования Falcon Space
В 2-3 раза экономнее и быстрее, чем заказная разработка
Более гибкая, чем коробочные решения и облачные сервисы
Используйте готовые решения и изменяйте под свои потребности
- Шаг 1. Создать концепт проекта
- Шаг 2. Получить оценку бюджета (КП)
- Шаг 3. Заключить договор
- Шаг 4. Создать совместно техническое задание
- Шаг 5. Поэтапная реализация проекта