BiomAPI

Browser SDK Demo

Import a report with the widget or an integrator link, then copy its PIN or share it. Both import methods use the response viewer below.

1. Widget integration

  1. Open the BiomAPI popup.
  2. Load, retrieve, or transcribe one report and review the result.
  3. Press Send to return the reviewed response.

Cancel or closing the popup returns no data.

3. Automatic fragment import

Copy a link to “Integrator (this demo)” and open it in a new tab, with or without identity.

The SDK reads and removes the #biompin fragment, retrieves the report with integration attribution, and restores optional biomctx identifiers locally.

Works on page load and later fragment changes, without opening the widget.

Listening for a BiomPIN fragment.

Raw response

Import a report using the widget or a fragment link.

No response received yet.

The response follows the StandardAPIResponse schema.

Integration example

Use this example in your own page. It combines the widget, BiomPIN links, fragment handling, and attributed retrieval. Each feature also works independently.

<button id="import-biometry">Import from BiomAPI</button>
<select id="destination" aria-label="Link destination">
  <option value="external">Integrator (this page)</option>
  <option value="biomapi">BiomAPI</option>
</select>
<label><input id="identity" type="checkbox" disabled> Include initials/ID</label>
<button id="copy-link" disabled>Copy link</button>
<button id="copy-pin" disabled>Copy PIN</button>
<p id="status" role="status"></p>
<pre id="result"></pre>

<script src="https://biomapi.com/static/js/biomapi-sdk.js"></script>
<script>
const byId = id => document.getElementById(id);
const integrator = { id: 'example-ehr', name: 'Example EHR' };
let current = null;
let generation = 0;

function display(response) {
  current = response;
  byId('result').textContent = response ? JSON.stringify(response, null, 2) : '';
  byId('copy-pin').disabled = byId('copy-link').disabled = !response?.biompin?.pin;
  byId('identity').disabled = !response?.biompin?.pin || !BiomAPI.context.fromResponse(response);
  byId('identity').checked = !byId('identity').disabled;
}

byId('import-biometry').onclick = async () => {
  const request = ++generation;
  display(null);
  try {
    const response = await BiomAPI.widget.open({
      integrator
    });
    if (request !== generation) return;
    display(response);
    byId('status').textContent = response ? 'Received from widget.' : 'Canceled.';
  } catch (error) {
    if (request === generation) byId('status').textContent = error.message;
  }
};

function copied(success) {
  byId('status').textContent = success ? 'Copied.' : 'Copy failed.';
}
byId('copy-pin').onclick = () => BiomAPI.biompin.copyPin(current?.biompin?.pin).then(copied);
byId('copy-link').onclick = () => BiomAPI.biompin.copyUrl({
  pin: current?.biompin?.pin,
  // Use your app's fragment-enabled URL; omit targetUrl for a BiomAPI link.
  targetUrl: byId('destination').value === 'external'
    ? new URL(location.pathname, location.origin).href : undefined,
  context: byId('identity').checked ? BiomAPI.context.fromResponse(current) : null
}).then(copied);

// Listen on page load and later fragment changes.
const stopWatching = BiomAPI.fragments.watch(async ({ pin, context }) => {
  const request = ++generation;
  display(null);
  byId('status').textContent = 'Retrieving…';
  try {
    // The SDK sends attribution headers; fragment context is never sent.
    const response = await BiomAPI.biompin.retrieve(pin, { integrator });
    if (request !== generation) return;
    display(BiomAPI.context.apply(pin, response, context));
    byId('status').textContent = 'Received from fragment.';
  } catch (error) {
    if (request === generation) byId('status').textContent = error.message;
  }
});
// Call stopWatching() when your component is disposed.
</script>