回传大量的HTML数据需要花费很多时间PHP

时间:2017-02-07 14:46:21

标签: javascript php jquery json ajax

我有15k的JSON产品需要用PHP处理,如果我var_dump数组我没有问题。 如果我将JSON数据减少到1000-1500需要1/2秒,并且由两个执行一些jquery操作的按钮组成的用户界面需要几秒钟。 问题很明显,当我传递所有数据(15k)时,显示HTML页面需要40/50秒,如果我点击按钮则不能正常工作。

这就是我所做的: 从外部URL获取JSON(没问题)。 使用AJAX(POST)将JSON传递给PHP,(没问题)。 在PHP文件中获取字符串,在数组中编码字符串并处理每个数据,在data_processing正常后我将数据回显为

<? 
   echo'<div class="myclass" id="myid">';
   echo'<input type="hidden" value="somedatas">';
   echo'<input type="text" name="'.$json[$_POST["SOMEDATA"]].'" value="somedatas">";
   ....
?>

有更好的方法吗?我也尝试将display:none设置为主div,但没有更改。

更新 我忘记了一个传递,php回显被转回ajax请求并附加到div

这是我点击确认按钮后逐个处理数据的脚本

        echo'<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("#close_tab_prw").click(function(){
         document.getElementById("prd_prw_tab").innerHTML = ""; //reset div
         $("#prd_prw").css("display","none");
       $("#container_others").css("opacity","1");
}); 
     $("#update_all_items").click(function(){
        var prd_number = $("input[name=prd_max_number]").val();
        for(var i = 0; i < prd_number; i++){
            var string_ok = "#confirm_form_prd_";
            string_ok = string_ok.concat(i);
            var dataString = $(string_ok).serialize();
             $.ajax( {
        type: "POST",
        url: "';echo $dir; echo'",
        data: dataString,
        success: function(data) {
            console.log(data);
            $("#prd_prw_tab").html(data);
        }
            });
        }
    });
     $("#disable_img").click(function(){
        $(".img_check").prop("checked", false);
    });
     $("#allow_img").click(function(){
        $(".img_check").prop("checked", true);
    });
     $("#disable_desc").click(function(){
        $(".n_desc_chk").prop("checked", false);
    });
     $("#allow_desc").click(function(){
        $(".n_desc_chk").prop("checked", true);
    });


    });

</script>';

这是我用来展示产品的主要功能:

$(document).ready(function(){
 $("#get_json_btn").click(function(){


        document.getElementById("unique_json_return").innerHTML = ""; //reset div

        if(document.getElementById('url_json').value != "") {
            $.getJSON(document.getElementById('url_json').value , function(result){
            $.each(result, function(i, field){
                $("#unique_json_return").append(JSON.stringify(result));
            })
        })
        .fail(function() { alert('getJSON request failed, see tips '); })
        }
       else {
            alert("No Url insrted, please, insert your JSON url");
        } 
    });
 $("#update_products").click(function(){
      new_height = "";
    $( window ).resize(function() {
        $("#prd_prw").css("height", $(window).height()-(20*$(document).height()/100));
    });
      new_height = $(window).height()-(20*$(document).height()/100);
      $("#prd_prw").css("height", new_height);
     $("#prd_prw").css("display","block");
       $("#container_others").css("opacity","0.3");

    var entire_json = document.getElementById('unique_json_return').innerText;
    var one = document.getElementsByName('one')[0].value;
    var two = document.getElementsByName('two')[0].value;
    ...
    var ten = document.getElementsByName('ten')[0].value;


    if(entire_json == "") {
        alert("Invalid or Empty JSON response");
    }
    else{
                $.ajax({
   url: '<?echo $dir; ?>',
   data: {entire_json : entire_json, one:one, two:two, three:three,...ten:ten
    },
   type: 'POST',
   success: function(data) {
   document.getElementById("unique_json_return").innerHTML = ""; //reset div
    $("#prd_prw_tab").append(data);

       }
});
    }
});
});

1 个答案:

答案 0 :(得分:2)

您需要多久解析一下这些15k产品?

如果它只是偶尔的执行,只在后端,没有最终用户经历50秒等待,我会忍受它,直到你可以把它拆分成一个单独的服务(可能不是PHP)。

如果这是在最终用户交互之后发生的事情,我会重新审视整个设计并确保没有任何单个用户操作导致整体解析15k对象。