Requests I XHR GET Requests III - getting: url undefined


#1

Hey guys im having a lot of trouble understanding this exercise. I followed all the steps and checked all the boxes but it still gives me the message ’ Your expanded url is: undefined’.

(I’m wondering if its because of the following message taken from the Google URL Shortener page “Starting March 30, 2018, we will be turning down support for goo.gl URL shortener. Please see this blog post for detailed timelines and alternatives.”)

I’ve included the screenshot below:

Here is the code:

// Include data for accessing Google APIs

const apiKey = 'user_api_key';

const url  = 'https://www.googleapis.com/urlshortener/v1/url';

const projection = 'FULL';


// Some page elements

const $inputField = $('#input');
const $expandButton = $('#expand');
const $shortenButton = $('#shorten');
const $responseField = $('#responseField');

// AJAX functions

function expandUrl() {
const urlToExpand =  url + '?key=' + apiKey +
'&shortUrl=' + $inputField.val();

const xhr = new XMLHttpRequest();
  
  xhr.responseType = 'json';
  
  xhr.onreadystatechange = function() {
    if (xhr.readyState === XMLHttpRequest.DONE) {
  console.log(xhr.response);
      
  $responseField.append('<p>Your expanded url is: </p><p>' + xhr.response.longUrl + '</p>');    
}
  };

xhr.open('GET', urlToExpand);
  xhr.send();

}

function shortenUrl() {

}

function expand() {
  $responseField.empty();
  expandUrl();
  return false;
}

function shorten() {
  $responseField.empty();
  shortenUrl();
  return false;
}

// Call functions on submit

$expandButton.click(expand);
$shortenButton.click(shorten);

Thanks in advance.


#2

Please link to the project. Thanks.


#3

Here’s the link: https://www.codecademy.com/courses/intermediate-javascript-requests/lessons/requests-i/exercises/xhr-get-requests-iii?action=resume_content_item&course_redirect=introduction-to-javascript


#4

It looks like they (CC) will have to take this course offline since it will no longer create new shortened url’s. Any that have already created accounts have another year to retrieve their data, and then that’s it for this API.


It would still be a good idea to keep your API key to yourself, and remove it from the OP, while there is still time to do so.


#5

Thanks for looking into it mate, appreciate the help.


#6

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