flutterfirebasefiledartweb

Flutter Solve: 'Offset is outside the bounds of the DataView' error only on Firebase Hosting


Code saving file:

   on<GeneratePDFFromInvoice>((event, emit) async {
      final aspHeaderLogo =
          await rootBundle.loadString('assets/images/asp_logo.svg');
      final aspFooterSlogan =
          await rootBundle.loadString('assets/images/asp_slogan.svg');
      final fontBold = Font.ttf(
          await rootBundle.load('fonts/Mulish/static/Mulish-Regular.ttf'));
      final regFont = Font.ttf(
          await rootBundle.load('fonts/Mulish/static/Mulish-Bold.ttf'));

      final pw.Document pdf =
          pw.Document(theme: PDFTheme(fontBold, regFont).themeData());

      PDF(
              pdf: pdf,
              invoice: event.invoice,
              aspHeaderLogo: aspHeaderLogo,
              aspFooterSlogan: aspFooterSlogan)
          .createPDF();
      String fileName =
          '${event.invoice.projectNumber}-${event.invoice.invoiceNumber} Invoice.pdf';
      final Uint8List fileData = await pdf.save();
      const String mimeType = 'application/pdf';
      final XFile pdfFile =
          XFile.fromData(fileData, mimeType: mimeType, name: fileName);
      await pdfFile.saveTo(fileName);
    });

Error from browser console is:

Uncaught RangeError: Offset is outside the bounds of the DataView
    at DataView.getUint32 (<anonymous>)
    at atE.a5A (main.dart.js:92807:5)
    at Object.aJI (main.dart.js:25128:3)
    at HD.U4 (main.dart.js:94596:28)
    at HD.py (main.dart.js:94570:37)
    at anw.$3 (main.dart.js:95329:97)
    at q_.atL (main.dart.js:95196:7)
    at Wp.agb (main.dart.js:95253:8)
    at Wp.cm (main.dart.js:95279:22)
    at Oj.cm (main.dart.js:94447:16)

The error occurs regardless of which browser I am on, but only happens when I deploy Firebase. There is no error on localhosting. The error doesn't seem to happen when I don't load a font into the PDF. Also using pdf_package link below. https://pub.dev/packages/pdf


Solution

  • The error occured becuase the directory reference in the code was not the full directory path to the assets, which is advised to be done for rootBundle.load().

    so to resolve the issue i simply specified the full path like so:

    final fontBold = Font.ttf(await rootBundle.load('assets/fonts/Mulish/static/Mulish-Bold.ttf'));
    
    final regFont = Font.ttf(await rootBundle.load('assets/fonts/Mulish/static/Mulish-Regular.ttf'));