NextJS: Unable to Verify the First Certificate

> UNABLE_TO_VERIFY_LEAF_SIGNATURE
Cover Image for NextJS: Unable to Verify the First Certificate
Marcel Gruber

When developing locally, you may be a rebel like me and opt to use Node to run the site instead of Docker. If so, you may run into some CORS issues along with certificate issues.

The major symptoms are that images return a 500 status code and fail to load, and the website output shows the following errors in the terminal:


_14
Failed to proxy https://sitecore102u0.sc/-/media/default-website/sc_logo.png?h=51&iar=0&w=204&hash=xxxxxxxx Error: unable to verify the first certificate
_14
at TLSSocket.onConnectSecure (node:_tls_wrap:1538:34)
_14
at TLSSocket.emit (node:events:513:28)
_14
at TLSSocket._finishInit (node:_tls_wrap:952:8)
_14
at ssl.onhandshakedone (node:_tls_wrap:733:12) {
_14
code: 'UNABLE_TO_VERIFY_LEAF_SIGNATURE'
_14
}
_14
error - Error: unable to verify the first certificate
_14
at TLSSocket.onConnectSecure (node:_tls_wrap:1538:34)
_14
at TLSSocket.emit (node:events:513:28)
_14
at TLSSocket._finishInit (node:_tls_wrap:952:8)
_14
at ssl.onhandshakedone (node:_tls_wrap:733:12) {
_14
code: 'UNABLE_TO_VERIFY_LEAF_SIGNATURE'
_14
}

I tried numerous recommendations, including adding this to my .env which didn't work:

NODE_TLS_REJECT_UNAUTHORIZED=0

So, instead of attempting to disable SSL, I genuflected before the SSL gods and decided to make SSL work.

This guide by Sitecore was helpful, but I have more to add; hence the blog post.

  1. Run certlm in a terminal. This will open the Certificate Manager.
  2. Locate the certificate that's bound to your Sitecore instance (Personal Certificates -> NameOfYourCert).
  3. Double click to open.
  4. Click the Certification Path tab.
  5. View the certificate chain and locate the root (top) certificate. We are doing this to verify that the root cert is the SIF cert.
  6. Locate that SIF cert in Trusted Root Certification Authorities --> Certificates.
  7. Right click --> All Tasks --> Export --> Do not export private key --> Save as "Base 64 encoded" --> Save to a safe location outside of your repo. The file will be saved with a .cer extension. This is good.
  8. In a new command window, run setx NODE_EXTRA_CA_CERTS C:\some\path\to\my-shiny-sif-certificate.cer. This will add a PATH / environment variable to your system called NODE_EXTRA_CA_CERTS.
  9. See success message. Close any program that even remotely resembles a command window or has a built in command window (yes, even VS/VSC), call your mom, drive around the block, and restart your computer.
  10. Profit.

The benefit of this method over changes to code is that it's a one time change, developer agnostic, and will work for all SIF installs.

By following everything mentioned above, your site should be in pretty good shape as far as errors go.

Keep BUIDLing,

MG


More Posts

Cover Image for Content Editor Search Bar Not Working

Content Editor Search Bar Not Working

> Sometimes it works, sometimes not

Cover Image for Tips for Forms Implementations

Tips for Forms Implementations

> And other pro tips

Cover Image for Hello World

Hello World

> Welcome to the show

Cover Image for NextJS: Access has been blocked by CORS policy

NextJS: Access has been blocked by CORS policy

> CORS is almost as much of a nuisance as GDPR popups

Cover Image for NextJS: Short URL for Viewing Layout Service Response

NextJS: Short URL for Viewing Layout Service Response

> Because the default URL is 2long4me

Cover Image for JSS: Reducing Bloat in Multilist Field Serialization

JSS: Reducing Bloat in Multilist Field Serialization

> Because: performance, security, and error-avoidance

Cover Image for Add TypeScript Type Checks to RouteData fields

Add TypeScript Type Checks to RouteData fields

> Inspired by error: Conversion of type may be a mistake because neither type sufficiently overlaps with the other.

Cover Image for Sitecore Symposium 2022

Sitecore Symposium 2022

> What I'm Watching 👀

Cover Image for Super Fast Project Builds with Visual Studio Publish

Super Fast Project Builds with Visual Studio Publish

> For when solution builds take too long

Cover Image for Symposium 2022 Reflections

Symposium 2022 Reflections

> Sitecore is making big changes

Cover Image for Tips for New Sitecore Developers

Tips for New Sitecore Developers

> Because learning Sitecore can be hard

Cover Image for Year in Review: 2022

Year in Review: 2022

> Full steam ahead