Reputation: 85
I have a route on my express server: /api/users/register. When I pass data through VIA postman I am able to register an account. However on the front-end react side I am getting: TYPE ERROR: Failed to Fetch. Here is the code
handleSubmit = (event) => {
event.preventDefault();
const isValid = this.validateForm();
console.log(isValid);
if(isValid) {
let user = {
"username" : this.state.username,
"email" : this.state.email,
"password" : this.state.password
}
var json = JSON.stringify(user);
console.log(user);
fetch('https://URL/api/user/register', {
method: 'POST',
body: json,
headers: {
'Content-Type' : 'application/json'
}
}).then(function() {
console.log('ok');
}).catch(function(err){
console.log(err);
});
}
}
Its failing on the client side and I am not sure why. I am using POST methods else where and those are working just fine. I am stuck and have been for the last day. Any ideas on what's going on?
EDIT: I realize I am getting: ERR_CERT_COMMON_NAME_INVALID from Chrome on the URL but now I am not sure how to fix this.
Upvotes: 1
Views: 1033
Reputation: 411
You are likely hitting the changes in the way latest Chrome handles SSL certs. As of Chrome 58 I believe, they deprecated CNs altogether so if you are using self-signed dev certificate (or certificate that does not have proper SAN/Subject Alternative Name) you are likely to see this error. There has been a fair bit of commotion as many commercial products now find their code broken in Chrome.
Here is Google support article on the subject: https://support.google.com/chrome/a/answer/7391219
The best solution would be to update the server certs. If it is not feasible AND you are running on Windows, in some limited number of cases you could use this registry hack as a temporary workaround:
[HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Google\Chrome] "EnableCommonNameFallbackForLocalAnchors"=dword:00000001
Hope that helps
Upvotes: 1