Загрузка локальных изображений TinyMCE на другой сервер с сервера, на котором размещен TinyMCE: все ссылки на http теряются - PullRequest
0 голосов
/ 10 марта 2020

Я загружаю локальные изображения на удаленный сервер, используя TinyMCE images_upload_handler. Это работает нормально, то есть изображение загружено, но HTML, который возвращает TinyMCE, не будет принимать любую ссылку src, содержащую http. Я интегрирую TinyMCE как часть Keystone JS, так что, возможно, в соединении есть что-то, что очищает HTML, но я немного озадачен.

Мой images_upload_handler равен

images_upload_handler: function (blobInfo, success, failure) {
                                        var xhr, formData;
                                        console.warn('!!!!');
                                        xhr = new XMLHttpRequest();
                                        xhr.withCredentials = false;
                                        xhr.open('POST', 'http://localhost:4545/tinymceimage');

                                        xhr.onload = function() {
                                            var json;

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

                                            json = JSON.parse(xhr.responseText);

                                            if (!json || typeof json.location != 'string') {
                                                failure('Invalid JSON: ' + xhr.responseText);
                                                return;
                                            }
                                            console.log('json.location',json.location);
                                            success(json.location);
                                        };

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

                                        xhr.send(formData);
                                    }

и мой обработчик сервера

app.post('/tinymceimage', function tinyMCEUpload(req, res) {
    console.log('files', req.files);
    if (!req.files || Object.keys(req.files).length === 0) {
        return res.status(400).send('No files were uploaded.');
    }

    // The name of the input field (i.e. "sampleFile") is used to retrieve the uploaded file
    let sampleFile: UploadedFile = req.files.file as UploadedFile;

    // Use the mv() method to place the file somewhere on your server
    console.log(sampleFile.name);
    const out = path.resolve(__dirname, '../../static_files', sampleFile.name);

    fs.writeFile(out, sampleFile.data, 'base64', function(err) {
        if (err) console.log(err);
        if (err) res.send(err);
        res.json({ location: `http:localhost:4545/${sampleFile.name}` });

    });

});

, но HTML, возвращаемый из TinyMCE, не содержит правильных изображений sr c, например, НЕ

<img src="http://localhost:4545/blop.jpg" />,

а точнее

<img src="../../blop.jpg" />

Если я изменю

        res.json({ location: `http:localhost:4545/${sampleFile.name}` });

на

        res.json({ location: `something/${sampleFile.name}` });

Я получу

<img src="something/blop.jpg" />

Я в тупике, но, вероятно, упускаю очевидное. Любая помощь высоко ценится!

...