Настройка tinymce с облачным в html и javascript

Question

Я прочитал файл readme на https://github.com/cloudinary/cloudinary_tinymce, но все еще не могу понять, как это сделать.Кроме того, они делают это на Ruby on Rails, что не очень помогает.

Мне действительно нужно создавать конечную точку на стороне сервера?Он запрашивает только подписанный URL.Но мне не нужно, чтобы это было подписано.Как мне сделать это только с помощью JavaScript и HTML?Я не хочу ничего делать на моем сервере, кроме как отрисовывать шаблоны.

edit: я пробовал с image_upload handler, и он загружается в мой облачный аккаунт.Но он не даст мне URL для изображения при успешной загрузке (я ожидаю получить что-то вроде https://res.cloudinary.com/strova/image/upload/v1527068409/asl_gjpmhn.jpg).Вот мой код:

images_upload_handler: function (blobInfo, success, failure) {
            var xhr, formData;

            xhr = new XMLHttpRequest();
            xhr.withCredentials = false;
            xhr.open('POST', 'https://api.cloudinary.com/v1_1/strova/upload');

            xhr.onload = function () {
                var json;

                if (xhr.status !== 200) {
                    failure('HTTP Error: ' + xhr.status);
                    return;
                }

                json = JSON.parse(xhr.responseText);



                success(json.location);
            };

            formData = new FormData();
            formData.append('file', blobInfo.blob(), blobInfo.filename());
            formData.append('upload_preset', cloudinary_upload_preset);

            xhr.send(formData);
        }

Answer 1

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

images_upload_handler: function (blobInfo, success, failure) {
            var xhr, formData;

            xhr = new XMLHttpRequest();
            xhr.withCredentials = false;

//restricted it to image only using resource_type = image in url, you can set it to auto for all types 

            xhr.open('POST', 'https://api.cloudinary.com/v1_1/<yourcloudname>/image/upload');

            xhr.onload = function () {

                if (xhr.readyState == 4 && xhr.status == 200) {
                    var response = JSON.parse(xhr.responseText);
                    var url = response.secure_url; //get the url 
                    var json = {location: url}; //set it in the format tinyMCE wants it
                    success(json.location);
                }
            };

            formData = new FormData();
            formData.append('file', blobInfo.blob(), blobInfo.filename());
            formData.append('upload_preset', '<YourUnsignedUploadPreset>');

            xhr.send(formData);
        }

Answer 2

Попробуйте "подделать" POST-запрос для одного.Я все еще пытаюсь.Чтобы выяснить, почему документация «требует» POST-запроса.Пример PHP: https://www.tinymce.com/docs-3x//TinyMCE3x@Installation/ просто возвращает то, что отправлено на сервер.Плагин должен быть интерполирован опубликовано содержание.