React Native
OneNote - Get Page HTML Content

Download the HTML content of a OneNote page. Also iterates over the images and attachments on the OneNote page and downloads the content for each.
Chilkat React Native Downloads

Download Chilkat for React Native
React Native
import { BinData, Http, StringBuilder, Xml } from '@chilkat/react-native'

async function chilkatExample() {
  // This example assumes the Chilkat API to have been previously unlocked.
  // See Global Unlock Sample for sample code.

  const http = new Http();

  // Implements the following CURL command:

  // curl -X GET https://graph.microsoft.com/v1.0/me/onenote/pages/{id}/content?includeIDs=true \
  //   -H 'authorization: Bearer ACCESS_TOKEN'

  // Use the following online tool to generate HTTP code from a CURL command
  // Convert a cURL Command to HTTP Source Code

  // Adds the "Authorization: Bearer ACCESS_TOKEN" header.
  http.authToken = 'ACCESS_TOKEN';

  http.setUrlVar('page_id', '0-d2298668edd74dccac7f821fa378bf64!41-3A33FCEB9B74CC15!20350');

  const sbResponseBody = new StringBuilder();
  try {
    await http.quickGetSbAsync('https://graph.microsoft.com/v1.0/me/onenote/pages/{$page_id}/content?includeIDs=true', sbResponseBody);
  } catch {
    console.log(http.lastErrorText);
    return;
  }

  console.log('HTML content:');
  console.log(sbResponseBody.getAsString());

  const respStatusCode = http.lastStatus;
  console.log(`Response Status Code = ${respStatusCode}`);
  if (respStatusCode >= 400) {
    console.log('Response Header:');
    console.log(http.lastHeader);
    console.log('Failed.');
    return;
  }

  // Let's get the images and attached files.
  // Here's sample HTML content with 2 images and one PDF attachment:

  // <html lang="en-US">
  // 	<head>
  // 		<title>A page with rendered images and an attached file</title>
  // 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  // 		<meta name="created" content="2020-10-23T12:00:00.0000000" />
  // 	</head>
  // 	<body data-absolute-enabled="true" style="font-family:Calibri;font-size:11pt">
  // 		<div id="div:{b130eb6c-638a-4f97-8f7e-b6d9e2e88bf9}{32}" data-id="_default" style="position:absolute;left:48px;top:120px;width:624px">
  // 			<p id="p:{b130eb6c-638a-4f97-8f7e-b6d9e2e88bf9}{39}" style="margin-top:5.5pt;margin-bottom:5.5pt">Here&#39;s an image from an online source:</p>
  // 			<img id="img:{ee18fe8d-b219-4baf-9b4d-4fc680579f0d}{1}" alt="an image on the page" width="500" height="500" src="https://graph.microsoft.com/v1.0/users('admin@chilkat.io')/onenote/resources/0-e71b45b763484921b4200e32c2439a47!1-3A33FCEB9B74CC15!20350/$value" data-src-type="image/jpeg" data-fullres-src="https://graph.microsoft.com/v1.0/users('admin@chilkat.io')/onenote/resources/0-e71b45b763484921b4200e32c2439a47!1-3A33FCEB9B74CC15!20350/$value" data-fullres-src-type="image/jpeg" />
  // 			<p id="p:{b130eb6c-638a-4f97-8f7e-b6d9e2e88bf9}{43}" style="margin-top:5.5pt;margin-bottom:5.5pt">Here&#39;s an image uploaded as binary data:</p>
  // 			<img id="img:{ee18fe8d-b219-4baf-9b4d-4fc680579f0d}{3}" alt="an image on the page" width="300" height="225" src="https://graph.microsoft.com/v1.0/users('admin@chilkat.io')/onenote/resources/0-a60516b962b842f2ae9bec75c16b31de!1-3A33FCEB9B74CC15!20350/$value" data-src-type="image/jpeg" data-fullres-src="https://graph.microsoft.com/v1.0/users('admin@chilkat.io')/onenote/resources/0-a60516b962b842f2ae9bec75c16b31de!1-3A33FCEB9B74CC15!20350/$value" data-fullres-src-type="image/jpeg" />
  // 			<p id="p:{b130eb6c-638a-4f97-8f7e-b6d9e2e88bf9}{47}" style="margin-top:5.5pt;margin-bottom:5.5pt">Here&#39;s a file attachment:</p>
  // 			<object data-attachment="FileName.pdf" type="application/pdf" data="https://graph.microsoft.com/v1.0/users('admin@chilkat.io')/onenote/resources/0-9e685efb33a24a6a8de1b9c707d28385!1-3A33FCEB9B74CC15!20350/$value" />
  // 		</div>
  // 	</body>
  // </html>

  const xml = new Xml();
  xml.loadSb(sbResponseBody, true);

  // Iterate over each element in the XML.  Each time we find an "img" or "object", download the data.
  // (The sbState is an object used to keep track of the current state of the traversal.)
  const sbState = new StringBuilder();
  let url = '';
  const bd = new BinData();
  while (xml.nextInTraversal2(sbState)) {

    if (xml.tagEquals('img')) {
      console.log(`img id: ${xml.getAttrValue('id')}`);
      url = xml.getAttrValue('src');
      bd.clear();
      try {
        await http.quickGetBdAsync(url, bd);
      } catch {
        console.log(http.lastErrorText);
        return;
      }

      console.log(`Downloaded from ${url}`);
      console.log('----');
      // If desired, bd.WriteFile to save the contents of bd to a file..
    }

    if (xml.tagEquals('object')) {
      console.log(`data-attachment: ${xml.getAttrValue('data-attachment')}`);
      console.log(`type: ${xml.getAttrValue('type')}`);
      url = xml.getAttrValue('data');
      bd.clear();
      try {
        await http.quickGetBdAsync(url, bd);
      } catch {
        console.log(http.lastErrorText);
        return;
      }

      console.log(`Downloaded from ${url}`);
      console.log('----');
      // If desired, bd.WriteFile to save the contents of bd to a file..
    }
  }

  console.log('Success.');
}