Is it possible to ignore self-signed errors using fetch?

[astrodomas]

Hello, since nextjs mandates using the web fetch api which it extends. Is it possible to ignore self-signed tls certs? As to my knowledge web fetch does not allow that. Meaning, that on the server-side I can't call my api layer.

Using nextjs built in fetch - there is no option to pass a httpsAgent or anything, that would give an option to ignore the TLS.

Also, this is probably not related to this issue (as it's regarding the nextjs middleware layer): #49546

Code snippets of working examples

const fetch = require('node-fetch');
const https = require('https');

const { request, Agent, ProxyAgent } = require('undici');

const httpsAgent = new https.Agent({
  rejectUnauthorized: false,
});

const node_fetch_req = async () => {
  const response = await fetch('https://mySecureApi/api/v1/endpoint', {
    headers: {
      Host: 'hostname',
    },
    agent: httpsAgent,
  })
    .then((response) => {
      // Check if the response is JSON
      if (response.headers.get('Content-Type')?.includes('application/json')) {
        return response.json(); // Parse the JSON
      } else {
        return response.text(); // Otherwise, return the response as text (could be HTML)
      }
    })
    .then((data) => {
      // Handle the response (either JSON or HTML)
      console.log(data);
    });
  return response;
};

node_fetch_req();

const undici_fetch_req = async () => {
  const response = await request('https://mySecureApi/api/v1/endpoint', {
    headers: {
      Host: 'hostname',
    },
    dispatcher: new Agent({
      connect: {
        rejectUnauthorized: false,
      },
    }),
  })
    .then(async (resp) => {
      const content = await resp.body.text();
      console.log(content);
    })
    .catch((error) => {
      console.error('Error:', error);
    });

  return response;
};

undici_fetch_req();

const native_fetch_request = async () => {
  const response = await fetch('https://mySecureApi/api/v1/endpoint', {
    headers: {
      Host: 'hostname',
    },
    dispatcher: new Agent({
      connect: {
        rejectUnauthorized: false,
      },
    }),
  })
    .then(async (resp) => {
      const content = await resp.text();
      console.log(content);
    })
    .catch((error) => {
      console.error('Error:', error);
    });

  return response;
};

native_fetch_request();

[icyJoseph]

Could you read through here? nodejs/undici#1489 (comment)

[astrodomas]

I'll try the same fetch with node 18

[icyJoseph]

That should've been a safe version. Ugh, this kind of thing shouldn't be so complicated 😅

I have ran out of time for now. https://github.com/vercel/next.js/blob/canary/packages%2Fnext%2Fsrc%2Fserver%2Flib%2Fpatch-fetch.ts here's where Next.js patches the global fetch.

Do keep posting updates, maybe later today I can jump back in.

[astrodomas]

Tried with node v18 and v20, and native fetch, same thing. Getting 404:

const native_fetch_request = async () => {
  const response = await fetch('https://mySecureApi/api/v1/endpoint', {
    headers: {
      Host: 'hostname',
    },
    dispatcher: new Agent({
      connect: {
        rejectUnauthorized: false,
      },
    }),
  })
    .then(async (resp) => {
      const content = await resp.text();
      console.log(content);
    })
    .catch((error) => {
      console.error('Error:', error);
    });

  return response;
};

native_fetch_request();

[icyJoseph]

Mmm maybe the agent needs more options? Super odd, of all errors a 404 is kind of weird

Are you able to debug this on the other API?

Fetching pokemon, todos, etc other data, does work right? (With a custom agent)

[astrodomas]

I have change the dispatcher property to agent. Seems to be working on https://google.com, however not on my nginx server:
code: 'ERR_TLS_CERT_ALTNAME_INVALID' . I guess this will be related to my nginx server.