Invalid PDF structure using vue3-pdf

Question

This exception is returning on almost on every file, only one works for me From console, it also returns:

Warning: Indexing all PDF objects.

Object { message: "Invalid PDF structure.", name: "InvalidPDFException", stack: "BaseExceptionClosure@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/build/pdf.js:2222:29\n@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/build/pdf.js:2225:2\n__w_pdfjs_require__@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/build/pdf.js:47:30\n@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/build/pdf.js:384:32\n__w_pdfjs_require__@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/build/pdf.js:47:30\n@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/build/pdf.js:317:41\n__w_pdfjs_require__@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/build/pdf.js:47:30\n@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/build/pdf.js:111:18\n@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/build/pdf.js:114:10\nwebpackUniversalModuleDefinition@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/build/pdf.js:25:20\n@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/build/pdf.js:27:3\n@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/build/pdf.js:26661:30\n./node_modules/pdfjs-dist-sig/es5/build/pdf.js@http://localhost:8080/view/js/chunk-vendors.js:2504:1\n__webpack_require__@http://localhost:8080/view/js/app.js:849:30\nfn@http://localhost:8080/view/js/app.js:151:20\n@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/web/pdf_viewer.js:408:14\n__w_pdfjs_require__@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/web/pdf_viewer.js:47:30\n@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/web/pdf_viewer.js:258:36\n__w_pdfjs_require__@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/web/pdf_viewer.js:47:30\n@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/web/pdf_viewer.js:221:52\n__w_pdfjs_require__@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/web/pdf_viewer.js:47:30\n@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/web/pdf_viewer.js:111:18\n@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/web/pdf_viewer.js:114:10\nwebpackUniversalModuleDefinition@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/web/pdf_viewer.js:25:20\n@webpack-internal:///./node_modules/pdfjs-dist-sig/es5/web/pdf_viewer.js:27:3\n./node_modules/pdfjs-dist-sig/es5/web/pdf_viewer.js@http://localhost:8080/view/js/chunk-vendors.js:2515:1\n__webpack_require__@http://localhost:8080/view/js/app.js:849:30\nfn@http://localhost:8080/view/js/app.js:151:20\n@webpack-internal:///./node_modules/vue3-pdf/src/pdfjsWrapper.js:2:110\n./node_modules/vue3-pdf/src/pdfjsWrapper.js@http://localhost:8080/view/js/chunk-vendors.js:2725:1\n__webpack_require__@http://localhost:8080/view/js/app.js:849:30\nfn@http://localhost:8080/view/js/app.js:151:20\n@webpack-internal:///./node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/index.js?!./node_modules/vue3-pdf/src/vuePdfNoSss.vue?vue&type=script&lang=js:6:41\n./node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/index.js?!./node_modules/vue3-pdf/src/vuePdfNoSss.vue?vue&type=script&lang=js@http://localhost:8080/view/js/chunk-vendors.js:616:1\n__webpack_require__@http://localhost:8080/view/js/app.js:849:30\nfn@http://localhost:8080/view/js/app.js:151:20\n@webpack-internal:///./node_modules/vue3-pdf/src/vuePdfNoSss.vue?vue&type=script&lang=js:2:276\n./node_modules/vue3-pdf/src/vuePdfNoSss.vue?vue&type=script&lang=js@http://localhost:8080/view/js/chunk-vendors.js:2749:1\n__webpack_require__@http://localhost:8080/view/js/app.js:849:30\nfn@http://localhost:8080/view/js/app.js:151:20\n@webpack-internal:///./node_modules/vue3-pdf/src/vuePdfNoSss.vue:2:117\n./node_modules/vue3-pdf/src/vuePdfNoSss.vue@http://localhost:8080/view/js/chunk-vendors.js:2737:1\n__webpack_require__@http://localhost:8080/view/js/app.js:849:30\nfn@http://localhost:8080/view/js/app.js:151:20\n@webpack-internal:///./node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/@vue/cli-plugin-typescript/node_modules/ts-loader/index.js?!./node_modules/cache-loader/dist/cjs.js?!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/index.js?!./src/views/Dashboard.vue?vue&type=script&lang=ts:25:86\n./node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/@vue/cli-plugin-typescript/node_modules/ts-loader/index.js?!./node_modules/cache-loader/dist/cjs.js?!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/index.js?!./src/views/Dashboard.vue?vue&type=script&lang=ts@http://localhost:8080/view/js/app.js:986:1\n__webpack_require__@http://localhost:8080/view/js/app.js:849:30\nfn@http://localhost:8080/view/js/app.js:151:20\n@webpack-internal:///./src/views/Dashboard.vue?vue&type=script&lang=ts:2:406\n./src/views/Dashboard.vue?vue&type=script&lang=ts@http://localhost:8080/view/js/app.js:1466:1\n__webpack_require__@http://localhost:8080/view/js/app.js:849:30\nfn@http://localhost:8080/view/js/app.js:151:20\n@webpack-internal:///./src/views/Dashboard.vue:3:115\n./src/views/Dashboard.vue@http://localhost:8080/view/js/app.js:1454:1\n__webpack_require__@http://localhost:8080/view/js/app.js:849:30\nfn@http://localhost:8080/view/js/app.js:151:20\n@webpack-internal:///./src/router/index.ts:3:97\n./src/router/index.ts@http://localhost:8080/view/js/app.js:1430:1\n__webpack_require__@http://localhost:8080/view/js/app.js:849:30\nfn@http://localhost:8080/view/js/app.js:151:20\n@webpack-internal:///./src/main.ts:12:84\n./src/main.ts@http://localhost:8080/view/js/app.js:1406:1\n__webpack_require__@http://localhost:8080/view/js/app.js:849:30\nfn@http://localhost:8080/view/js/app.js:151:20\n1@http://localhost:8080/view/js/app.js:1551:18\n__webpack_require__@http://localhost:8080/view/js/app.js:849:30\ncheckDeferredModules@http://localhost:8080/view/js/app.js:46:23\n@http://localhost:8080/view/js/app.js:925:18\n@http://localhost:8080/view/js/app.js:928:10\n" }

My function to get file:

  const getFile = async () => {
      console.log(currentDocNum);
      console.log(kpiShow.value);
      const responseFile = await rest.getFile(docsList[currentDocNum]);
      const downloadUrl = window.URL.createObjectURL(new Blob([responseFile.result]));
      const blob = new Blob([responseFile.result], { type: "application/pdf" });

      const temp = URL.createObjectURL(blob);
      const pdfSource = pdf.createLoadingTask(temp);
      console.log(temp);
      objectUrl.value = downloadUrl;
      
      pdfSource.promise.then((pdfTemp: any) => {
        numberPages.value = pdfTemp.numPages;
      });
      if (currentDocNum < docsNumber) currentDocNum++;
    };

const getFile = async (file: string): Promise<RestResponse<any>> => {
  return getRequest("/view/files?fileName="+file )
}

const getRequest = (requestString: string) =>
  viewAPI
    .get(requestString)
    .then((result) => ({ ok: true, result: result.data }))
    .catch((error) => Promise.resolve({ ok: false, error: error }))

and div

  <div class="row" v-if="!kpiShow" >
    <pdf :src="objectUrl" :page="1" ></pdf>
</div>

Answer 1

It have to be

const getRequest = (requestString: string) =>
  viewAPI
    .get(requestString,{responseType:"blob"})
    .then((result) => ({ ok: true, result: result.data }))
    .catch((error) => Promise.resolve({ ok: false, error: error }))