6. Proxies & CORS

Why cross-origin links need a helper, and how to pick your own.

The problem

A browser won't let a page read another site's response. So to preview a cross-origin link, vexy-hrefc routes the fetch through a reader proxy that hands back the page's HTML. The default chain is one entry: jina (r.jina.ai).

Pick the chain

List the proxies you want, in order. Each is tried until one works. Three are built in: jina, allorigins, corsproxy.

Hrefc({
  fetch: { proxies: ['jina', 'allorigins'] },
});

Bring your own

A proxy is just a function: take a URL and an AbortSignal, return the page's HTML as a string. Throw to fall through to the next one.

Hrefc({
  fetch: {
    proxies: [
      async (url, signal) => (await fetch(myProxy + url, { signal })).text(),
      'jina', // fall back to a built-in
    ],
  },
});

Skip the proxy when you can

Some sites send permissive CORS headers and can be read directly. Tell vexy-hrefc to try a native fetch first and only fall back to the proxy chain if it fails:

Hrefc({
  fetch: { crossOriginStrategy: 'native-first' },
});

See it

These links are cross-origin, so they go through the default jina proxy. They'll fill in when the network cooperates.

Read about a proxy server.

Or CORS on MDN.

Or the BBC News front page.