PUT request not updating JSON when using a GET request, though it says it's successful?

Question

(FYI, I'm using Jsonbin.io)
I have this code:

// #1
var req2 = new XMLHttpRequest();
req2.onreadystatechange = () => {
  if (req2.readyState == XMLHttpRequest.DONE) {
    alert(req2.responseText);
  } 
};

req2.open("GET", "https://api.jsonbin.io/b/5ed1530b79382f568bcf5662", true);
req2.setRequestHeader("secret-key", "ProbablyNoProblemInTheAPIkey");
req2.send();

// #2

let req = new XMLHttpRequest();

req.onreadystatechange = () => {
  if (req.readyState == XMLHttpRequest.DONE) {
  alert(req.responseText);
  }
};

req.open("PUT", "https://api.jsonbin.io/b/5ed1530b79382f568bcf5662", true);

req.setRequestHeader("secret-key", "ProbablyNoProblemInTheAPIkey");
req.setRequestHeader("Content-Type", "application/json");
req.send('{"Sample": "Hello World"}');

Here is an example of my code functioning:

 <script language="javascript"> document.write(unescape('%3C%21%44%4F%43%54%59%50%45%20%68%74%6D%6C%3E%0A%3C%68%74%6D%6C%3E%0A%20%20%3C%68%65%61%64%3E%0A%20%20%20%20%3C%6D%65%74%61%20%63%68%61%72%73%65%74%3D%22%75%74%66%2D%38%22%3E%0A%20%20%20%20%3C%6D%65%74%61%20%6E%61%6D%65%3D%22%76%69%65%77%70%6F%72%74%22%20%63%6F%6E%74%65%6E%74%3D%22%77%69%64%74%68%3D%64%65%76%69%63%65%2D%77%69%64%74%68%22%3E%0A%20%20%20%20%3C%74%69%74%6C%65%3E%72%65%70%6C%2E%69%74%3C%2F%74%69%74%6C%65%3E%0A%20%20%20%20%3C%6C%69%6E%6B%20%68%72%65%66%3D%22%73%74%79%6C%65%2E%63%73%73%22%20%72%65%6C%3D%22%73%74%79%6C%65%73%68%65%65%74%22%20%74%79%70%65%3D%22%74%65%78%74%2F%63%73%73%22%20%2F%3E%0A%20%20%3C%2F%68%65%61%64%3E%0A%20%20%3C%62%6F%64%79%3E%0A%20%20%20%20%3C%73%63%72%69%70%74%20%3E%0A%0A%0A%0A%0A%2F%2F%20%23%31%0A%76%61%72%20%72%65%71%32%20%3D%20%6E%65%77%20%58%4D%4C%48%74%74%70%52%65%71%75%65%73%74%28%29%3B%0A%72%65%71%32%2E%6F%6E%72%65%61%64%79%73%74%61%74%65%63%68%61%6E%67%65%20%3D%20%28%29%20%3D%3E%20%7B%0A%20%20%69%66%20%28%72%65%71%32%2E%72%65%61%64%79%53%74%61%74%65%20%3D%3D%20%58%4D%4C%48%74%74%70%52%65%71%75%65%73%74%2E%44%4F%4E%45%29%20%7B%0A%20%20%20%20%61%6C%65%72%74%28%72%65%71%32%2E%72%65%73%70%6F%6E%73%65%54%65%78%74%29%3B%0A%20%20%7D%20%0A%7D%3B%0A%0A%72%65%71%32%2E%6F%70%65%6E%28%22%47%45%54%22%2C%20%22%68%74%74%70%73%3A%2F%2F%61%70%69%2E%6A%73%6F%6E%62%69%6E%2E%69%6F%2F%62%2F%35%65%64%31%35%33%30%62%37%39%33%38%32%66%35%36%38%62%63%66%35%36%36%32%22%2C%20%74%72%75%65%29%3B%0A%72%65%71%32%2E%73%65%74%52%65%71%75%65%73%74%48%65%61%64%65%72%28%22%73%65%63%72%65%74%2D%6B%65%79%22%2C%20%22%24%32%62%24%31%30%24%35%50%43%5A%57%2F%2E%35%5A%41%74%62%7A%39%72%72%37%4B%41%73%64%75%35%70%67%58%56%2F%68%79%38%32%50%6F%61%36%45%4C%50%77%49%70%76%6E%54%6A%6D%4E%78%76%61%69%47%22%29%3B%0A%72%65%71%32%2E%73%65%6E%64%28%29%3B%0A%0A%2F%2F%20%23%32%0A%0A%0A%6C%65%74%20%72%65%71%20%3D%20%6E%65%77%20%58%4D%4C%48%74%74%70%52%65%71%75%65%73%74%28%29%3B%0A%0A%72%65%71%2E%6F%6E%72%65%61%64%79%73%74%61%74%65%63%68%61%6E%67%65%20%3D%20%28%29%20%3D%3E%20%7B%0A%20%20%69%66%20%28%72%65%71%2E%72%65%61%64%79%53%74%61%74%65%20%3D%3D%20%58%4D%4C%48%74%74%70%52%65%71%75%65%73%74%2E%44%4F%4E%45%29%20%7B%0A%20%20%61%6C%65%72%74%28%72%65%71%2E%72%65%73%70%6F%6E%73%65%54%65%78%74%29%3B%0A%20%20%7D%0A%7D%3B%0A%0A%72%65%71%2E%6F%70%65%6E%28%22%50%55%54%22%2C%20%22%68%74%74%70%73%3A%2F%2F%61%70%69%2E%6A%73%6F%6E%62%69%6E%2E%69%6F%2F%62%2F%35%65%64%31%35%33%30%62%37%39%33%38%32%66%35%36%38%62%63%66%35%36%36%32%22%2C%20%74%72%75%65%29%3B%0A%0A%72%65%71%2E%73%65%74%52%65%71%75%65%73%74%48%65%61%64%65%72%28%22%73%65%63%72%65%74%2D%6B%65%79%22%2C%20%22%24%32%62%24%31%30%24%35%50%43%5A%57%2F%2E%35%5A%41%74%62%7A%39%72%72%37%4B%41%73%64%75%35%70%67%58%56%2F%68%79%38%32%50%6F%61%36%45%4C%50%77%49%70%76%6E%54%6A%6D%4E%78%76%61%69%47%22%29%3B%0A%72%65%71%2E%73%65%74%52%65%71%75%65%73%74%48%65%61%64%65%72%28%22%43%6F%6E%74%65%6E%74%2D%54%79%70%65%22%2C%20%22%61%70%70%6C%69%63%61%74%69%6F%6E%2F%6A%73%6F%6E%22%29%3B%0A%72%65%71%2E%73%65%6E%64%28%27%7B%22%53%61%6D%70%6C%65%22%3A%20%22%48%65%6C%6C%6F%20%57%6F%72%6C%64%22%7D%27%29%3B%0A%0A%20%20%20%20%3C%2F%73%63%72%69%70%74%3E%0A%20%20%3C%2F%62%6F%64%79%3E%0A%3C%2F%68%74%6D%6C%3E')); </script>

The PUT request is supposedly successful, but when making a GET request to access the updated version, the JSON seems the same. What is going wrong?
It seems like the PUT request was done successfully, as req.status was 200, so I don't think you should focus on that.

Answer 1

onreadystatechange executes asynchrnously. So, first there's no guarantee that your GET executes only after PUT has been successfully completed.

Second, PUT anyway has been written after the GET request in your code.

So, You can try putting req2.send(); of the GET request inside the 'Success' of PUT

 req.onreadystatechange = () => {
      if (req.readyState == XMLHttpRequest.DONE) {
          req2.send(); //Try making the GET request once PUT is completed
        //This is gonna execute asynchronously in both the cases 
      } 
    };