在TinyMCE中自定義圖像上傳

我有一個ASP.NET Web API Web服務，我想用它來上傳文件。我這樣做的方式是客戶端發送一個JSON對象到服務http://myserver.com/api/images/upload。在TinyMCE中自定義圖像上傳

的對象將包含圖像的一個base64字符串表示，加上一些元數據，例如：

{ companyId: 12345, image: "someBase64encodedStringRepresentingTheImage" }

我想用TinyMCE的在客戶端，但我無法弄清楚如何對其進行自定義，使圖像以該格式上傳到服務器。（事實上，它似乎並不像TinyMCE的帶有圖像上傳所有）

來源

2016-04-22 msk

TinyMCE的4.2+實際上有它自己的內置工藝處理，你在編輯器中放置圖片的上傳：

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

基本過程是TinyMCE將爲插入到編輯器中的每個圖像創建一個單獨的HTTP POST。它會根據init中images_upload_url選項的設置將該圖像發送到您選擇的URL（通過HTTP POST）。

images_upload_url（您必須創建）中引用的URL處的圖像處理程序必須執行任何需要將圖像「存儲」到應用程序中的操作。這可能意味着是這樣的：一個文件夾中

存儲項Web服務器
存儲該項目上的數據庫中
存放在資產管理系統

的項目.. 。無論您選擇存儲圖像的位置，您的圖像處理程序需要返回一行JSON，以告知TinyMCE圖像的新位置。如TinyMCE文檔中所提到的，這可能如下所示：

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

TinyMCE會將圖像的src屬性更新爲您返回的值。如果您在init中使用images_upload_base_path setting，那麼它將被預置到返回的位置。

這裏的網絡是TinyMCE知道什麼時候嵌入的圖像存在於你的內容中，但它不可能知道在你的應用程序的上下文中如何處理該圖像，以便作業（「圖像處理程序」）是某種東西你必須創建。

沒有爲你寫你自己的圖像處理程序的選項，如果默認的一個是不夠的：

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

我會建議您嘗試使用，因此你不附帶TinyMCE的上傳必須編寫並維護自己的代碼（總是更容易），但如果內置代碼不合適，則可以使用自己的函數替換它。

來源

2016-04-22 15:27:20

我正在嘗試此操作，請遵循https://www.tinymce.com/docs/advanced/handle-async-image-uploads/上的所有內容，但我沒有看到瀏覽文件按鈕。還有什麼我失蹤？我已經嘗試了一些文件管理器，但是它們用於管理服務器上的文件，而我不想那樣做。我只想讓用戶上傳他們的本地文件，而不是混淆別人上傳的文件。 – AndyD273

@ AndyD273你可以在TMCE Fiddle或Codepen類型網站上發佈一些代碼嗎？很難說沒有看到任何代碼可能會出錯。 –

@ AndyD273也許你需要在你的init中添加一個'file_browser_callback'函數，這樣你就可以選擇瀏覽本地文件系統了嗎？ –

在TinyMCE中自定義圖像上傳

回答

相關問題