CORS error when calling IFile.GetContentAsync from Blazor

[TimDol64]

Category

• Bug

Describe the bug

When calling GetContentAsync() on an IFile object from a Blazor project, an error is thrown:
"Access to fetch at 'https://<tenant>.sharepoint.com/sites/DevSite/_vti_bin/client.svc' from origin 'https://localhost: <port>' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request.'

Note: setting the IFile object and accessing its properties works as expected.

Steps to reproduce

1. See attached code file
2. Update the relative path on line 28 to a valid path
3. Run the app and verify that @file.Name is displayed
4. Uncomment line 31
5. Verify that a CORS error is thrown

Expected behavior

I expect the contents of the file to be loaded to a stream.

Environment details (development & target environment)

• SDK version: 1.5.22-nightly
• OS: Windows 10 x64
• SDK used in: Blazor WebAssembly
• Framework: .NET 6
• Browser(s): Edge v97.0.1072.69
• Tooling: Visual Studio 2022
• Additional details: none

Additional context

Sorry, none.
GetContextAsync.razor.txt

[TimDol64]

New to Blazor, did some reading on configuring Cors 🤭

[jansenbe]

If you feel this requires extra documentation in the sample then please let us know @TimDol64 , maybe it's good to include file upload/download in our basic Blazor sample.

[TimDol64]

As a Winforms developer investigating Blazor and PnP Core this looked like a bug to me at first. I guess it depends on the audience if this is worth adding it to the demo.

[TimDol64]

@jansenbe A little more guidance would be helpful (at least to me). As mentioned, I am a Windows desktop developer with a little bit of CSOM experience, trying to explore Blazor + PnP Core.
So, a lot of ASP.Net Core is new to me. After doing some reading I think 'localhost' is a special case with regards to CORS, so I made an alias using ngrok. That led to a 'AADSTS50011 The reply URL specified in the request does not match the reply URLs configured for the application' error, which I tried to fix by adding a Reply URL for the ngrok alias in my app registration in the Azure portal.
But now I am again hit by a 'Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request' error, now with the ngrok alias as the origin.

[jansenbe]

@TimDol64 : just to fully understand your scenario: you want to download a file from SharePoint and do something with the returned bytes from within a Blazor WebAssembly application?

[jansenbe]

@TimDol64 : think this is an issue in the PnP library. When doing downloads we hit _layouts/15/download.aspx?UniqueId=d23cb9ea-26ee-4a76-b808-6e6ca7f87dee as that's a very reliable manner to download files. When running from the browser (as WASM) CORS interferes here. Solution will be to use another download approach in case of WASM, something I'll add to our backlog.