Фон

При редактировании статей необходимо эффективно управлять связанными материалами, такими как изображения и вложения. До сих пор для этого использовалась функция загрузки редактора, что приводило к избыточности материалов: например, если загружено не то изображение, то его нельзя легко удалить. Поэтому требуется удобная система управления медиатекой. В настоящее время многие хранилища размещаются в облаке, например, OSS от Alibaba Cloud, Tencent Cloud Storage и т. д.

Введение

На основе SpringBoot и elFinder создан файловый менеджер, поддерживающий локальный диск и Alibaba Cloud и предоставляющий пример интеграции с TinyMCE5.

Настройка среды

Программное обеспечение	Версия	Функция	Адрес
SpringBoot	2.1.0.RELEASE	Универсальная структура	https://spring.io/projects/spring-boot/
elFinder	2.1.53	Веб-файловый менеджер	https://studio-42.github.io/elFinder/
TinyMCE5	5.2.0	Онлайн-редактор	https://www.tiny.cloud/

Благодарности за проект

В процессе создания проекта были использованы следующие открытые проекты:

Программное обеспечение	Адрес
elfinder-java-connector	https://github.com/trustsystems/elfinder-java-connector
spring-elfinder	https://github.com/konglinghai123/spring-elfinder

Демонстрация Демонстрация elFinder
Демо TinyMCE5

Скриншоты проекта

Тема по умолчанию

Тёмная тема

#### Функции - Создание и удаление файлов и папок, перемещение и переименование. - Онлайн-упаковка файлов. - Загрузка и скачивание файлов. - Предварительный просмотр файлов и изображений онлайн. - Обработка файлов и изображений онлайн. - Поддержка загрузки каталогов. - Поддержка распаковки и сжатия папок в формате zip, tar, gzip. - Многоформатное выделение текста и онлайн-редактирование. - Онлайн-просмотр файлов. - Настройка прав доступа к папкам. - Интернационализация. - Поддержка Alibaba Cloud OSS. - Перетаскивание между локальным диском и Alibaba Cloud OSS. - Интеграция с TinyMCE5. #### Конфигурация application.yml ``` file-manager: thumbnail: width: 80 # Ширина эскиза volumes: - Node: # Можно настроить несколько узлов source: fileSystem # Временно поддерживает только локальную файловую систему alias: Тестовый каталог # Каталог псевдонимов path: /Users/Van/Desktop/test # Отображение каталога isDefault: true # Открывать ли по умолчанию locale: constraint: locked: false # Заблокирован ли каталог readable: true # Доступен ли для чтения writable: true # Доступен ли для записи - Node: source: aliyunoss # Alibaba Cloud alias: Alibaba Cloud # Псевдоним каталога path: moore-test1 #bucketName isDefault: false # Открывать ли по умолчанию locale: constraint: locked: false # Заблокирован ли каталог readable: true # Доступен ли для чтения writable: true # Доступен ли для записи aliyunDriverConfig: endpoint: "oss-cn-beijing.aliyuncs.com" # Изменить на Endpoint адрес Alibaba Cloud #bindedDomain: "***.yourdomain.com" # Если Alibaba Cloud OSS привязан к домену, вы можете установить его здесь accessKeyId: ENC(*******) # Идентификатор accessKeyId Alibaba Cloud accessKeySecret: ENC(******) # Секрет accessKeySecret Alibaba Cloud ``` #### Проблема шифрования Конфиденциальные поля в файле конфигурации можно зашифровать с помощью инструмента PwdUitl.java в веб-проекте. #### Доступ http://127.0.0.1:8080