.NET MAUI project using the PDF.js library - Issue loading the PDF from iOS App Data Directory

[DavideZzz]

Description

I'm having trouble opening a pdf document in a .net MAUI iOS app: the pdf files in question are downloaded and saved in the AppData Directory so i can't put them in the app bundle. I load the pdf files in a WebView and setting the source as the absolute path of the pdf works fine, but i need to view it with pdfjs to have the toolbar. My problem seems to be in the url i put as source of the webview/ the file path i give viewer.html in the pdfjs folder (which is in the app bundle).

The following code is the webview in the page.xaml

<Grid Margin="8">
    <WebView x:Name="newPdfView" Navigating="newPdfView_Navigating" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" BackgroundColor="#fafafa" Grid.Row="1">
    </WebView>
</Grid>

The following code is what i have in the page constructor:

Microsoft.Maui.Handlers.WebViewHandler.Mapper.AppendToMapping("newPdfView", (handler, view) =>
        {
#if ANDROID
            handler.PlatformView.Settings.JavaScriptEnabled = true;
            handler.PlatformView.Settings.AllowFileAccess = true;
            handler.PlatformView.Settings.AllowFileAccessFromFileURLs = true;
            handler.PlatformView.Settings.AllowUniversalAccessFromFileURLs = true;
#else

if (handler.PlatformView is WebKit.WKWebView wkWebView) 
{                         wkWebView.Configuration.Preferences.SetValueForKey(Foundation.NSObject.FromObject(true), (Foundation.NSString)"allowFileAccessFromFileURLs");
}
                    
#endif
        });
#if IOS
        var pdfFilePath = Foundation.NSBundle.MainBundle.PathForResource("pdfjs/web/viewer", "html");
        var testPdfPath = Foundation.NSBundle.MainBundle.PathForResource("test", "pdf");
        string path = $"file://{pdfFilePath}?file=file://{Path.Combine(FileSystem.Current.AppDataDirectory, "pdf file name"+ ".pdf")}";
        //path=$"file://{pdfFilePath}?file=file://{testPdfPath}"; This works with a test pdf in Resources/Raw
        newPdfView.Source = new UrlWebViewSource{ Url=path};
#elif ANDROID
        newPdfView.Source = $"file:///android_asset/pdfjs/web/viewer.html?file=file:{WebUtility.UrlEncode(Path.Combine(FileSystem.AppDataDirectory, "Cataloghi", pdf.Descrizione + ".pdf"))}";
#endif

With an asset file in Resources/Raw it works fine but with a file in the Appdata directory the pdf doesn't load and shows the pdfjs toolbar and an empty document. I tried changing the path around but nothing seems to load the document. In Android it works with no problem.

Steps to Reproduce

Create a .net MAUI app.
Add pdf.js in Resources/Raw.
Add in the code a way to get a pdf file in the AppData directory.
Create a WebView and set the source as path of pdfjs' viewer.html + the path of the pdf file placed in the Appdata Directory

var pdfFilePath = Foundation.NSBundle.MainBundle.PathForResource("pdfjs/web/viewer", "html");
string path = $"file://{pdfFilePath}?file=file://{Path.Combine(FileSystem.Current.AppDataDirectory, "Pdf file name" + ".pdf")}";
PdfView.Source = new UrlWebViewSource{ Url=path}; // set the source of the webview

Link to public reproduction project repository

https://github.com/user-attachments/files/18280687/PdfApp.zip

Version with bug

8.0.100 SR10

Is this a regression from previous behavior?

No, this is something new

Last version that worked well

Unknown/Other

Affected platforms

iOS

Affected platform versions

No response

Did you find any workaround?

No response

Relevant log output

[similar-issues-ai[bot]]

We've found some similar issues:

• .NET MAUI project using the PDF.js library - Issue loading the PDF from iOS resource #19486 , similarity score: 87%
• Maui iOS failing to load local resources in using WebView Source #10674 , similarity score: 83%

If any of the above are duplicates, please consider closing this issue out and adding additional context in the original issue.

Note: You can give me feedback by 👍 or 👎 this comment.

[ninachen03]

Could you try the workaround : allow the WKWebView to have file access from file URLs, which is what you're giving it here.
I find it from #19486 it will be useful for you

[DavideZzz]

Could you try the workaround : allow the WKWebView to have file access from file URLs, which is what you're giving it here. I find it from #19486 it will be useful for you

I tried adding it with

if (handler.PlatformView is WebKit.WKWebView wkWebView) 
{                         wkWebView.Configuration.Preferences.SetValueForKey(Foundation.NSObject.FromObject(true), (Foundation.NSString)"allowFileAccessFromFileURLs");
}

But it doesn't seem to work.
Am i doing it wrong or its done in a different way?
I used this already when i saw issue #19486

[ninachen03]

Could you provide a sample project for us to investigate it further?
Looking forward to your reply!

[DavideZzz]

Heres a sample project:
PdfApp.zip

Im on holiday right now so im not fully able to test it on iOS, but the part of code that doesnt work should be there.
Got a test.pdf in assets that i copy in a directory 'Pdfs' in Appdata dir on the device and it tries to open it in pdfjs.
It works fine on android but i haven't been able to make it work in ios with the pdfjs viewer.

[greatvova]

I've faced the same issue. Successfully loaded pdf file from Resources, but can not load file from app's sandbox folder.

[DDHSchmidt]

In cases like these I recommend to connect to the WebView-instance via a Safari from a Mac.
For that you can/should add the following to your mapping:

if (OperatingSystem.IsIOSVersionAtLeast(16, 4)) 
            {
                //Starting from iOS 16.4, this is needed for Debugging-Support of WebViews in Safari
                //https://developer.apple.com/documentation/webkit/wkwebview/4111163-isinspectable
                wkWebView.SetValueForKey(NSObject.FromObject(true), new NSString("inspectable"));
            }

I'm 90% sure though the Safari DevTools will show you something like "Access to resource denied".
I can't share any code but we had to provide access to our AppData-Folder via a custom url scheme and then write/register our own IWKUrlSchemeHandler since Safari on iOS would balk when we tried to access resources via "file://..."
These docs will give you a starting point.