Unable to render OneNote image resource after appending preAuthenticated=true option in OneNote api call

313 Views Asked by At

https://github.com/microsoftgraph/microsoft-graph-docs/issues/2624

I am experience the issue as the above.

I am trying to save the content of a page with a reference to an image by calling https://graph.microsoft.com/v1.0/users/{userId}/onenote/pages/{pageId}/content?preAuthenticated=true

Per this - Downloading one note page with image content as HTML

By appending "?preAuthenticated=true" when you do the fetch, it will make the image public.

But when I tried to render the html, it's giving me "Failed to load resource: the server responded with a status of 401 (Unauthorized)".

3

There are 3 best solutions below

0
On BEST ANSWER

Bit of off topic, but I figured out how to get the image to render.

https://learn.microsoft.com/en-us/graph/api/resource-get?view=graph-rest-1.0&tabs=http

When you call /onenote/pages/{id}/content, the image has a reference to a source like this

src="https://graph.microsoft.com/v1.0/users({userId})/onenote/resources/{resourceId}/$value" along with data-src-type="image/jpeg"

do a get request to this endpoint and you'll the image binary, convert the binary to base64, and then just render the html by replacing the src with base64.

0
On
3
On

It appears that something is wrong with the official document: Get OneNote content and structure with Microsoft Graph.

We can see that the service root URL is https://graph.microsoft.com/{version}/{location}/onenote/.

But in any of the samples on this page, the URL is still https://www.onenote.com/api/v1.0/me/notes.

Currently, when you add ?preAuthenticated=true you will get such a URL for a image on this page:

https://graph.microsoft.com/v1.0/users('{userID}')/onenote/resources/{resourceID}/content?publicAuth=true&mimeType=image/png

But when you try to access it in a browser, you will get 401 error Access token is empty.

A workaround is to modify the URL to:

https://www.onenote.com/api/v1.0/resources/{resourceID}/content?publicAuth=true&mimeType=image/png

Then you will get the image.