Error opening a PDF document in flutter Web using SfPdfViewer "There was an error opening this document" #2252

cfiorillo · 2025-01-15T12:05:56Z

Bug description

Open a specific PDF document in flutter web using SfPdfViewer returns an error. In attach the offending PDF document.
FailingDocument.pdf

Steps to reproduce

Create a new flutter web application
flutter create testpdf
Add syncfusion_flutter_pdfviewer package
flutter pub add syncfusion_flutter_pdfviewer
Add the needed javascript to the index.html in the body of the document

<script src="//cdnjs.cloudflare.com/ajax/libs/pdf.js/2.11.338/pdf.min.js"></script>
<script type="text/javascript">
   pdfjsLib.GlobalWorkerOptions.workerSrc = "//cdnjs.cloudflare.com/ajax/libs/pdf.js/2.11.338/pdf.worker.min.js";
</script>

Add the pdf to the assets (folder assets/pdf) and declare it in pub spec.yaml:

  assets:
    - assets/pdf/FailingDocument.pdf

Add in the main screen a SfPdfViewer loading the PDF from assets:

import 'package:flutter/material.dart';
import 'package:syncfusion_flutter_pdfviewer/pdfviewer.dart';

...

  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: SfPdfViewer.asset("assets/pdf/FailingDocument.pdf"),
    );
  }

Run the application
The error is raised, no errors in console

Code sample

main.dart

import 'package:flutter/material.dart';
import 'package:syncfusion_flutter_pdfviewer/pdfviewer.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});
  final String title;
  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: SfPdfViewer.asset(
        "assets/pdf/FailingDocument.pdf",
        onDocumentLoadFailed:(PdfDocumentLoadFailedDetails details) {
          ScaffoldMessenger.of(context).showSnackBar(
            SnackBar(
              content: Text("${details.error} # ${details.description}"),
              backgroundColor: Colors.red,
              duration: Duration(seconds: 3),
              behavior: SnackBarBehavior.floating,
            ),
          );
        }
      ),
    );
  }
}

index.html

<!DOCTYPE html>
<html>
<head>
  <!--
    If you are serving your web app in a path other than the root, change the
    href value below to reflect the base path you are serving from.

    The path provided below has to start and end with a slash "/" in order for
    it to work correctly.

    For more details:
    * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base

    This is a placeholder for base href that will be replaced by the value of
    the `--base-href` argument provided to `flutter build`.
  -->
  <base href="$FLUTTER_BASE_HREF">

  <meta charset="UTF-8">
  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
  <meta name="description" content="A new Flutter project.">

  <!-- iOS meta tags & icons -->
  <meta name="mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="testpdf">
  <link rel="apple-touch-icon" href="icons/Icon-192.png">

  <!-- Favicon -->
  <link rel="icon" type="image/png" href="favicon.png"/>

  <title>testpdf</title>
  <link rel="manifest" href="manifest.json">
</head>
<body>
  <script src="flutter_bootstrap.js" async></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/pdf.js/2.11.338/pdf.min.js"></script>
  <script type="text/javascript">
    pdfjsLib.GlobalWorkerOptions.workerSrc = "//cdnjs.cloudflare.com/ajax/libs/pdf.js/2.11.338/pdf.worker.min.js";
  </script>
</body>
</html>

pubspec.yaml

name: testpdf
description: "A new Flutter project."
publish_to: 'none' # Remove this line if you wish to publish to pub.dev

version: 1.0.0+1

environment:
  sdk: ^3.6.0

dependencies:
  flutter:
    sdk: flutter

  cupertino_icons: ^1.0.8
  syncfusion_flutter_pdfviewer: ^28.1.39

dev_dependencies:
  flutter_test:
    sdk: flutter

  flutter_lints: ^5.0.0

flutter:
  uses-material-design: true

  assets:
    - assets/pdf/FailingDocument.pdf

Screenshots or Video

Video demonstration

ScreenRecBug.mov

Stack Traces

[Add the Stack Traces here]

On which target platforms have you observed this bug?

Web

Flutter Doctor output

Doctor output

[✓] Flutter (Channel stable, 3.27.1, on macOS 15.2 24C101 darwin-x64, locale it-IT)
    • Flutter version 3.27.1 on channel stable at /Users/ciro/Dati/Sorgenti/_tools/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 17025dd882 (4 weeks ago), 2024-12-17 03:23:09 +0900
    • Engine revision cb4b5fff73
    • Dart version 3.6.0
    • DevTools version 2.40.2

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/ciro/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: /Users/ciro/Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 21.0.4+-12422083-b607.1)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 16.2)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 16C5032a
    • CocoaPods version 1.16.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2024.2)
    • Android Studio at /Users/ciro/Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 21.0.4+-12422083-b607.1)

[✓] IntelliJ IDEA Ultimate Edition (version 2024.3.1.1)
    • IntelliJ at /Users/ciro/Applications/IntelliJ IDEA Ultimate.app
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart

[✓] IntelliJ IDEA Community Edition (version 2024.3.1.1)
    • IntelliJ at /Users/ciro/Applications/IntelliJ IDEA Community Edition.app
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart

[✓] VS Code (version 1.86.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension can be installed from:
      🔨 https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

[✓] Connected device (4 available)
    • VTR L09 (mobile)  • 6PQ0217904000641          • android-arm64  • Android 9 (API 28)
    • iScorpyo (mobile) • 00008110-000A0C5C21DA801E • ios            • iOS 18.1.1 22B91
    • macOS (desktop)   • macos                     • darwin-x64     • macOS 15.2 24C101 darwin-x64
    • Chrome (web)      • chrome                    • web-javascript • Google Chrome 131.0.6778.265

[✓] Network resources
    • All expected network resources are available.

• No issues found!

The text was updated successfully, but these errors were encountered:

Deepak1799 · 2025-01-16T15:15:25Z

Hi @cfiorillo ,

We are able to replicate the reported issue that the specific document is not loaded in the Flutter PDF Viewer. Currently, we are validating this issue and we will update further details once we find the root cause of this issue

Regards,
Deepak G

cfiorillo · 2025-02-11T09:23:47Z

@Deepak1799 any news on this issue?

immankumarsync · 2025-02-11T10:56:51Z

Hi @cfiorillo,
We have resolved the Typecasting issue occurs while loading the checkbox fields in a specific PDF document. The fix is available in our latest weekly release.

Package link: syncfusion_flutter_pdf 28.2.5

Root cause: The shared PDF document contains checkbox fields. While retrieving the "isChecked" value of a checkbox field, a TypeError occurs, causing the document to fail to load.

We appreciate your support and patience in waiting for this release. Please feel free to reach out if you need any further assistance.

cfiorillo · 2025-02-12T10:41:15Z

Hi @immankumarsync,
thanks for the update.
I have tested the updated package and it works.
Closing this issue as the problem is solved, thanks

NaiaraManeiro · 2025-03-05T10:00:36Z

Hello @immankumarsync,

I'm facing the same error. I even updated to syncfusion_localizations: 28.2.9, syncfusion_flutter_pdfviewer: ^28.2.9 and syncfusion_flutter_core: ^28.2.9 but still get the error "There was an error opening this document".

The PDF that I'm trying to open is also an editable one, with checklist and spaces to write numbers or letters. It also has a button to clean all the written data in the PDF.

I can't share the PDF since it is a private document, but I hope you can look into it.

Thank you in advance.

immankumarsync · 2025-03-05T16:53:20Z

Hi @NaiaraManeiro,
We suspect that the issue might be specific to the document. Could you please share the document where you noticed the issue through our support portal?

NaiaraManeiro · 2025-03-06T07:04:02Z

Hello @immankumarsync,

Here is the document that was giving me the error. file.pdf

NaiaraManeiro · 2025-03-12T10:31:39Z

Hello @immankumarsync,

Did you find any solution for the problem?

immankumarsync · 2025-03-12T10:37:47Z

Hi @NaiaraManeiro, due to the complex nature of this issue we are still validating this issue, and we will provide further updates once we find the root cause of this issue.

VijayakumarMariappan added pdf viewer PDF viewer component open Open labels Jan 16, 2025

Deepak1799 added follow-up scheduled Follow-up scheduled and removed open Open labels Jan 16, 2025

cfiorillo closed this as completed Feb 12, 2025

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Error opening a PDF document in flutter Web using SfPdfViewer "There was an error opening this document" #2252

Error opening a PDF document in flutter Web using SfPdfViewer "There was an error opening this document" #2252

cfiorillo commented Jan 15, 2025

Deepak1799 commented Jan 16, 2025

cfiorillo commented Feb 11, 2025

immankumarsync commented Feb 11, 2025

cfiorillo commented Feb 12, 2025

NaiaraManeiro commented Mar 5, 2025

immankumarsync commented Mar 5, 2025

NaiaraManeiro commented Mar 6, 2025

NaiaraManeiro commented Mar 12, 2025

immankumarsync commented Mar 12, 2025

Error opening a PDF document in flutter Web using SfPdfViewer "There was an error opening this document" #2252

Error opening a PDF document in flutter Web using SfPdfViewer "There was an error opening this document" #2252

Comments

cfiorillo commented Jan 15, 2025

Bug description

Steps to reproduce

Code sample

Screenshots or Video

Stack Traces

On which target platforms have you observed this bug?

Flutter Doctor output

Deepak1799 commented Jan 16, 2025

cfiorillo commented Feb 11, 2025

immankumarsync commented Feb 11, 2025

cfiorillo commented Feb 12, 2025

NaiaraManeiro commented Mar 5, 2025

immankumarsync commented Mar 5, 2025

NaiaraManeiro commented Mar 6, 2025

NaiaraManeiro commented Mar 12, 2025

immankumarsync commented Mar 12, 2025