2016-04-22 1 views
1

У меня есть веб-сервис ASP.NET Web API, который я хочу использовать для загрузки файлов. Способ, которым я это делаю, заключается в том, что клиент отправляет объект JSON в службу по адресу http://myserver.com/api/images/upload.Настройка загрузки изображений в TinyMCE

Объект будет содержать base64 строковое представление изображения, а также некоторые метаданные, например:

{ companyId: 12345, image: "someBase64encodedStringRepresentingTheImage" }

Я хотел бы использовать TinyMCE на стороне клиента, но я не могу понять, как настроить его таким образом, чтобы изображения загружались на сервер в этом формате. (На самом деле, это не похоже, TinyMCE поставляется с пользователя изображения на всех)

ответ

2

TinyMCE 4.2+ на самом деле имеет свой собственный встроенный в процесс для обработки загрузки изображений, которые вы размещаете в редакторе:

https://www.tinymce.com/docs/advanced/handle-async-image-uploads/

Основной процесс заключается в том, что TinyMCE создаст отдельный HTTP POST для каждого изображения, которое вы вставляете в редактор. Он отправит это изображение по выбранному вами URL (через HTTP POST) на основе параметра images_upload_url в вашем init.

Обработчик изображения по URL-адресу, указанному в images_upload_url (который вы должны создать), должен выполнить все, что нужно сделать, чтобы «сохранить» изображение в приложении. Это может означать что-то вроде:

  • Храните пункт в папку на вашем веб-сервере
  • магазин пункт в базе данных
  • магазин элемент в системе управления активами

.. независимо от того, где вы решили сохранить изображение, вашему обработчику изображений нужно вернуть одну строку JSON, рассказывая TinyMCE о новом местоположении изображения. Как указано в документации TinyMCE это может выглядеть следующим образом:

{ location : '/uploaded/image/path/image.png' } 

TinyMCE обновит атрибут Src в изображения к значению вашего возвращения. Если вы используете images_upload_base_path setting в init, который будет добавлен в возвращаемое местоположение.

Сеть здесь заключается в том, что TinyMCE знает, когда встроенное изображение существует в вашем контенте, но оно не может знать, что делать с этим изображением в контексте вашего приложения, чтобы работа («обработчик изображения») была чем-то вы должны создать.

Существует вариант для вас, чтобы написать свой собственный обработчик изображения, если один по умолчанию не является достаточным:

https://www.tinymce.com/docs/configure/file-image-upload/#images_upload_handler

Я бы рекомендовал пытаться использовать загрузчик, который поставляется с TinyMCE, так что вы не должны писать и поддерживать свой собственный код в будущем (всегда проще), но если встроенный код не подходит, вы действительно можете заменить его своей собственной функцией.

+1

Я пробую это, следуя всем на https://www.tinymce.com/docs/advanced/handle-async-image-uploads/, но я не вижу кнопку просмотра файлов. Есть что-то еще, что мне не хватает? Я пробовал несколько файловых менеджеров, но они предназначены для управления файлами на сервере, и я не хочу этого. Я хочу, чтобы пользователи загружали свои локальные файлы, а не файлы с файлами, которые были добавлены другими пользователями. – AndyD273

+0

@ AndyD273 Можете ли вы разместить какой-либо код на сайте TMCE Fiddle или Codepen? Трудно сказать, что может быть неправильно, не видя никакого кода. –

+0

@ AndyD273 возможно, вам нужно добавить функцию 'file_browser_callback' в ваш init, чтобы у вас была возможность просматривать локальную файловую систему? –