How to run ajax request at the same time using a setInterval?

Question

The ajax on the promise2 is not running until the first ajax is completed. I need both of these to run at the same time. When mixexport_exe is called, it will run promise2 every 500ms.

function mixexport_exe(opn) {
 mixdownactive = 1;
  getid('tool_mix_area').innerHTML = 'loading...';

  const promise1 = new Promise((resolve, reject) => {
    $.ajax({
      url: 'includes/ffmpeg_export.php?callFunction=mixexport_exe&version_id=<?=$version_dta[id] ?>&version_creaid=<?=$version_dta[version_id] ?>&exeoption=' + opn,
      success: function(data) {
        getid('tool_mix_area').innerHTML = data;
        resolve(data);
      },
      error: function(error) {
        reject(error);
      }
    });
  });

  const promise2 = new Promise((resolve, reject) => {
    setInterval(() => { 
  $.ajax({
        url: 'includes/ajax.php?callFunction=getrenderstatus',
        success: function(data) {
          console.log(data);
     
        },
        error: function(error) {
          reject(error);
        }
      });
    }, 500);
  });

  Promise.all([promise1, promise2])
    .then((values) => {
      console.log(values);
    })
    .catch((error) => {
      console.error(error);
    });
}
``

`$.ajax` returns a thenable. Wrapping it in `new Promise` is [an antipattern](https://stackoverflow.com/questions/23803743/what-is-the-explicit-promise-construction-antipattern-and-how-do-i-avoid-it). — Quentin, Mar 30 '23 at 16:22
The `ajax` in `promise2` will be executed for the first time after 500ms. — Heiko Theißen, Mar 30 '23 at 16:23
Wrapping your call to `resolve` and `reject` inside `setInterval` seems like a mistake. You never try to resolve it, and if two of the Ajax calls hit the error handler then you'll try to reject the promise multiple times, which doesn't make sense. — Quentin, Mar 30 '23 at 16:24
"The ajax on the promise2 is not running until the first ajax is completed" — How can you tell? Does the request not get sent until the response to the first one has been received? Or does the request get sent, but it doesn't get a response until afterwards? (The different is really important because it could point to the issue being client-side or server-side). — Quentin, Mar 30 '23 at 16:25
@Peter — How would you implement *what*? Nobody has suggested doing anything yet. Only *not* doing things which look like mistakes. — Quentin, Mar 30 '23 at 16:25
promise with an interval does not really make much sense. Do you ever resolve it? They will not run at same time because you are delaying the first on 500ms because of the interval. You would need to run it right away. — epascarello, Mar 30 '23 at 16:26
The promise1 and promise2 are running at the same time. I can tell this because if I call a console.log before the promise2 ajax it fires, but within the promise2 ajax doesn't run until promise1 ajax has returned. — Peter, Mar 30 '23 at 16:27
I will need the interval to run every 500ms for promise2 ajax code to run, regardless if promise1 had ended. — Peter, Mar 30 '23 at 16:29
"but within the promise2 ajax doesn't run" — Again, how can you tell that the Ajax isn't running? (The Network tab is the tool to determine that). — Quentin, Mar 30 '23 at 16:29
The 2nd Ajax call waits 500ms because of the interval.... The interval does not start right away.... — epascarello, Mar 30 '23 at 16:30
@Peter — Again: Mixing setInterval and promises in the way you are doing is broken. (It's possible to do it when you are doing something like `resolve` *and* `clearInterval` in `suggest` and counting failures before `reject` *and* `clearInterval` in `error` … but you aren't doing that). — Quentin, Mar 30 '23 at 16:31
As epascarello points out, another question is, does the second Ajax call not start before the first has finished (assuming that *is* the case as per my earlier comment) because the first finished within 500ms or for some other reason? — Quentin, Mar 30 '23 at 16:32
Maybe what you're missing is that `setInterval()` doesn't run the first iteration immediately. The first iteration runs after the interval time, and then it continues every interval. — Barmar, Mar 30 '23 at 16:32
@Quentin Thank you! I see the ajax is running in the network tab. it is just not returning any data when I call console.log(data), only when the first promise1 ajax is succeeded. — Peter, Mar 30 '23 at 16:34
Does the code you're calling in the second AJAX depend on what the first AJAX does? If it does, it might not have finished in time, so it returns an empty result. — Barmar, Mar 30 '23 at 16:36

epascarello · Answer 1 · 2023-03-30T16:41:12.947

0

You have a misunderstanding of an setInterval.When you call setInterval it does not execute the function right away. It waits for the delay. If you want it to fire right away you need to break it out into a function and call that and then make the interval.

const promise2 = new Promise((resolve, reject) => {
  let timer;

  function makeCall() {
    $.ajax({
      url: 'includes/ajax.php?callFunction=getrenderstatus',
      success: function(data) {
        console.log(data);
        if (data.yourStatus === 'complete') {
          window.clearInterval(timer);
          resolve(data);
        }
      },
      error: function(error) {
        reject(error);
      }
    });
  }

  makeCall();
  timer = setInterval(makeCall, 500);
});

edited Mar 30 '23 at 16:41

answered Mar 30 '23 at 16:36

epascarello

204,599
20
195
236

It does not matter if it fires right away at the same time, I need it to be a delay. The first promise1 excludes a FFMPEG command. the promise2 checks a status and outputs the progress. But, I do need the ajax within promise2 to run while the ajax in promise1 is running – Peter Mar 30 '23 at 16:41
It should do it either way... If not then you have something in your server that is preventing multiple http calls. Or the first call is locking up your server. – epascarello Mar 30 '23 at 16:41

How to run ajax request at the same time using a setInterval?

1 Answers1