1. 程式人生 > >thinkphp的同步上傳圖片和異步上傳圖片

thinkphp的同步上傳圖片和異步上傳圖片

支持 ech oca setup ssa value att 僅支持 移動

同步:

前臺頁面:

        <div class="form-div"> 
            <form action="{:url(‘index/i/edit_head_img_cl‘)}" enctype="multipart/form-data" method="post">
                <input type="file" name="image" accept="image/gif, image/jpg ,image/png"/> <br> 
                <p style="color:red
">僅支持不大於5m,後綴為jpg,png,gif的圖片</p> <input type="submit" value="上傳" /> </form> </div>

後臺頁面:

    //處理頭像修改
    public function edit_head_img_cl(){

      //檢驗用戶是否登陸,並獲取user_id
      if($this->check_log[ok] == -1){
        $this->error($this
->check_log[error]); } $user_id = $this->check_log[id]; echo 1; // 獲取表單上傳文件 例如上傳了001.jpg $file = request()->file(image); echo 2; // 移動到框架應用根目錄/public/uploads/ 目錄下 if($file){ $info = $file->validate([size=>5242880,ext=>jpg,png,gif
])->move(static/uploads/); if($info){ // 成功上傳後 獲取上傳信息 // 輸出 jpg /* echo $info->getExtension(); // 輸出 20160820/42a79759f284b767dfcb2a0197904287.jpg echo $info->getSaveName(); // 輸出 42a79759f284b767dfcb2a0197904287.jpg echo $info->getFilename(); */ $ing_url = $info->getSaveName(); //把url寫進頭像 $res = UserDB::update([id=>$user_id,head_img=>$ing_url]); if(!$res){ echo 系統故障,更換頭像失敗; }else{ echo <script type="text/javascript">parent.location.reload();</script>; } }else{ // 上傳失敗獲取錯誤信息 echo $file->getError(); } }else{ echo request()->post(image); } }

異步

前臺頁面:

                            <tr>
                                <td>頭像(異步上傳):</td>
                                <td>
                                    {if $user.head_img == ‘‘}
                                        <img src="__STATIC__/uploads/{$site_setup.default_img}" style="width: 50px;height: 50px;" class="head-img">
                                    {else/}
                                        <img src="__STATIC__/uploads/{$user.head_img}" style="width: 50px;height: 50px;" class="head-img">
                                    {/if}
                                </td>
                                <td>
                                    <input type="file" multiple="multiple" id="inputfile" name="" class="photo">

                                    
                                </td>
                            </tr>
    //圖片異步上傳
    $("#inputfile").change(function(){
        console.log($(this).val());
        /*alert(1);*/
        var file = $(#inputfile)[0].files[0];
        var data = new FormData();
    /*    console.log($(‘#inputfile‘));*/
        data.append(image, file);

         $.ajax({
            url:"{:url(‘index/i/edit_head_img_cl_yb‘)}", /*去過那個php文件*/
            type:POST,  /*提交方式*/
            data:data,
            dataType: "json",
            cache: false,
            contentType: false,        /*不可缺*/
            processData: false,         /*不可缺*/
            mimeType: "multipart/form-data",
            success:function(data){  
                if(data.ok == 1){
                    //把頭像換成新的
                    $(".head-img").attr("src","__STATIC__/uploads/"+data.url);
                }      
                alert(data.message);
            },
            error:function(data){
                alert(上傳出錯);
            }
        });    
    });

後臺頁面:

    //處理頭像修改(異步)
    public function edit_head_img_cl_yb(){

      //檢驗用戶是否登陸,並獲取user_id
      if($this->check_log[ok] == -1){
        return [ok=>-1,message=>$this->check_log[error]];
      }
      $user_id = $this->check_log[id];

      // 獲取表單上傳文件 例如上傳了001.jpg
      $file = request()->file(image);

      // 移動到框架應用根目錄/public/uploads/ 目錄下
      if($file){
          $info = $file->validate([size=>5242880,ext=>jpg,png,gif])->move(static/uploads/);
          if($info){
              // 成功上傳後 獲取上傳信息
              // 輸出 jpg
/*              echo $info->getExtension();
              // 輸出 20160820/42a79759f284b767dfcb2a0197904287.jpg
              echo $info->getSaveName();
              // 輸出 42a79759f284b767dfcb2a0197904287.jpg
              echo $info->getFilename(); */
              $ing_url = $info->getSaveName();
              //把url寫進頭像
              $res = UserDB::update([id=>$user_id,head_img=>$ing_url]);
              if(!$res){
                return [ok=>-1,message=>系統故障,更換頭像失敗];

              }else{
                 return [ok=>1,message=>上傳成功!,url=>$ing_url];
              }


          }else{
              // 上傳失敗獲取錯誤信息
              return [ok=>-1,message=>$file->getError()];
          }
      }else{
        return [ok=>-1,message=>沒有接收到圖片!];
      }
    }

thinkphp的同步上傳圖片和異步上傳圖片