Skip to main content
The no-native-http rule prevents usage of browser HTTP APIs (Fetch and XMLHttpRequest) in UI extensions.

Rule details

UI extensions run in a sandboxed web worker environment where browser HTTP APIs (fetch() and XMLHttpRequest) are intentionally replaced with error-throwing functions for security reasons. All HTTP requests must go through either: This rule detects and prevents usage of browser HTTP APIs that will fail at runtime.
hubspot.fetch() is not a one-to-one replacement for the browser fetch() method. For example, hubspot.fetch() can only call URLs that have been added to permittedUrls in your app’s configuration. Learn more about fetching data in UI extensions.

Examples

Browser fetch()

Instead of using fetch():
// Incorrect
async function getData() {
  const response = await fetch('https://api.example.com/data');
  return response.json();
}
Use hubspot.fetch():
import { hubspot } from '@hubspot/ui-extensions';

async function getData() {
  const response = await hubspot.fetch('https://api.example.com/data');
  return response.json();
}
Destructuring from hubspot is also allowed:
import { hubspot } from '@hubspot/ui-extensions';

const { fetch } = hubspot;

async function getData() {
  const response = await fetch('https://api.example.com/data');
  return response.json();
}

XMLHttpRequest

Instead of using XMLHttpRequest:
// Incorrect
function getData() {
  const xhr = new XMLHttpRequest();
  xhr.open('GET', 'https://api.example.com/data');
  xhr.send();
}
Use hubspot.fetch():
import { hubspot } from '@hubspot/ui-extensions';

async function getData() {
  const response = await hubspot.fetch('https://api.example.com/data');
  return response.json();
}
Last modified on February 19, 2026