basic authentication not working javascript

Question

I am having some trouble getting a few things working. I am trying to connect through basic authentication. I am using javascript in my HTML code. I get the following error message: " Failed to load http://**********/connections?********* : Response for preflight is invalid (redirect)" where I have redacted the API endpoint. The code I wrote is the following.

	
	
		var Key = "something";
		var Secret = "something else";
		var url = 'http://**********';
	
					$.ajax({
						
						headers: {
							  'X-******-Key':Key,
							  'X-**********Secret':Secret,
							  'Content-Type':'application/x-www-form-urlencoded'
						   },

						
						type: "GET",
						url: url,
						contentType: "application/json; charset=utf-8",
						dataType: "json",
						success: function(json) {
							 alert("Success", json);
						},
							
						error: function(XMLHttpRequest, textStatus, errorThrown) {
						   alert(textStatus, errorThrown);
						},
						
						beforeSend: function (xhr) {
							
						
							
						  xhr.setRequestHeader ("Authorization", "Basic " + btoa(Key + ":" + Secret));
						},
						type: 'GET',
						contentType: 'json',
					});

 <html>
<head>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

</head>

hi
</html>

You can substitute the API end points and secret and Key to try the code for a common basic authentication API to try the code. I don't have access to the Server. I know it is still possible to make this work because someone else said they have this working. Can anyone help me with this?

When an api has a secret key they don't want you to expose it in browser. Use a proxy on your server to talk to the api — charlietfl
– charlietfl, Commented Dec 15, 2017 at 4:45
@charlietfl so I can perhaps connect using Nodejs instead and it should work right? — cows
– cows, Commented Dec 15, 2017 at 5:02
Although you hide your key in this question, it is going to be visible to all who visit your website. (via console) You should create a node microservice which has this key and let it talk to the real server. Your front end should talk to your node microservice. — Charlie
– Charlie, Commented Dec 15, 2017 at 6:20
@CharlieH hey I tried doing this in node, but got this error : at errnoException (dns.js:28:10) at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:76:26) code: 'ENOTFOUND', errno: 'ENOTFOUND', syscall: 'getaddrinfo', — cows
– cows, Commented Dec 15, 2017 at 6:49
@charlietfl hey I tried doing this in node, but got this error : at errnoException (dns.js:28:10) at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:76:26) code: 'ENOTFOUND', errno: 'ENOTFOUND', syscall: 'getaddrinfo', — cows
– cows, Commented Dec 15, 2017 at 6:49

Charlie · Accepted Answer · 2017-12-15 04:40:25Z

1

Response for preflight is invalid (redirect)

Your server doesn't handle CORS properly.

Browsers won't let fetch data via ajax if the request is made to an external domain unless the server handles CORS properly and CORS headers are available in the responses.

Please read the article:

https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

answered Dec 15, 2017 at 4:40

Charlie

24k12 gold badges65 silver badges96 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

basic authentication not working javascript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related