JWT header in Vue-FilePond

Question

I'm looking for a way to update the settings (options) dynamically in Vue-FilePond. It is setup as following in my component:

import store from '@/store'
import vueFilePond from 'vue-filepond'

export default {
  name: 'MyComponent',
  components: {
    FilePond
  },
  data: function () {
    return {
      ...
      serverOptions: {
        url: 'https://my.backend/',
        process: {
          url: './process/',
          headers: {
            Authorization: 'Bearer ' + this.getToken(),
            'x-access-token': this.getToken()
          }
        },
        // other endpoints are configured in the same way
      },
      ...
  },
  methods: {
    getToken: function () {
      return store.state.access_token
    },
    ...
  }

As you might see, my token is stored in Vuex. I also tried to set the header without the method:

    process: {
      url: './process/',
      headers: {
        Authorization: 'Bearer ' + store.state.access_token,
        'x-access-token': store.state.access_token
      }
    },

This doesn't work either. I also tried to set the serverOptions in computed

computed: {
  ...mapState({
    token: state => state.access_token
  }),
  serverOptions () {
    process: {
      url: './process/',
      headers: {
        Authorization: 'Bearer ' + this.token,
        'x-access-token': this.token
      }
    }
  }
}

without any success either. This seems to update the data in my component and Vue-FilePond but doesn't reflect in FilePond xhr calls.

My issue is that the token expires and, let's say if I send a very big file, the patch calls will start to get an HTTP 401. The token is updated before expiring but I can't seem to find a way to pass that to FilePond.

Anyone with an idea would be greatly appreciated.

Thanks

//Geo