javascript不为上传的CSV中的所有记录调用ajax

时间:2019-07-13 08:07:25

标签: javascript jquery ajax callback queue

我已经编写了代码以解析上载的CSV并将所有CSV记录的请求发送到Places API,然后将其显示在CSV上。 代码对于csv中的少量记录工作正常,但是当我在超过400条的记录上尝试使用它时,它不会显示所有结果。

网页位于api.pkadmissions.com上,而CSV位于CSV

我尝试了几种方法,例如回调,但是没有运气

这是Javascript和HTML表代码:

            <table class="table table-hover table-condensed" id="myTable">
                <tr>
                    <td>Name</td>
                    <td>Address</td>
                    <td>Phone</td>
                    <td>Website</td>
                    <td>Rating</td>
                    <td>Lat</td>
                    <td>Lng</td>
                </tr>
            </table>            
        </div>

解析CSV的代码为:

            function uploadDealcsv () {}; 
            var parsedata_obj={results:[]};
            var parsedata=[]
            /*------ Method for read uploded csv file ------*/
            uploadDealcsv.prototype.getCsv = function(e) {

                let input = document.getElementById('qw');
                if(input){
                    input.addEventListener('change', function() {
                        $('#data').remove();
                        if (this.files && this.files[0]) {

                            var myFile = this.files[0];
                            var reader = new FileReader();

                            reader.addEventListener('load', function (e) {

                                let csvdata = e.target.result; 
                parseCsv.getParsecsvdata(csvdata); // calling function for parse csv data 
            });

                            reader.readAsBinaryString(myFile);
                        }
                    });
                } }

                /*------- Method for parse csv data and display --------------*/
                uploadDealcsv.prototype.getParsecsvdata = function(data) {

        let newLinebrk = data.split("\n");
        for(let i = 0; i < newLinebrk.length; i++) {

            parsedata.push(newLinebrk[i].split(","))
        }
           // console.log(parsedata);

           send_request(parsedata,function(a){console.log('Completed',a);});

       }

这里是使AJAX调用php页面并进一步调用API的代码,请注意send_request方法是从解析csv的方法中调用的

       var send_request = (parsedata,callback)=>{
         console.log(parsedata.length)
         for(var i=0;i<parsedata.length;i++){
            console.log(i+ " - "+ parsedata[i][0]);
            // alert(parsedata_obj.results.length+ " - "+ parsedata[i][0]);
            if(!parsedata[i][0]){
                continue
            }
            var site_name = parsedata[i][0].split('o/a')
            if(site_name.length>1){
                site_name = site_name[1];
            }
            else{
                site_name=site_name[0];
            }
            var desired = site_name.replace(/[^\w\s]/gi, '')
            var search_string = desired+' '+parsedata[i][3];
            timeouter(search_string)
        }
        callback(1);
    }
    function timeouter(search_string){
        setTimeout(
            first_call(search_string,(result)=>{
                console.log(result);
                add_tr(result);
            }),1000);
    }
    function first_call(search_string,callback){
        $.ajax({url: 'getdata.php',
            timeout:30000,
            type:'POST',
                    data:{
                        search_string:search_string.rep_all(' ','%20')
                    },
                    success: function(result1){
                        result1= JSON.parse(result1);
                        if(result1.status=='OK'){
                            var placeid = result1.candidates[0].place_id;
                            secondcall(placeid,(result)=>{
                                result=JSON.parse(result);

                                callback(result);
                            });

                        }
                        else{
                            callback({'result':search_string,'status':'NO_RESULTS'})
                        }
                    }
                });
    }
    function secondcall(placeid,callback){
        $.ajax({url: 'getdata.php',
            timeout:30000,
            data:{
                place_id:placeid
            },
                        type:'POST',
                        success:function(result){
                            callback(result);
                        }
                    })
        }

这只是向表添加一行:

    function add_tr(result){
        var name,phone,addr,lat,lng,rating,website='';

        data = result.result;
    // console.log(result);
    if(result.status=='NO_RESULTS'){
        name = data;
        $('#myTable tr:last').after('<tr id="data"><td>'+name+'</td><td></td><td></td><td></td><td></td><td></td><td></td></tr>');
    }
    else if(result.status=='OK'){

        if(data.name){
            name = data.name;   
        }
        if(data.hasOwnProperty('formatted_phone_number')){
            phone= data.formatted_phone_number;
        }
        if(data.hasOwnProperty('formatted_address')){
            addr = data.formatted_address;
        }
        if(data.hasOwnProperty('website')){
            website = data.website;
        }
        if(data.hasOwnProperty('rating')){
            rating = data.rating;
        }
        if(data.hasOwnProperty('geometry')){
            lat =data.geometry.location.lat;
        }
        if(data.hasOwnProperty('geometry')){
            lng = data.geometry.location.lng;   }
        $('#myTable tr:last').after('<tr>'+
            '<td>'+name+'</td>'+
            '<td>'+addr+'</td>'+
            '<td>'+phone+'</td>'+
            '<td>'+website+'</td>'+
            '<td>'+rating+'</td>'+
            '<td>'+lat+'</td>'+
            '<td>'+lng+'</td>'+
            '</tr>');
    }
    console.log(parsedata_obj.results.length);
}
var parseCsv = new uploadDealcsv();
parseCsv.getCsv();
</script>

1 个答案:

答案 0 :(得分:0)

我尚未测试您的代码,但我认为问题在于400行同时触发了太多AJAX请求。 也许您可以尝试解决此问题:

How can I make batches of ajax requests in jQuery?