XHR Post Requests III - Instructions all checked, no error but no response


#1

Hello, I have double checked my code but can’t seem to find out why it’s not working. I have all the checkmarks on instructions and get no error, but when I click “shorten” nothing happens. Any help would be appreciated.

// Information to reach API
const apiKey = ''; // removed for this forum post, but I have this in from the Rebrandly site.
const url = 'https://api.rebrandly.com/v1/links';


// Some page elements
const inputField = document.querySelector('#input');
const shortenButton = document.querySelector('#shorten');
const responseField = document.querySelector('#responseField');

// AJAX functions
const shortenUrl = () => {
  const urlToShorten = inputField.value;
  const data = JSON.stringify({destination: urlToShorten});
  const xhr = new XMLHttpRequest;
  xhr.responseType = 'json';
  xhr.onreadystatechange = () => {
    if (xhr.readyState === XMLHttpRequest.DONE) {
      renderResponse(xhr.response);
    }
    xhr.open('POST',url);

  };
    xhr.setRequestHeader('Content-type', 'application/json');
    xhr.setRequestHeader('apikey', apiKey);
  xhr.send(data);
}


// Clear page and call AJAX functions
const displayShortUrl = (event) => {
  event.preventDefault();
  while(responseField.firstChild){
    responseField.removeChild(responseField.firstChild);
  }
  shortenUrl();
}

shortenButton.addEventListener('click', displayShortUrl);


#2

Unfortumately, it will never work. This course should have been taken down since Google is discontinuing support for the URL Shortener.


#3

Ah, that makes sense. Thanks Roy!


#4

This topic was automatically closed after 7 days. New replies are no longer allowed.