1. Home
  2. Forum
  3. Flutter
  4. Firebase Pdf

Firebase Pdf

Hi, 

We are using firebase to store our pdfs and tried to load the following link with the following Minimum Reproducible Example

Thanks for any help!

https://firebasestorage.googleapis.com/v0/b/aero-documents.appspot.com/o/profilePdfs%2F1621304712381000Description.pdf?alt=media&token=0548bc2d-5748-4e31-957e-a7ad746e1542

Widget getMobileLayout(BuildContext context, width) {
return Column(crossAxisAlignment: CrossAxisAlignment.stretch, children: [
userToken == null
? Container()
: Container(
width: 300,
height: 700,
child: SfPdfViewer.network(
widget.pr!.revisions![0].pdf!,
onDocumentLoadFailed: (err) {
print(err.error); // Error
print(err.description); // There was an error opening this document.
},
)) /*CustomToolbarPdfViewer(GlobalKey(), pr: widget.pr!))*/
]);
}


4 Replies
DB Dilli Babu Nandha Gopal Syncfusion Team May 19, 2021 04:00 PM UTC

Hi Seth, 
 
Greetings from Syncfusion. 
 
Files in Firebase can’t be accessed directly with the access token in Flutter application. firebase_storage plugin is used to upload and download the files in Flutter application. Kindly refer the example project of firebase_storage plugin here.  
  
A detailed documentation for working with Firebase in Flutter application is mentioned in this link - https://firebase.flutter.dev/docs/storage/overview   
  
To access the file in flutter app, the rules in Firebase storage must look like this.  
  
 
  
  
We have prepared a sample application which downloads the PDF from Firebase and loads to SfPdfViewer widget. This application works properly in Android devices. The sample can be downloaded from below link.  
  
While checking the sample in Web platform, we faced “XMLHttpRequest error” from native code of Firebase. We have reported this issue in their forum - https://github.com/FirebaseExtended/flutterfire/issues/6172  
  
Kindly check the above sample and lets us know if you are facing any difficulties.  
  
Regards, 
Dilli babu 


SE Seth May 19, 2021 04:36 PM UTC

I can load into memory and then try to load PDF (thanks for workaround), but desired functionality is to load using

1) .network
2) not having to change firebase rules - security risk


I think your XML issue is from CORS. I was able to fix the CORS issue by using 

https://stackoverflow.com/questions/43109327/cors-setting-on-google-cloud-bucket



SE Seth May 19, 2021 11:00 PM UTC

Actually I think the answer my question was to add the extra pdf script:

<!-- This script installs pdf.min.js to render the PDF page as an image in the
application and load in syncfusion_flutter_pdfviewer widget -->
<script src="//cdnjs.cloudflare.com/ajax/libs/pdf.js/2.4.456/pdf.min.js"></script>
<script type="text/javascript">
    pdfjsLib.GlobalWorkerOptions.workerSrc = "//cdnjs.cloudflare.com/ajax/libs/pdf.js/2.4.456/pdf.worker.min.js";
</script>

DB Dilli Babu Nandha Gopal Syncfusion Team May 20, 2021 03:28 PM UTC

Hi Seth, 
 
We request you to provide updates in the direct-trac support ticket under your account. The incident has been created for better follow up of this issue.  
 
Please let us know if you have any doubts. 
 
Regards, 
Dilli babu 


Loader.
Up arrow icon