Upload Image

[espositodaniele]

Hello,

how we can manager uploap image?
The docs from unlayer says that we need to add a callbacks like the this:

unlayer.registerCallback('image', function(file, done) {
  var data = new FormData()
  data.append('file', file.attachments[0])

  fetch('/uploads', {
    method: 'POST',
    headers: {
      'Accept': 'application/json'
    },
    body: data
  }).then(response => {
    // Make sure the response was valid
    if (response.status >= 200 && response.status < 300) {
      return response
    } else {
      var error = new Error(response.statusText)
      error.response = response
      throw error
    }
  }).then(response => {
    return response.json()
  }).then(data => {
    // Pass the URL back to Unlayer to mark this upload as completed
    done({ progress: 100, url: data.filelink })
  })
})

How can we add this feature?

Many thanks

[alies-dev]

That's currently not possible. PRs are very welcome to implement this

[alies-dev]

Hey @espositodaniele

What exactly do you want to implement for images? I'm exploring options how to improve the package, your input is very welcome.

[espositodaniele]

What I've done is to upload photo that are sorted on my server, and at the moment it is not configurable.

I needed to force the plug-in directly from .vue files.

Would be helpful to have an option to indicate our root folder where to place image and then provide that information to the api that store image.

Here is the code I've added to your UnlayerEditor.vue

window.unlayer.registerCallback('image', (file, done) => {
    let data = new FormData();
    data.append('file', file.attachments[0]);
    fetch('/api/upload-unlayer', {
        method: 'POST',
        headers: {
            'Accept': 'application/json',
            'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
        },
        body: data
    }).then(response => {
        // Make sure the response was valid
        if (response.status >= 200 && response.status < 300) {
            return response.json()
        }
        let error = new Error(response.statusText);
        error.response = response;
        throw error
    }).then(data => done({progress: 100, url: data.url}))
});

[alies-dev]

guys, do you meth this upload functionality?

Also, I couldn't find any documentation for image callback/event, can you please provide some?