XMLHttpRequest response: the connection has been terminated

After developing a Flickr search engine, I encountered an issue where the call to the public feed or FlickrApi varies depending on the selection made in a drop-down box. The JSONP function calls provide examples of the returned data:

a)

jsonFlickrApi({"photos":{"page":1, "pages":201, "perpage":100, "total":"20042", "photo":[{"id":"5101738723"...

b)

jsonFlickrFeed({ "title": "Recent Uploads tagged red","link": "http://www.flickr.com/photos/tags/red/","description": "", ....

What's perplexing is that while both functions work flawlessly on my local installation using XAMPP, the same code hosted on a domain results in the jsonFlickrApi not functioning. Upon inspection with Firebug, it appears that for the jsonFlickrApi, the response header indicates Connection close.

Additionally, when sending a request to the jsonFlickrApi, Firebug does not show a Response tab.

Below is the snippet of code in question:

function makeCall(uri)
{
    xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = callback;
    xmlhttp.open("GET", "jsonget.php?url="+uri, true);
    xmlhttp.send();
}

function jsonFlickrApi(response)
{ 
  var data= response.photos.photo ;
  var output = "";
  output += "<img src=http://farm" + data[4].farm + ".static.flickr.com/" + data[1].server + "/" + data[4].id + "_" + data[4].secret + ".jpg>";
  document.getElementById("cell-0").innerHTML = output ;
}

//Public Feed
function jsonFlickrFeed(response)
{
  var data= response.items[0].media.m ;
  alert(data);
  var output = "";
  output += "<img src=" + data+ ">";
  document.getElementById("cell-0").innerHTML = output ;
}

function callback()
{
    //console.log("Ready State: " + xmlhttp.readyState + "\nStatus" + xmlhttp.status);
    if(xmlhttp.readyState==4 && xmlhttp.status==200)
    {
                var jsonResponse = xmlhttp.responseText; 
        jsonResponse = eval(jsonResponse);
    }
}

Examples of API calls:

a)

http://flickr.com/services/rest/?method=flickr.photos.search&api_key=75564008a468bf8a284dc94bbd176dd8&tags=red&content_type=1&is_getty=true&text=red&format=json&timestamp=1339189838017

b)

http://api.flickr.com/services/feeds/photos_public.gne?tags=red&format=json&timestamp=1339190039407

Question: Why does my connection close? What is causing it to work on localhost but not on the actual domain?

Answer №1

Examining the HTTP response headers from

It returns a 302 status code with a redirect location to

This indicates that Flickr prefers users to use "www.flicker.com" instead of just "flicker.com". Accessing it through this link, I was able to retrieve the content successfully.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Sending JSON Data from Angular2 Component to Node.js Server

Currently, I am facing an issue where I am unable to successfully insert data into a database using Angular2 and Node.js. Upon running my script, I use console.log(this.address); to verify that I am passing json, and the output in the console is as follow ...

Javascript on-page scroll positioning

My current dilemma involves finding a solution to optimize in-page scrolling for mobile users. I have a sticky header on the page, which causes #section1 to place the scroll position behind the sticky header. Is there a way to adjust the scroll position b ...

Manage YouTube video played within html code

I am working on a page that contains a YouTube video embedded in HTML. I am trying to find a way to stop the video when it is closed using the YouTube API, but so far my attempts have been unsuccessful. I have included SWFObject and jQuery in the code, yet ...

What is the best way to send data from a React.js application to AWS Lambda?

I'm having trouble sending data from my React application to an AWS Lambda function through API Gateway. Here is the code snippet from my React app: const exampleObj = { firstName: 'Test', lastName: 'Person' }; fetch(process.env.R ...

Vue table displaying a list of books with a button that allows users to easily send the title of the

Hey everyone, I am new to Vue and struggling with a certain task. I have two tables: Books and Booking. Books: ID, NAME, AUTHOR etc. Booking: ID, ID_USER, ID_BOOK I'm creating a page in Vue that displays all bookings, but the table only shows the BOO ...

Issue with OnChange event in HTML and Adding Content with Jquery

I'm currently working on an app that includes a dynamic dropdown feature using jQuery and the append() method to display changing numbers dynamically. Everything seems to be functioning well in the first field of the form, but when I try to add more f ...

The fetch API does not retain PHP session variables when fetching data

After setting session variables in one php file, I am attempting to access those values in another php file. session_start(); $_SESSION['user'] = $row['user']; $_SESSION['role'] = $row['role']; However, when ...

JSON manipulation: Snowflake flattening with dynamic key changes

I am facing an issue with a table in Snowflake that has a similar structure to the one shown below, ---------------------------------------- Name | Number ---------------------------------------- Dim_1 | {'Table_1': 100} Dim_1 | {'Table_1&a ...

Shifting HTML table in Javascript by toggling checkboxes

When I click the checkbox, the table elements are not displaying inline. I am simply hiding the class "box". Do I need to write a special format? By default, the elements are displayed inline but when I check the checkbox, they shift. The column 'Stat ...

Tips for dynamically updating components within a single tab of a p:accordionPanel using AJAX from an external source

In my application, I have a custom p:accordionPanel which displays a list of items with individual forms in each tab. After submitting a form, additional data may be required, triggering a pop-up dialog (defined by p:dialog) for the user to enter the requi ...

Having trouble deciphering the JSON data structure in JavaScript

How can values be passed back to a form that was submitted to the server using Ajax? In this view (shown below), a simple data structure is returned for testing purposes: def detail(request, widget_id): widget = get_object_or_404(Widget, pk=widget_i ...

The dropdownlists mysteriously vanish forever after a modal popup, likely due to a timer issue

We are encountering some unexpected behavior with dropdown lists on a relatively complex webpage when using IE6. The layout of the page consists of 2 update panels, each containing a GridView that displays data in a master-details format. Additionally, eac ...

"JQuery conflict arises due to compatibility issues between Yoast and bbPress

Following the recent update of Yoast to version 4.7, it appears that JQuery is experiencing conflicts and not running properly. I noticed that in version 2.3.5 of Yoast, JQuery runs fine and I see this code on the page: <script type='text/javascri ...

Enhancing JavaScript Variables Through Dynamic Ajax/PHP Interaction

I've been encountering some difficulties when trying to refresh my game. Initially, I attempted echoing the entire script each time... but that method was not aesthetically pleasing. Currently, I am experimenting with updating the variables through an ...

What is the best way to update or change a value in a JSON file?

This specific file is structured in JSON format shown below: { "ClusterName": { "Description": "Name of the dbX Cluster", "Type": "String", "MinLength": "1", "MaxLength": "64", "AllowedPattern": "[-_ a-zA-Z0-9]* ...

What is the best way to display or conceal buttons when the textarea is in focus or out of focus, while still allowing them

Seeking help to include two buttons beneath the input box. One button is for saving the input in the textarea, while the other is for aborting. The buttons should only be visible when the input field is focused. An issue I am facing is that clicking on ...

Editing in real time, yet no instance to be found

I have developed my own custom non-jQuery ajax solution for building web applications. Recently, I encountered compatibility issues with IE9 while using TinyMCE, so I am considering switching to CKeditor. The editable content is contained within a div str ...

How to deselect a checkbox using AngularJS

I have a checklist of items <input type="checkbox" ng-model="servicesModel" value={{item.name}} id={{item.name}} ng-click="toggleSelection(item.name)"/> and I need to unselect the currently selected checkbox $scope.toggleSelection = function toggl ...

Function call contains an undefined parameter

When working with my Vuex store, I encounter a problem in the action section. The code snippet in question is as follows: actionSignUp({ commit, dispatch }, form) { commit("setStatus", "loading") auth.createUserWithEmailAndPasswor ...

Sending various information to a shared name JSON property within a Retrofit model

When interacting with a WebService, I need to retrieve and send data using @GET and @POST methods. However, all responses from the WebService follow a specific format: { "data": { ... }, "success": ... , "message": ...