It does, however, lack certain features (such as progress monitoring) that XMLHttpRequest provides.

Programs that repeatedly reference the same variables enjoy good temporallocality..For programs with stride-k reference patterns, the smaller the stride, thebetter the spatial locality. Programs with stride-1 reference patterns have goodspatial locality. Programs that hop around memory with large strides havepoor spatial locality..Loops have good temporal and spatial locality with respect to instructionfetches. The smaller the loop body and the greater the number of loop it-erations, the better the locality.

No need to debounce fetch (terrible UX), just fire them away

const fetchWithJSONHeaders = applyDefaults(fetch, { headers: { "Content-Type": "application/json" } }); const fetchWithTextHeaders = applyDefaults(fetch, { headers: { "Content-Type": "application/text" } }); // Fetch JSON content const response = await fetchWithJSONHeaders("/users", { method: "GET" });

while with server/externalFetch there is no direct way to pass cookie headers from the original request to the external one

Right now I am working around this issue by having an internal [...api].js, then call fetch for that endpoint (which automatically passes on cookies) and from there hit the actual external endpoint. It works, there is no risk of leaking anything, but imo shouldn't be necessary.

Sure you can abuse session but I don't like that since there is the risk of exposing credentials to client side code.

This function allows you to modify (or replace) a fetch request for an external resource that happens inside a load function that runs on the server (or during pre-rendering). For example, your load function might make a request to a public URL like https://api.yourapp.com when the user performs a client-side navigation to the respective page, but during SSR it might make sense to hit the API directly (bypassing whatever proxies and load balancers sit between it and the public internet).

Unlike browsers, you can access raw Set-Cookie headers manually using Headers.raw(). This is a node-fetch only API.

When fetch runs on the server, the resulting response will be serialized and inlined into the rendered HTML. This allows the subsequent client-side load to access identical data immediately without an additional network request.

I don't know how much workaround is it, but for now I'm using this approach:

would be different depending on whether the fetch is internal or external

export function get(req, res) { if (req.headers.authorization) { res.writeHead(200); res.end(JSON.stringify({ message: req.headers.authorization })); } else { res.writeHead(200); res.end(JSON.stringify({ message: 'unauthorized' })); } }

We implemented isomorphic fetching (i.e. fetching with the browser's implementation on the client and node-fetch on the server)

fetch: (url: string, opts?: any)

if (parsed.protocol) { // external fetch response = await fetch(parsed.href, /** @type {import('node-fetch').RequestInit} */ (opts)); } else { // otherwise we're dealing with an internal fetch const resolved = resolve(request.path, parsed.pathname);

import '@sveltejs/kit/install-fetch';

the Hypothes.is extension called “Fetch”:

I have created a thin wrapper around fetch() with many improvements if you are using a purely json REST API:

Cookieless by Default Unlike XMLHttpRequest, not all implementations of Fetch will send cookies so your application’s authentication could fail.

he basic syntax is: let promise = fetch(url, [options])

By default, fetch() doesn’t provide a way to intercept requests, but it’s not hard to come up with a workaround. You can overwrite the global fetch method and define your own interceptor, like this

If your only reason for using Axios is backward compatibility, you don’t really need an HTTP library. Instead, you can use fetch() with a polyfill like this to implement similar functionality on web browsers that do not support fetch(). To begin using the fetch polyfill, install it via npm command: npm install whatwg-fetch --save

The ReadableStream interface of the Streams API represents a readable stream of byte data. The Fetch API offers a concrete instance of a ReadableStream through the body property of a Response object.

// Download a json but don't reveal who is downloading it fetch("sneaky.json", {referrerPolicy: "no-referrer"}) .then(function(response) { /* consume the response */ }); // Download a json but pretend another page is downloading it fetch("sneaky.json", {referrer: "https://example.site/fake.html"}) .then(function(response) { /* consume the response */ }); // You can only set same-origin referrers. fetch("sneaky.json", {referrer: "https://cross.origin/page.html"}) .catch(function(exc) { // exc.name == "TypeError" // exc.message == "Referrer URL https://cross.origin/page.html cannot be cross-origin to the entry settings object (https://example.site)." }); // Download a potentially cross-origin json and don't reveal // the full referrer URL across origins fetch(jsonURL, {referrerPolicy: "origin-when-cross-origin"}) .then(function(response) { /* consume the response */ }); // Download a potentially cross-origin json and reveal a // fake referrer URL on your own origin only. fetch(jsonURL, {referrer: "https://example.site/fake.html", referrerPolicy: "origin-when-cross-origin"}) .then(function(response) { /* consume the response */ });