[Vuejs]-Filepond add auth header before rendering the image

by

0👍

This is what you are looking for.
In order to render remote image url, you need to supply it with extra image properties, in this case local.

Read here in details – https://pqina.nl/filepond/docs/api/instance/properties/#files

<file-pond
    ref="file"
    name="filepond"
    :label-idle="placeholder"
    accepted-file-types="image/jpeg, image/png"
    drop-validation="true"
    style-panel-layout="compact circle"
    style-button-remove-item-position="center bottom"
    style-panel-aspect-ratio="1:1"
    :allow-image-crop="true"
    image-crop-aspect-ratio="1:1"
    :files="[
      {
        source: 'http://your-image-url',
        options: {
           type: 'local'
        }
      }
    ]"
    :server="{
      url: 'http://192.168.0.100',

      load: {
        url: './process',
        method: 'GET',
        headers: {
          'x-customheader': 'Hello World'
        },
        withCredentials: false
      }
    }"
  />

Leave a comment