javascript - Polymer iron-ajax and asynchronous requests (etag sync and response handling) - Stack Overflow

admin管理员组

文章数量:1313266

I'm looking for a tried and true way of handling asynchronous calls to API endpoints returning JSON (using polymer's latest rendition of the iron-ajax element). These API calls rely on etag matching, so it is important that the etag sent matches the one on the server. I have that part working, except in certain circumstances, where quick succession API calls may cause an out-of-sequence response (and therefore can get the etag out of sync). There are also multiple API endpoints (i.e. different URLs). So, sometimes if quick succession calls using different endpoints are initiated via an iron-ajax element, it can cause issues for the response handler function, as the response handler currently checks the URL of the ajax element to know how to handle the response appropriately. Therefore, if the 2nd call overwrites the URL of the ajax ponent before the 1st call response is received, when the 1st call does e back the responseHandler doesn't handle it appropriately. Perhaps there is a much better and reliable way of checking exactly which call has returned?

I know I'm not the first person to encounter this scenario, so I'm wondering if someone out there can show me the enlightened path? I'm thinking there is a simple strategy to handle this problem, perhaps implementing call queuing etc., but I'm not sure if iron-ajax has anything built-in that could help in that regard.

An example with some sample code would be absolutely stupendous!

I'm looking for a tried and true way of handling asynchronous calls to API endpoints returning JSON (using polymer's latest rendition of the iron-ajax element). These API calls rely on etag matching, so it is important that the etag sent matches the one on the server. I have that part working, except in certain circumstances, where quick succession API calls may cause an out-of-sequence response (and therefore can get the etag out of sync). There are also multiple API endpoints (i.e. different URLs). So, sometimes if quick succession calls using different endpoints are initiated via an iron-ajax element, it can cause issues for the response handler function, as the response handler currently checks the URL of the ajax element to know how to handle the response appropriately. Therefore, if the 2nd call overwrites the URL of the ajax ponent before the 1st call response is received, when the 1st call does e back the responseHandler doesn't handle it appropriately. Perhaps there is a much better and reliable way of checking exactly which call has returned?

I know I'm not the first person to encounter this scenario, so I'm wondering if someone out there can show me the enlightened path? I'm thinking there is a simple strategy to handle this problem, perhaps implementing call queuing etc., but I'm not sure if iron-ajax has anything built-in that could help in that regard.

An example with some sample code would be absolutely stupendous!

• javascript
• ajax
• asynchronous
• polymer
• polymer-1.0

Share Improve this question Follow asked Nov 20, 2015 at 20:54 sinjinssinjins 4371010 silver badges2222 bronze badges 2

• What are you running as the server?? – Blindman67 Commented Nov 20, 2015 at 21:07
• I'm running python web server using python-eve rest api (python-eve) in front of an instance of MongoDB. – sinjins Commented Nov 20, 2015 at 21:18

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 10

If you depend on multiple API endpoints, I would have a separate iron-ajax element for each one so that they don't stomp on each other if the URLs change (through data-binding or something):

<iron-ajax id="cats" url="https://api.example./cats" handle-as="json"></iron-ajax>
<iron-ajax id="dogs" url="https://api.example./dogs" handle-as="json"></iron-ajax>

Generate the requests, and use Promise.all() to wait for both requests to plete:

<script>
    Polymer({
        is: 'my-element',

        ...,

        fetchPets: function () {
            var catsRequest = this.$.cats.generateRequest();
            var dogsRequest = this.$.dogs.generateRequest();

            Promise.all([catsRequest.pletes, dogsRequest.pletes])
                .then(function (requests) {
                    var cats = requests[0].response;
                    var dogs = requests[1].response;

                    // do whatever you want from here...
                    alert(cats.concat(dogs));
                });
        }
    })
</script>

Firstly iron-ajax uses iron-request under the skin and that returns a Promise.

I think what you are trying to achieve is that with a string of sequential calls, you can have the same order of responses, despite them all running, possibly in parallel.

This article has an example of doing this with a set of chapters from a story http://www.html5rocks./en/tutorials/es6/promises/

The article gives an online example here: http://www.html5rocks./en/tutorials/es6/promises/async-best-example.html

In essence it is doing a Promise.all(array of requests).then(...) to give you an ordered array of responses.

If you look at the source code for iron-ajax, you will see how it creates the iron-request, and then uses it. You could do the same but based on the example I have pointed to above.

If I have misunderstood, and you are trying to ensure the requests go out sequentially, then you can still do that with Promises, but instead of using Promise.all, you chain them with .then clauses one after the other.

本文标签： javascriptPolymer ironajax and asynchronous requests (etag sync and response handling)Stack Overflow