Ajax calling 401 unauthorized from backend in html

Question

I have a problem with my AJAX. Using Insomnia, I was able to get in with a successful response of 200 using the API token.

However, when I implement it in the HTML, I get a 401 response of access denied.

$.ajax({
  url: "https://ecoexchange.dscloud.me:8080/api/get",
  method: "GET",
  apikey: sessionStorage.getItem("apikey"),
  dataType: 'json',
  success: function(result) {
    $('#infoTable tr').empty();
    var header = $('#infoTable thead');
    var body = $('#infoTable tbody');
    var hTr;
    $('#infoTable thead').append(hTr = $('<tr>'));
    // Headers
    for (var h = 0; h < result.headers.length; h++) {
      hTr.append($('<th>', {
        text: result.headers[h]
      }))
    }
    // Body
    for (var d in result.data) {
      var data = result.data[d];
      $('#infoTable tbody').append($('<tr>')
        .append($('<td>', {
          text: data.RecyclableID
        }))
        .append($('<td>', {
          text: data.Name
        }))
        .append($('<td>', {
          text: data.RecyclableType
        }))
      )
    }
  }
})

I am not sure how to put in the token or user name or password.

How can I improve the code so I don't get the error?

In your browser's debugging tools, check the network request being made. Does it differ in any way from what you expect? — David, Dec 03 '21 at 14:03
The token could be passed as a header or as a post or get parameter. What do the docs say? Obviously if you don't add the token it will not authorize the request. — I wrestled a bear once., Dec 03 '21 at 14:05

score 0 · Answer 1 · answered Dec 03 '21 at 14:12

What is this apikey parameter you're using? That's not in the documentation.

apikey: sessionStorage.getItem("apikey"),

Did you mean to pass it as a header instead? For example:

headers: {"apikey": sessionStorage.getItem("apikey")},

The documentation for the service you're using should specify how to include the API key. Presumably you have that information, because:

Using Insomnia, I was able to get in with a successful response

So you'll need to include the value in your AJAX request wherever it belongs. Most likely as either a header value or a query string value. But the jQuery .ajax() function isn't going to know how to pass the value, you have to specify.

Ke1vans · Answer 2 · 2021-12-03T16:15:46.813

0

I think your problem is with passing queries which can be solved here

As it's been said on David's answer , You must know where your apikey is required on the server-side, in header or queries(parameters).

If your apikey is required on queries based on the docs you can use :

$.get('/api/get' , {'apikey' : 'YOUR-KEY'}).done((res) => {
     console.log(res) 
})

Or if your apikey is required in headers:

$.ajax({

        url: '/api/get',
        type: 'GET',
        headers: {'apikey' : 'YOUR-KEY'},
        success : (res) =>{
            console.log(res);
        }

})

jQuery.ajax() docs can be found here

And jQuery.get() docs here

edited Dec 03 '21 at 16:15

answered Dec 03 '21 at 14:28

Ke1vans

106
7

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Dec 03 '21 at 15:03

Ajax calling 401 unauthorized from backend in html

2 Answers2