So, basically, I am trying to get data from JSONbin.io. I have set the RequestHeader before I send the request. As you see there's beforeSend and  xhr.setRequestHeader("X-Master-Key", "$2b$10$QCzFeVffyq7vaiSBUfPbCeXUGV.IBpiHlWIOsDQAgj########");. But, it still say Error 401 aka unauthenticated request. I wondering if someone can help me with this. I also provide image that show that the headers is there.

Link: https://jsonbin.io/api-reference

Image: https://ibb.co/jGtFLk9

<script>
      function getKey() {
        $.ajax({
            url: 'https://api.jsonbin.io/b/624efc9cd8a4cc06909d66cd/2',
            type: "GET",
            dataType: "json",
            beforeSend: function(xhr) {
                xhr.setRequestHeader("X-Master-Key", "$2b$10$QCzFeVffyq7vaiSBUfPbCeXUGV.IBpiHlWIOsDQAgj########");
            },
            success: function(data) {
                const keyStore = data.keys;
                var copyKey = document.getElementById("KeyDisplay");
                document.getElementById('KeyDisplay').value = keyStore[Math.floor(Math.random() * 49)]
                document.getElementById('Button').textContent = "Copied Key"
                document.getElementById("Button").disabled = true;
                copyKey.select();
                navigator.clipboard.writeText(copyKey.value);
            }
        });
      }
    </script>