ApryseSDK / webviewer-ui

WebViewer UI built in React
Other
409 stars 353 forks source link

Getting error after integrating pdfnet-node library in angular. #1043

Closed aafaque-coditas closed 8 months ago

aafaque-coditas commented 8 months ago

I was trying to integrate the data extraction module with my Angular project. And I am getting an error in the console. Which I feel I am getting because of the @pdftron/pdfnet-node library. Can someone check this.

import { AfterViewInit, Component, ElementRef, EventEmitter, OnInit, Output, ViewChild } from '@angular/core';
import WebViewer, { Core, WebViewerInstance } from "@pdftron/webviewer";
import *  as PDFNetNode from '@pdftron/pdfnet-node';
import { Subject } from "rxjs";

@Component({
    selector: 'app-root',
    styleUrls: ['app.component.css'],
    templateUrl: '
        <div class="page">
          <div class="header">Data Extraction Module Integration For Form Fields</div>
          <div #viewer class="viewer"></div>
        </div>
    '
})
export class AppComponent implements AfterViewInit {
    wvInstance?: WebViewerInstance;

    @ViewChild('viewer') viewer!: ElementRef;

    @Output() coreControlsEvent: EventEmitter<string> = new EventEmitter();

    private documentLoaded$: Subject<void>;

    constructor() {
        this.documentLoaded$ = new Subject<void>();
    }

    ngAfterViewInit(): void {

        WebViewer({
            path: '../lib',
            initialDoc: '../files/form-for-changes-in-pan.pdf',
            licenseKey: 'YOUR COMMERCIAL LICENSE KEY',
            fullAPI: true
        }, this.viewer.nativeElement).then(instance => {
            this.wvInstance = instance;

            this.coreControlsEvent.emit(instance.UI.LayoutMode.Continuous);

            const { documentViewer, Annotations, annotationManager, PDFNet } = instance.Core;
            PDFNet.initialize(YOUR COMMERCIAL LICENSE KEY, 'ems')

            documentViewer.addEventListener('documentLoaded', async () => {
                this.documentLoaded$.next();

                if (await PDFNetNode.PDFNet.DataExtractionModule.isModuleAvailable(PDFNetNode.PDFNet.DataExtractionModule.DataExtractionEngine.e_Form)) {
                    const json = await PDFNetNode.PDFNet.DataExtractionModule.extractDataAsString('../files/form-for-changes-in-pan.pdf', PDFNetNode.PDFNet.DataExtractionModule.DataExtractionEngine.e_Form);
                    console.log(json)
                }

            });
        })
    }
}

And I am getting this error in the console

Uncaught ReferenceError: createdObjects is not defined
    at pdfnet.js:1100:237
    at 845 (pdfnet.js:1161:12)
    at __webpack_require__ (bootstrap:19:1)
    at 5041 (main.js:18:78)
    at __webpack_require__ (bootstrap:19:1)
    at 6747 (app.component.html:5:7)
    at __webpack_require__ (bootstrap:19:1)
    at 4431 (form-filler.component.ts:9:11)
    at __webpack_require__ (bootstrap:19:1)
    at __webpack_exec__ (main.ts:7:36)

I am also providing code snippet of package.json for better understanding.

{
  "name": "pdftron-angular-sample",
  "version": "1.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve --host 0.0.0.0 --disable-host-check",
    "build": "ng build",
    "postinstall": "node tools/copy-webviewer-files.js"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^15.1.0",
    "@angular/common": "^15.1.0",
    "@angular/compiler": "^15.1.0",
    "@angular/core": "^15.1.0",
    "@angular/forms": "^15.1.0",
    "@angular/platform-browser": "^15.1.0",
    "@angular/platform-browser-dynamic": "^15.1.0",
    "@angular/router": "^15.1.0",
    "@pdftron/data-extraction": "^10.6.0",
    "@pdftron/pdfnet-node": "^10.6.0",
    "@pdftron/webviewer": "^10.6.0",
    "addon": "^0.0.0",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "underscore": "^1.13.6",
    "xhr2": "^0.2.1",
    "zone.js": "~0.12.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^15.1.6",
    "@angular/cli": "~15.1.6",
    "@angular/compiler-cli": "^15.1.0",
    "fs-extra": "^11.1.0",
    "typescript": "~4.9.4"
  }
}

If this is not the right way to integrate the data extraction module for detecting form fields in a pdf, then please let me know the correct way.

bollain commented 8 months ago

Hi @aafaque-coditas,

To better assist you with this issue, please open a support ticket where it can be triaged and assigned to the correct team: https://support.apryse.com/support/tickets/new