Is it fine to use the same mkcert certificate for both your frontend and backend?

I’m developing a webapp that uses vite on the frontend for my local testing environment and also a separate API backend.

I used mkcert to generate a local dev certificate and am using that one for the backend.

My question is, for my frontend dev environment I also can use a certificate, as shown here in the vite config:

server: {
  https: {
    key: fs.readFileSync('key.pem'),
    cert: fs.readFileSync('cert.pem'),
  },
  proxy: {
    '/v1': {
      target: 'https://127.0.0.1:8080'
    }
  }
}

My question is: can I use this same generated certificate (key.pem and cert.pem) for my backend and frontend servers? It seems to work okay, but I’m not sure of the implications for this.

I generated my mkcert certificate using the following command:

mkcert localhost 127.0.0.1 ::1 192.168.1.96

Answer

Short answer: Yes you can

---

Explanation:

The certificate doesn’t make difference of “frontend” or “backend” things.

It “take” only the FQDN given on creation and generally a certificate is valid for use on a single fully qualified domain name (FQDN), but it’s out of scope of this question.

What I mean is, if you create a certificate for only 127.0.0.1 and you try to load it from 192.168.1.96, you will see the certificate as invalid.

In your case, as you created the certificate for both local network IP and the public IP, then whatever you load the cert from localhost or 192.168.1.96, the certificate is valid.