Request I || XHR Post Request II


Tasks are correct but my response is not shown. What’s wrong?


Please post your raw code and a link to the exercise. Thanks.



// Include data for accessing Google APIs

const apiKey = 'Your API key';
const projection = 'FULL';

// Some page elements

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

// AJAX functions

function expandUrl() {


function shortenUrl() {
	const urlWithKey = url + '?key=' + apiKey;
  const urlToShorten = $inputField.val();
  const data = JSON.stringify({longUrl: urlToShorten});
  const xhr = new XMLHttpRequest();
  xhr.responseType = 'json';
  xhr.onreadystatechange = function() {
    if  (xhr.readyState === XMLHttpRequest.DONE) {
     $responseField.append('<p>Your shortened url is: </p><p>' + + '</p>');
  }'POST', urlWithKey);
  xhr.setRequestHeader('Content-Type', 'application/json');

function expand() {
  return false;

function shorten() {
  return false;

// Call functions on submit



url is not defined. Is that line meant to follow the line after it?

const urlToShorten = $inputField.val();
const urlWithKey = urlToShorten + '?key=' + apiKey;


Honestly I don’t know, just learning requests…


I’ve done that unit twice but CC keeps eating my code, otherwise I might have an answer for you. Did your try my suggestion?


I tried, doesn’t work.


Okay, skip the earlier suggestion. Add this line to the top, just under your key…

const url = '';

Now url is defined.


Yeeees! I just found it out, I had to delete this line accidentally. thanks!


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