【问题标题】:javascript not calling ajax for all records in uploaded CSVjavascript没有为上传的CSV中的所有记录调用ajax
【发布时间】:2019-07-13 08:07:25
【问题描述】:

我编写了一个代码来解析上传的CSV 并向Places API 发送请求以获取CSV 中的所有记录,然后将它们显示在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);});

       }

这是对进一步调用 API 的 php 页面进行 AJAX 调用的代码,请注意 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>

【问题讨论】:

    标签: javascript jquery ajax callback queue


    【解决方案1】:

    我没有测试过您的代码,但我认为问题在于 400 行同时触发了太多 AJAX 请求。 也许你可以试试这个问题的解决方案:

    How can I make batches of ajax requests in jQuery?

    【讨论】:

    • 你的意思是setTimeout吗?这不起作用。您必须等待请求的响应
    • 为此我正在使用回调
    • 你监控过ajax请求吗?同时开多少火?
    • 603,但应该不止这个
    • mh 我仍然认为这是一个时间问题,同时请求太多。如果您将问题放在例如 jsfiddle 上,我会看看
    猜你喜欢
    • 2016-08-05
    • 2018-01-24
    • 1970-01-01
    • 2013-09-20
    • 1970-01-01
    • 1970-01-01
    • 2016-07-12
    • 2010-12-13
    相关资源
    最近更新 更多