Transferring data through asynchronous JavaScript and XML streaming

Question

Transferring data through asynchronous JavaScript and XML streaming

Is there a way to access AJAX data before the request is complete in order to achieve streaming, similar to the example below:

ajax_request.send();
interval = setInterval(function() {
    continueParsing(ajax_request.responseText);
    if (download_complete)
        clearInterval(interval);
}, 64);

Currently, I am using a PHP method to break up the request into smaller parts, but I would prefer to handle it all at once. What is the best approach to accomplish this, focusing on compatibility with Chrome and Firefox?

javascript ajax streaming

Answer 1

Answer №1

Here's a PHP snippet to get you started:

$data = file_get_contents('https://example.com/feed/');
for($x = 0; $x < 5; $x++){
   $data .= $data;
}
echo $data;

And here's a sample javascript code:

var request = new XMLHttpRequest();
request.open('get', 'ajax.php');
request.send();
request.onprogress = function(){
    console.log(this.responseText.length);              
}

When I run this, the console shows:

It seems to be working fine. Feel free to experiment further :)

Answer 2

Here's a PHP snippet to get you started:

$data = file_get_contents('https://example.com/feed/');
for($x = 0; $x < 5; $x++){
   $data .= $data;
}
echo $data;

And here's a sample javascript code:

var request = new XMLHttpRequest();
request.open('get', 'ajax.php');
request.send();
request.onprogress = function(){
    console.log(this.responseText.length);              
}

When I run this, the console shows:

It seems to be working fine. Feel free to experiment further :)

Answer 3

Answer №2

To handle this task effectively, it is recommended to utilize WebSockets along with a suitable backup plan for older browsers, such as AJAX long polling.

For PHP users, there is a project called http://code.google.com/p/phpwebsocket/ that can offer a straightforward solution. While it may not have built-in support for fallback technologies, integrating socket.io-client on top of it could potentially solve this issue and allow the phpwebsocket project to serve as your server layer.

Answer 4

To handle this task effectively, it is recommended to utilize WebSockets along with a suitable backup plan for older browsers, such as AJAX long polling.

For PHP users, there is a project called http://code.google.com/p/phpwebsocket/ that can offer a straightforward solution. While it may not have built-in support for fallback technologies, integrating socket.io-client on top of it could potentially solve this issue and allow the phpwebsocket project to serve as your server layer.

Transferring data through asynchronous JavaScript and XML streaming

Answer №1

Answer №2

Similar questions

Locate elements within an array based on certain internal characteristics

Selecting objects in Three.js using the camera but without using the mouse

A common challenge in React is aligning the button and input line on the same level

Number each element in sequence

What is the best way to immediately update the state in a React functional component?

Press the option "Switch to red button" in order to transform the text color to red, and then revert back to its initial color

Issue with data entry: unable to enter the letter 'S' in search field

Ensure the browser only reloads a single file

How to disable typescript eslint notifications in the terminal for .js and .jsx files within a create-react-app project using VS Code

Interacting with iframes using JSDOM: Manipulating div elements

Looking to transform a nested JSON structure into a visually appealing HTML table with merged rows?

Execute an API request function in the views.py file using AJAX

Challenges with fading images using jQuery

What are the best practices for storing an array of objects in MongoDB with Mongoose?

Add a variety of input values to a div in designated spots

Having trouble figuring out how to update a list using ajax in Yii

Adjust camera focus towards object and utilize the lookAt() method (React three fiber)

Maximizing the potential of Next JS 13 Server Components

"Error Encountered When Trying to Parse JSON in Javascript Due

When using fs.readFileSync, the error message "no such file or directory" may appear even though the file is successfully returned when using require()