Vue 中的 FilePond - 自定义标题

如何解决Vue 中的 FilePond - 自定义标题

我目前正在我的应用中通过 FilePond 使用 Vue-Adapter，它运行良好。

我目前，对于这个问题，代码如下所示：

<template>
  <v-layout>
    <v-flex class="text-center">
      <FilePond
        ref="pond"
        name="file"
        chunk-uploads="true"
        :chunk-size="chunkSize"
        class-name="my-pond"
        label-idle="Drop files here..."
        :allow-multiple="allowMultiple"
        :files="myFiles"
        :server="server"
        @init="handleFilePondInit"
        @error="error"
        @processfile="updatefiles"
        @addfile="testlog"
      />
    </v-flex>
  </v-layout>
</template>

server-属性如下所示：

  computed: {
    headers() {
      return {
        Authorization: this.$auth.getToken('local'),projectId: this.projectId,};
    },server() {
      return {
        url: 'http://localhost:3001/api/filepond/',process: {
          url: 'process',headers: this.headers,},patch: {
          url: 'patch?id=',chunkSize() {
      return this.$config.chunk_size_byte;
    },

此设置运行良好。 FilePond 按预期工作，并且我的自定义标头会额外注入 FilePond 提供的标头。现在我遇到了一个问题，我还需要 process-Request 上的文件名，当 patch-Request 跟随时通常不会发送。

我找到了 this GitHub Issue，这基本上就是我的问题。

但是，如果我将计算出的 server 值更改为以下代码，则根本不会应用我的标头。

    server() {
      return {
        url: 'http://localhost:3001/api/filepond/',headers: (file,MetaData) => ({
            Authorization: this.$auth.getToken('local'),filename: file.filename,}),

解决方法

因此，在尝试了很多之后，vue-filepond 似乎存在一个错误，其中仅在使用 fileSize > chunkSize 上传文件时应用了自定义标头函数。

我打开了一个问题，Rik 暂时提供了一个解决方法 (https://github.com/pqina/vue-filepond/issues/193)。