*   [](/v0.2/)
*   [How-to guides](/v0.2/docs/how_to/)
*   How to load HTML

On this page

How to load HTML
================

The HyperText Markup Language or [HTML](https://en.wikipedia.org/wiki/HTML) is the standard markup language for documents designed to be displayed in a web browser.

This covers how to load `HTML` documents into a LangChain [Document](https://v02.api.js.langchain.com/classes/langchain_core_documents.Document.html) objects that we can use downstream.

Parsing HTML files often requires specialized tools. Here we demonstrate parsing via [Unstructured](https://unstructured-io.github.io/unstructured/). Head over to the integrations page to find integrations with additional services, such as [FireCrawl](/v0.2/docs/integrations/document_loaders/web_loaders/firecrawl).

Prerequisites

This guide assumes familiarity with the following concepts:

*   [Documents](/v0.2/docs/concepts#document)
*   [Document Loaders](/v0.2/docs/concepts#document-loaders)

Installation[​](#installation "Direct link to Installation")
------------------------------------------------------------

*   npm
*   yarn
*   pnpm

    npm i @langchain/community

    yarn add @langchain/community

    pnpm add @langchain/community

Setup[​](#setup "Direct link to Setup")
---------------------------------------

Although Unstructured has an open source offering, you’re still required to provide an API key to access the service. To get everything up and running, follow these two steps:

1.  Download & start the Docker container:

    docker run -p 8000:8000 -d --rm --name unstructured-api downloads.unstructured.io/unstructured-io/unstructured-api:latest --port 8000 --host 0.0.0.0

1.  Get a free API key & API URL [here](https://unstructured.io/api-key), and set it in your environment (as per the Unstructured website, it may take up to an hour to allocate your API key & URL.):

    export UNSTRUCTURED_API_KEY="..."# Replace with your `Full URL` from the emailexport UNSTRUCTURED_API_URL="https://<ORG_NAME>-<SECRET>.api.unstructuredapp.io/general/v0/general"

Loading HTML with Unstructured[​](#loading-html-with-unstructured "Direct link to Loading HTML with Unstructured")
------------------------------------------------------------------------------------------------------------------

    import { UnstructuredLoader } from "@langchain/community/document_loaders/fs/unstructured";const filePath =  "../../../../libs/langchain-community/src/tools/fixtures/wordoftheday.html";const loader = new UnstructuredLoader(filePath, {  apiKey: process.env.UNSTRUCTURED_API_KEY,  apiUrl: process.env.UNSTRUCTURED_API_URL,});const data = await loader.load();console.log(data.slice(0, 5));

    [  Document {    pageContent: 'Word of the Day',    metadata: {      category_depth: 0,      languages: [Array],      filename: 'wordoftheday.html',      filetype: 'text/html',      category: 'Title'    }  },  Document {    pageContent: ': April 10, 2023',    metadata: {      emphasized_text_contents: [Array],      emphasized_text_tags: [Array],      languages: [Array],      parent_id: 'b845e60d85ff7d10abda4e5f9a37eec8',      filename: 'wordoftheday.html',      filetype: 'text/html',      category: 'UncategorizedText'    }  },  Document {    pageContent: 'foible',    metadata: {      category_depth: 1,      languages: [Array],      parent_id: 'b845e60d85ff7d10abda4e5f9a37eec8',      filename: 'wordoftheday.html',      filetype: 'text/html',      category: 'Title'    }  },  Document {    pageContent: 'play',    metadata: {      category_depth: 0,      link_texts: [Array],      link_urls: [Array],      link_start_indexes: [Array],      languages: [Array],      filename: 'wordoftheday.html',      filetype: 'text/html',      category: 'Title'    }  },  Document {    pageContent: 'noun',    metadata: {      category_depth: 0,      emphasized_text_contents: [Array],      emphasized_text_tags: [Array],      languages: [Array],      filename: 'wordoftheday.html',      filetype: 'text/html',      category: 'Title'    }  }]

* * *

#### Was this page helpful?

  

#### You can also leave detailed feedback [on GitHub](https://github.com/langchain-ai/langchainjs/issues/new?assignees=&labels=03+-+Documentation&projects=&template=documentation.yml&title=DOC%3A+%3CPlease+write+a+comprehensive+title+after+the+%27DOC%3A+%27+prefix%3E).

[

Previous

How to load data from a directory

](/v0.2/docs/how_to/document_loader_directory)[

Next

How to load Markdown

](/v0.2/docs/how_to/document_loader_markdown)

*   [Installation](#installation)
*   [Setup](#setup)
*   [Loading HTML with Unstructured](#loading-html-with-unstructured)