Reactjs 通过react/axios从spring获取请求查看pdf

我有一个spring端点，它将pdf作为字节[]，还有一个React ui，当我尝试调用端点时，它会得到406

弹簧端点：

@GetMapping(value = "report/{report_id}", produces = MediaType.APPLICATION_PDF_VALUE)
    public ResponseEntity<InputStreamResource> generateReviewTaskReport(
            HttpServletResponse response,
            @PathVariable("report_id") String reportId,
            @RequestAttribute(USER_ID) String loginId) {

        byte[] report = reportService.generateReport(reportId, loginId);
        ByteArrayInputStream inputStream =  new ByteArrayInputStream(report);
        HttpHeaders headers = new HttpHeaders();
        headers.setContentLength(report.length);
        headers.add("Content-Disposition", "inline;filename=" + reportId + "_report.pdf");

        return ResponseEntity
                .ok()
                .headers(headers)
                .contentType(MediaType.APPLICATION_PDF)
                .body(new InputStreamResource(inputStream));
    }

同样的结果

响应请求：

export const getReport = (reportId = '') => (dispatch) => {
  const report = `${apiConfig.reportUrl}${reportId}`

  const promise = axios.get(report,
     {
        responseType: 'blob',
        headers: {
          'Accept': 'application/pdf'
      }
    })

  return dispatch({
    type: GET_REPORT,
    payload: promise,
  })
}


case GET_REPORT:
      if (payload.data) {
        const report = new Blob([payload.data])
        reportUrl = URL.createObjectURL(report)
        window.open(reportUrl, "_blank")
      }

我尝试了responseType:'bufferArray'，从spring端点返回一个普通字节[]，总是得到406。我猜这是因为我的“接受”标题中有错误的mime类型。我尝试了“application/pdf”和“*/*”，结果相同。接受InputStreamResource或byte[]需要哪些标头

有了邮递员，我可以很好地下载文件

我的配置：

@Component
public class WebConfiguration extends WebMvcConfigurationSupport {

    @Override
    public void configureMessageConverters(List<HttpMessageConverter<?>> converters) {
        converters.add(byteArrayHttpMessageConverter());
        converters.add(new ResourceHttpMessageConverter());
    }

    @Bean
    public HttpMessageConverter byteArrayHttpMessageConverter() {
        ByteArrayHttpMessageConverter arrayHttpMessageConverter =
                new ByteArrayHttpMessageConverter();
        arrayHttpMessageConverter.setSupportedMediaTypes(getSupportedMediaTypes());
        return arrayHttpMessageConverter;
    }

    private List<MediaType> getSupportedMediaTypes() {
        List<MediaType> mediaTypes = new ArrayList<>();
        mediaTypes.add(MediaType.APPLICATION_PDF);
        mediaTypes.add(MediaType.APPLICATION_OCTET_STREAM);

        return mediaTypes;
    }
}

@组件
公共类WebConfiguration扩展了WebMVCCConfiguration支持{
@凌驾
public void configureMessageConverters（列出一个通用的解决方案，但我认为在您的情况下，它应该可以正常工作；）

要点：

完全归功于：
我得到了一个“406不可接受”响应，所以我猜这与我设置的头有关。当我删除这些头时，我得到了相同的响应。当我将头更改为不同的mime类型时，我得到了相同的响应。如果收到响应，不管我对响应做了什么，它看起来就像我发布的axios请求d在功能上与您建议的代码相同。您认为这将如何解决我收到406的问题？您可以在postman中检查您的邮件标题。在“发送”按钮上方是“代码”按钮，点击它并比较您的邮件标题。
@Component
public class WebConfiguration extends WebMvcConfigurationSupport {

    @Override
    public void configureMessageConverters(List<HttpMessageConverter<?>> converters) {
        converters.add(byteArrayHttpMessageConverter());
        converters.add(new ResourceHttpMessageConverter());
    }

    @Bean
    public HttpMessageConverter byteArrayHttpMessageConverter() {
        ByteArrayHttpMessageConverter arrayHttpMessageConverter =
                new ByteArrayHttpMessageConverter();
        arrayHttpMessageConverter.setSupportedMediaTypes(getSupportedMediaTypes());
        return arrayHttpMessageConverter;
    }

    private List<MediaType> getSupportedMediaTypes() {
        List<MediaType> mediaTypes = new ArrayList<>();
        mediaTypes.add(MediaType.APPLICATION_PDF);
        mediaTypes.add(MediaType.APPLICATION_OCTET_STREAM);

        return mediaTypes;
    }
}

axios({
  url: 'http://api.dev/file-download', //your url
  method: 'GET',
  responseType: 'blob', // important
}).then((response) => {
   const url = window.URL.createObjectURL(new Blob([response.data]));
   const link = document.createElement('a');
   link.href = url;
   link.setAttribute('download', 'file.pdf'); //or any other extension
   document.body.appendChild(link);
   link.click();
});