Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 4 years ago.
Improve this question
I will need to pull data from many datasources - this is a time-consuming process.
If user sends the form the program pulls data from 7 tables ( using ajax )
I would like to provide an information what is actually going on ,for example "Pulling data from table1" , "Pulling data from table2" and so on.
but have no idea how to do this - Is there a good standard for this kind of task ?
I am using python/django as a backend
Thanks in advance
You can use the XHR onprogress function to stream data in JavaScript. The function gets called periodically whenever data is flushed from the server. So use sys.stdout.flush() in Python to force a flush whenever you want to display the current status.
test.py
import sys
import time
for x in range(5):
print(x)
sys.stdout.flush()
time.sleep(1)
test.html
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<button id="btn">Begin Stream</button>
<div id="app"></div>
<script>
$(function() {
$("#btn").on("click", () => {
$.ajax('test.py', {
xhrFields: {
onprogress: (e) => {
$("#app").html(e.currentTarget.response);
}
}
})
.done((data) => {
$("#app").html(`DONE: ${data}`);
})
.fail((data) => {
$("#app").html(`ERROR: ${data}`);
});
});
});
</script>
Related
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed last month.
Improve this question
I have websocket connection between client(browser) & server.
Problem is, sometimes I request a data through websocket.
But since websocket works like an event, I cannot manage my code efficiently.
I can send websocket message in a function but then I have to listen and handle it on the event listener.
Below is example.
const ws = new WebSocket("ws://whatever");
function handleClickBtn() {
ws.send('request something');
// cannot get response here
}
ws.onmessage = function (event) {
console.log(`response comes here: ${event.data}`);
}
It seems harder to maintain my code since you have to jump between request and response.
If I've used REST API, it would been easier with async/await syntax.
What kind of technique can be used here?
You'll need to think in async terms and indeed handle many potential in-flight requests at the same time. To be able to do this, you will need to be able to relate the incoming responses to requests you sent previously. For example, you could add random ids to your requests, and the response to it will contain the same id. E.g.:
Request:
[82512903521, "fetch-data", "param1", "param2"]
Response:
[82512903521, {"some": "returned", "data": ...}]
Then internally you keep a list of request ids you sent, together with an appropriate callback function which you'll trigger when the corresponding response returns. E.g. something like:
const requests = {};
function request(callback, ...params) {
const id = randomId();
ws.send([id, ...params])
requests[id] = callback;
}
ws.onmessage = function (event) {
const [id, data] = event.data;
requests[id](data);
}
There are existing protocols and libraries that implement this kind of this, for example WAMP.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 months ago.
Improve this question
I have a simulated real time app. I send a csv file to rabbitmq. And rabbitmq sends back the queues. In my client app, ag grid cannot keep with the speed of the received messages. I am using websocket.
I wonder how can I control the speed of those messages, either in rabbitmq, node js, websocket in the server or client? I want to control the speed of each response, e.g. To send/receive every response every second, minute, etc.
Thanks in advance
The solution was to control the flow of the queues. Use prefetch to indicate how many queues you want to consume at each time, and add a set time to indicate how often
channel.prefetch(1);
channel.consume(
queue,
msg => {
if (msg !== null) {
if(msg) {
setTimeout(() => {
console.log(msg.content.toString());
sendQueuesToWebSocket(msg.content.toString());
channel.ack(msg);
}, 50)
}
} else {
console.log('Consumer cancelled by server');
}
},
{
noAck: false,
}
);
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 months ago.
Improve this question
I'm sending data to the target device using device.sendReport(reportID, dataBuffer) of WebHID, but trying to read the response before it gets ready (i.e) the response takes time to be generated.
For now by setting timeout for 10ms, I'm able to get the response. Would like to know if there are any better solution for this.
You haven't said how the device provides the response but I assume that it is in the form of an input report. In that case the Promise returned by sendReport() isn't particularly interesting but instead you want to listen for an inputreport event that will be fired at the HIDDevice. If you want you can turn this into a Promise like this,
const response = new Promise((resolve) => {
device.addEventListener('inputreport', resolve, { once: true });
});
await device.sendReport(...your data...);
const { reportId, data } = await response;
Once the response is received it will be stored in data.
Note that this assumes that the device only generates input reports in response to a request. For a device with more complex communications you may want to have an inputreport event listener registered at all times and process input reports based on their report ID or other factors. HID does not support any backpressure so if you don't have an inputreport event listener registered when a report is sent by the device it will be discarded.
For this type of action you should use asynchronous code. When sending/receiving things to or from a server, this action is a 'Promise' which is asynchronous.
It'll look something like this (using the fetch api as an example):
With callbacks (which are optional)
myFunction = () => {
fetch('POST', data)
.then((response) => {
console.log(response);
})
.catch((error) => {
console.warn(error);
});
}
With async/await. This is not recommended in most cases, as this assumes that the request will succeed.
myFunction = async () => {
const response = await fetch('POST', data);
console.log(response);
}
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
I am currently using an API to create a React Redux application. My problem is I am confused about how to efficiently use the data as the API has more than 14470 "pages" to navigate around. My main goal is to display certain items in the API based on key value pair. For example I would say I want to display a category in the API based on a certain key value pair such as "highestRating" and want to map through the API to find out the five items with the highestRating, how would I be able to do this efficiently?
What I have tried so far is looping to get the entire API available to me but then I get stuck with my current task at hand.
export const fetchHighestRating = () => async dispatch => {
let data = [];
let morePagesAvailable = true;
let currentPage = 0;
while (morePagesAvailable) {
currentPage++;
const response = await api.get(
`/api?page%5Blimit%5D=10&page%5Boffset%5D=${currentPage}`
);
data = [...data , response];
morePagesAvailable = currentPage < 17471;
}
dispatch({ type: FETCH_HIGHEST, payload: data });
};
This is not a javascript problem, it is database. You should run query directly in database to test response speed and decide what to do next, including:
Sharding
Indexing
Optimize config of DB
....
Any above required research in type of DB you are using, the current situation of DB so there is no exactly answer now!
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
Is there any way to store a session using javascript variable and display on a label on another page? I'm using ASP.NET WebForms C#.
Thanks.
Depends on what you mean by "session" - as in "managed by ____".
As commented above, "sessions" can be managed by the server (safer, particularly if you want to have "full control" over what data be persisted)
but it's not the "only" place you can create "sessions". See WebStorage, if your needs can live on the client side of things.
Stating the obvious, it's client side so it can be manipulated (trivially) by the user/client so just like anything coming from the client, never trust (always validate/check).
Trivial example (must improve):
In some _Layout page (or master page, or some Javascript library for your site):
var ClientSession = function() {
this.setItem = function(key, value) {
sessionStorage.setItem(key, value);
}
this.getItem = function(key) {
return sessionStorage.getItem(key);
}
}
var mySessionBroker = new ClientSession();
In some other page where you set items for the duration of the browser session
<script>
window.mySessionBroker.setItem("key1", "hello from Index page");
//At this point, you should see that you can store something generated from the server
//and manage it from that point forward in javascript/client like so:
window.mySessionBroker.setItem("key2", "<%=HttpUtility.JavaScriptStringEncode(SomeServerVariable) %>");
</script>
In any other page on your site (same domain/protocol) where you want to use/display, etc. items set in sessionStorage
<p>Session data: <input id="someInput" name="foo" /></p>
<script>
window.onload = function() {
var target = document.getElementById("someInput");
target.value = window.mySessionBroker.getItem("key1");
}
</script>
You can use browser dev tools to inspect both sessionStorage and localStorage (goes without saying that as above, if you can, anyone else can - hence validate/inspect and don't use it for sensitive items).
Hth..