How to get File type object from url (image) in vuejs

Question

I do have an image url lets say http://localhost/sample.jpg. i want to save this image url into a File object type as my component created. how can i achieve this with native js api?

export default {
  created () {
    const imageUrl = 'http://localhost/sample.jpg'
    const file = this.getFileFromUrl(imageUrl)
  },
  methods: {
    getFileFromUrl (url) {
      // ... what should i return?
    }
  }
}

User 28 · Accepted Answer · 2020-10-19 07:53:12Z

3

One of the simple ways to do this is using fetch.

let url = '...'

fetch(url)
  .then(response => response.blob())
  .then(blob => {
    ...
  })

After you have blob you can convert it to file. See How to convert Blob to File in JavaScript.

Example

answered Oct 19, 2020 at 7:53

User 28

5,1781 gold badge22 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to get File type object from url (image) in vuejs

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related