Skip to content

Support JSON-LD data islands in HTML pages #5

@melvincarvalho

Description

@melvincarvalho

Problem

When browsing to an HTML page like https://jsonos.com/examples/organization.html, the browser shows nothing because rdflib's Fetcher doesn't extract JSON-LD data islands from HTML responses.

Current behavior:

  1. User browses to organization.html
  2. Server returns Content-Type: text/html
  3. rdflib Fetcher doesn't know how to parse HTML
  4. Empty store, nothing renders

Expected behavior:

  1. User browses to organization.html
  2. solid-shim detects HTML response
  3. Extracts <script type="application/ld+json"> content
  4. Parses JSON-LD into store
  5. Renders with appropriate pane (or @view if specified)

Background

JSON-LD data islands are part of the JSON-LD spec and widely used (Google's structured data, schema.org markup, etc.). The browser should handle them natively.

Proposed Solution

Hook into rdflib's Fetcher or add a custom handler:

// When fetching a URL
const response = await fetch(url)
const contentType = response.headers.get('content-type')

if (contentType?.includes('text/html')) {
  const html = await response.text()
  const doc = new DOMParser().parseFromString(html, 'text/html')
  const jsonLdScript = doc.querySelector('script[type="application/ld+json"]')
  
  if (jsonLdScript) {
    const data = JSON.parse(jsonLdScript.textContent)
    parseJsonLdToStore(data, url, store)
    // Render with @view or type-based pane
  }
}

Related

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions