This article is about fetching (http request/response) in the browser.
User agents can implement a variety of transfer protocols to fetch resources such as:
When the browser is rendering an HTML page, it encounters HTML elements that are executing fetching command (such as img that fetch an image). More … see What are the HTML elements that fetch resources?
When a user agent is to fetch a resource or URL:
it must follow this processing model.
A web site (HTML, Javascript or CSS) can fetch two types of resources from a server:
A web site (HTML, Javascript or CSS) is able to receive data resources (such as HTML, XML, or JSON documents) from:
Media resources such as images, JavaScript, CSS, or fonts can be included from any origin, even without permissive CORS headers.
Cross-Origin Read Blocking (CORB) prevents the fetch of a cross-origin data resource.
https://developers.google.com/web/fundamentals/performance/resource-prioritization
See:
The origin request header indicates where a fetch originates from.
To give the possibility to abort a fetch, you need to use a AbortController.
Library adds:
Library | Platform | Framework Module | Feature |
---|---|---|---|
Axios | Browser / Node | Standalone | Caching via plugin, cancelation (inspired by ng http) |
Angular http | Angular | ||
superagent | Browser / Node | Standalone | Plugin based: cache, http mock, rest api mock, prefix (for dev), |
frisbee | |||
Swr React Hook (stale-while-revalidate) | React | stale-while-revalidate with a HTTP cache invalidation strategy popularized by RFC 5861 - SWR first returns the data from cache (stale), then sends the fetch request (revalidate), and finally comes with the up-to-date data again. Next Doc |
mocking library such as Mswjs