Question

我已经设置了一个端点，该端点根据我创建的DateFilter返回一个特定的数据。并且当使用？format = xlsx 时，它会根据请求的DateFilter下载带有特定数据列表的xlsx文件。通过在searchCarriers中传递url，我也完成了前端的搜索功能，现在唯一缺少的是在前端有可下载的xlsx。我该怎么办？

这是我的DateFilter

class CarrierFilter(django_filters.FilterSet):
    date_app_rec__gte = DateFilter(field_name='date_app_rec', lookup_expr='gte')
    date_app_rec__lte = DateFilter(field_name='date_app_rec', lookup_expr='lte')
    date_sample_rec__gte = DateFilter(field_name='date_sample_rec', lookup_expr='gte')
    date_sample_rec__lte = DateFilter(field_name='date_sample_rec', lookup_expr='lte')
    date_of_qca__gte = DateFilter(field_name='date_of_qca', lookup_expr='gte')
    date_of_qca__lte = DateFilter(field_name='date_of_qca', lookup_expr='lte')
    date_created__gte = DateFilter(field_name='date_created', lookup_expr='gte')
    date_created__lte = DateFilter(field_name='date_created', lookup_expr='lte')
    patient_name = CharFilter(field_name='patient_name', lookup_expr='icontains')

    class Meta:
        model = Carrier
        fields = ('date_app_rec__gte', 'date_app_rec__lte', 
                'date_sample_rec__gte', 'date_sample_rec__lte',
                  'date_of_qca__gte', 'date_of_qca__lte',
                  'date_created__gte', 'date_created__lte',
                  'patient_name',)

这是我的ModelViewSet

class CarrierViewSet(XLSXFileMixin, ModelViewSet):
    queryset = Carrier.objects.all()
    serializer_class = CarrierSerializer
    permission_classes = (IsAuthenticated,)
    parser_classes = (MultiPartParser,) #  for uploading of attachments
    filename = 'carrier-reports.xlsx'
    filter_class = (CarrierFilter)  # filtering From date and To date
    filterset_fields = ('patient_name', 'promo_code')
    search_fields = ('patient_name', 'promo_code', 'insurance_verified_tsg_verification')

这将返回前端表中的所有特定日期

searchCarriers: function () {
      // Search function
      api_url = `/api/v1/carrier/?date_app_rec__gte=${this.carrier_from_date_app_rec}&date_app_rec__lte=${this.carrier_to_date_app_rec}&date_sample_rec__gte=${this.carrier_from_date_sample_rec}&date_sample_rec__lte=${this.carrier_to_date_sample_rec}&date_of_qca__gte=${this.carrier_from_date_of_qca}&date_of_qca__lte=${this.carrier_to_date_of_qca}&date_created__gte=${this.carrier_from_date_created}&date_created__lte=${this.carrier_to_date_created}&patient_name=${this.carrier_search_patient_name}`
      this.searching = true;
      this.$http.get(api_url)
        .then((response) => {
          this.carriers = response.data;
          this.searching = false;
        })
        .catch((err) => {
          this.searching = false;
          console.log(err);
        })
    },

Answer 1

您可以通过使用GET来请求URL 但您必须照顾自己在做什么

前端： 使用download属性

 this.$http.get(api_url)
    .then((response) => {
     let a= document.createElement('A')
     a.href= response.data
     a.download = true
     document.body.appendChild(a)
     a.click()
    }

如果您不想出现，可以通过CSS display:none或opacity:0

进行管理

后端：

您必须添加到数据或作为响应标题提供的链接标题Content-Disposition

Content-Disposition: 'attachment'  // for example

有没有一种方法可以在API端点中发送GET请求给xlsx，以供vuejs使用？

1 个答案: