Chrome rejects localhost API calls with SSL certificate signed by internal CA Authority
After having Chrome refusing to accept self signed certificates when testing in localhost a web application, following advice from here, here and here I have set up a local Certification Authority and created SSL certificates with Subject Alternative Names. Now I can run the web application in
https://localhost and have a green secure icon in the url bar in both Firefox and Chrome.
The problem now is that the application makes API calls to
https://localhost:8010. While Firefox handles these requests, Chrome is rejecting them with
Inspecting the certificate returned by the API seems its using the valid certificate and everything is setup fine:
> sudo openssl s_client -CAfile /etc/ssl/certs/ca.pem -connect localhost:8010 | openssl x509 -noout -text depth=1 CN = localhost, C = ES, emailAddress = email@example.com, O = ThermoHuman, OU = Development verify return:1 depth=0 CN = localhost, ST = Asturias, C = ES, emailAddress = firstname.lastname@example.org, O = ThermoHuman, OU = Development verify return:1 Certificate: Data: Version: 3 (0x2) Serial Number: 1 (0x1) Signature Algorithm: sha256WithRSAEncryption Issuer: CN=localhost, C=ES/emailAddressemail@example.com, O=ThermoHuman, OU=Development Validity Not Before: Oct 9 10:05:14 2018 GMT Not After : Oct 6 10:05:14 2028 GMT Subject: CN=localhost, ST=Asturias, C=ES/emailAddressfirstname.lastname@example.org, O=ThermoHuman, OU=Development Subject Public Key Info: Public Key Algorithm: rsaEncryption Public-Key: (2048 bit) Modulus: 00:b4:57:e4:13:da:84:cd:53:ca:2e:4d:4b:1d:4e: 95:54:26:bd:53:b3:75:9f:30:9a:0b:64:74:38:e0: 7c:c0:88:fd:e7:20:eb:4d:0c:1e:73:fe:1b:3d:79: e7:24:88:4f:30:b1:64:ee:d5:45:11:65:cd:8a:e8: 8f:93:f1:d5:d4:dd:21:f6:12:3b:3f:81:19:79:e8: f2:94:ec:e1:d5:11:42:f0:71:99:75:6a:a5:44:50: 5a:9d:56:93:b7:d2:10:b9:22:9e:e4:ab:2b:5d:be: 1c:a5:1b:5f:34:d2:31:a0:9e:ab:bb:02:23:6c:21: fc:9e:f3:c0:7e:ad:0a:2f:cb:23:a7:0c:02:68:1f: 92:b0:51:de:39:7d:d9:ee:e8:13:f2:2f:99:b9:60: c0:d4:77:65:e5:67:38:4e:c0:87:1f:07:de:1d:bf: f4:63:84:ba:f3:04:4d:2e:52:49:6e:0a:f5:2c:62: 4f:22:ae:42:d0:6a:e6:9f:07:bf:34:7e:2c:45:b0: a3:06:37:51:94:93:14:06:2a:3c:84:ef:9b:73:39: 33:5b:31:a0:db:09:99:38:8e:08:68:dd:b9:2e:7d: e7:bf:34:a5:d2:47:80:0e:ee:89:75:d5:cc:b4:c1: f3:3a:bd:f7:b6:18:98:1a:f0:ac:bf:0a:52:30:54: a7:21 Exponent: 65537 (0x10001) X509v3 extensions: X509v3 Basic Constraints: CA:FALSE X509v3 Key Usage: Digital Signature, Non Repudiation, Key Encipherment X509v3 Subject Alternative Name: DNS:localhost, IP Address:192.168.0.254, IP Address:127.0.0.1 Signature Algorithm: sha256WithRSAEncryption 38:f3:61:1a:c3:6c:93:14:39:d5:ad:a8:7d:62:08:cc:c5:8d: f6:45:09:39:d5:8f:e2:a9:ac:16:f9:eb:d8:8d:b3:6a:07:3a: 97:26:3d:cf:5a:1c:43:ae:c5:e7:7b:44:33:a2:68:be:e4:a6: ba:90:c2:cf:5a:d4:55:d7:e1:2e:1c:d0:9b:85:77:e6:5c:a0: 0e:49:fa:80:07:4d:22:eb:93:3f:28:2b:02:af:35:0c:2a:b6: 20:7b:09:bd:8b:4b:3b:26:f1:bc:cc:14:e3:09:88:40:89:56: bb:1b:ae:12:bf:8f:d7:74:10:7b:30:25:08:de:37:70:67:a2: a3:23:cc:a9:ea:c5:1d:08:76:fd:a4:5f:4c:53:5b:42:b2:81: 26:3b:c6:c7:48:cf:ea:c7:21:92:02:45:33:f8:02:9d:a0:b0: d2:a1:48:3f:ed:c9:66:69:e4:49:b4:bb:7c:30:e7:3a:3e:dd: 92:33:1d:a8:1d:38:89:75:ae:90:92:86:ef:ac:3f:0e:21:15: 57:09:19:58:20:84:94:59:3c:d1:09:33:2e:74:dd:26:cd:81: a2:bb:e7:d1:5e:af:99:dc:68:da:cb:bb:c6:b6:f3:50:9e:80: db:8a:31:4f:1c:f8:51:90:d8:ad:21:d0:0c:3f:16:3d:59:0f: 6e:ed:69:17
Just to test I have put a
test.html file in the API endpoint so I can make a normal HTTP request and see what happens.
In Firefox I get for both pages
https://localhost:8000 (the web app) and
https://localhost:8010/test.html (the API endpoint) a green lock in the url bar. The certificate is correct and the connection is encrypted using
TLS 1.2 in both requests.
Doing the same in Chrome fails for the API endpoint. The Security Tab of Developer Tools reveals a Certificate Valid and Trusted but it does not have the Connection Secure with
TLS 1.2 indication. See the screenshots below.
I don't know where to look for the error so, how can I debug what is happening in Chrome?