ajax 请求多张图片数据

需求分析：

实现对网页上的图片进行显示。由于读取图片名称相同，而图片内容已发生改变。采用网上所用的要求浏览器不缓存的操作不生效

<META http-equiv="Pragma" CONTENT="no-cache">
    <META http-equiv="Cache-Control" CONTENT="no-cache, must-revalidate">
    <META http-equiv="expires" CONTENT="0">
    <meta charset="utf-8">
    <META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
    <META HTTP-EQUIV="expires" CONTENT="0"> 

后面采用ajax的方式请求数据，直接从后端将图片内容读取并返回给前端，从而实现图片数据的最新显示

前端 ajax请求:

        $.ajax({
            url: ‘index.php‘,
            type: ‘POST‘,
            dataType: ‘json‘,
            data: {mode: ‘<?=$Mode?>‘,id:‘<?=$idVal;?>‘},
        })
        .success(function(data){
            // console.log(data);
            $.each(data,function(name,value){
                // console.log(name);
                // console.log(value);
                $("#sm_image"+name).attr("src","data:image/png;base64,"+value);

            })

        })
        .done(function(data) {
            console.log("success");
            // $("sm_image").attr("src","data:image/png;base64,"+data);
            // echo
        })
        .fail(function(data) {
            console.log(data);
            console.log("error");
        })
        .always(function() {
            console.log("complete");
        });
        

后台php解析并返回:

<?php 

if($_POST) {

   switch ($_POST[‘mode‘]) {
       case 1:
            // print_r($_POST[‘id‘]);
            $idArr =  explode(",", $_POST[‘id‘]);

            $jsonStr = "{";

            for ($i=0; $i <count($idArr) ; $i++) {
               $img = base64_encode(file_get_contents("/web/image/image_id".$idArr[$i].".png"));
                $jsonStr .= "\"".$idArr[$i]."\":\"$img\",";
            }

            $jsonStr = substr($jsonStr,0,-1);

            $jsonStr .= "}";
            echo $jsonStr;
           break;
       case 2:
           $id = $_POST[‘id‘];
           $img = base64_encode(file_get_contents("/web/image/image_id".$id.".png"));
           echo  ‘{"‘.$id.‘":"‘.$img.‘"}‘; //读取图片数据并作base64编码
           break;
       default:
           break;

    } 

}

?>