I am working on a create-react-app that queries an API that requires a self-signed certificate to validate the request. I am grabbing the certificate through a GET request and using a helper to create a new Agent. My initial solution was to assign the httpsAgent in axios.interceptor to attach the certificate to every axios call.

But from what I understand the httpsAgent object is not being passed correctly to index.js because index.js runs in the browser and https is a core node module.

Is there a browser equivalent to https or an alternative method to sending the certificate to the back end? I saw a suggestion to proxy API requests and add the certificate that way, but I am unsure if that's the way to proceed.

Thanks so much!!

httpsAgent.js

const https = require('https');

const createAgent = (data) => {
  const httpsAgent = new https.Agent({
    ca: data,
    rejectUnauthorized: true,
    checkServerIdentity() {
      return undefined;
    },
  });
  return httpsAgent;
};

index.js

axios
  .get('/certificate.pem')
  .then(({ data }) => {
    httpsAgent = createAgent(data);
  })
  .catch((err) => {
    console.log(err);
  })
  .finally(() => {
    axios.interceptors.request.use((config) => {
      const newConfig = {
        ...config,
        httpsAgent,
      };
      return newConfig;
    });
  });