chrome上傳圖片 路徑為c:/fakepath的解決辦法

weixin_33816300發表於2019-01-26

因為瀏覽器提升了安全級別,預設是不會獲取檔案的真實路徑的,都是用fakepath代替了。

1.可以通過修改瀏覽器的安全級別,步驟是:工具 -> Internet選項 -> 安全 -> 自定義級別 -> 找到“其他”中的“將本地檔案上載至伺服器時包含本地目錄路徑”,選中“啟用”即可。
2.以上方法對程式設計師來說肯定不可取,總不能讓每一個使用者都修改瀏覽器配置,網上有一種用js程式碼修改的方法,但只相容IE、firefox系列。

function getPath(){  
    var Pathobj = document.getElementById("......");
    if(Pathobj){  
         if (window.navigator.userAgent.indexOf("MSIE")>=1)   {  
             Pathobj.select();  
             return document.selection.createRange().text;  
         }else if(window.navigator.userAgent.indexOf("Firefox")>=1){  
             if(Pathobj.files){  
                   return Pathobj.files.item(0).getAsDataURL();  
             }  
             return Pathobj.value;  
         }  
         return Pathobj.value;  
    }  
}

我的思路是:

在頁面增加一個隱藏標籤,然後js把url傳遞給隱藏標籤,最後Ajax更改data.field.file的值,再post過去。
<input type="hidden" id="img_url" name="img" value=""/> //用於接收正確url的值
data.field.file = document.getElementById("img_url").value;

完整程式碼:

 // 上傳圖片處理
        var uploadInst = upload.render({
          elem: '#upload_img' //繫結元素
          ,url: ".." //上傳介面
          ,size:50
          ,accept: 'images' //指定允許上傳時校驗的檔案型別
          ,acceptMime: 'image/*'//篩選出的檔案型別
          ,before: function(obj){ //選擇檔案後回撥
            obj.preview(function(index, file, result){
              $('#pre_img').attr('src', result); //圖片連結(base64),插入用於預覽
            });
          }
          ,done: function(res){
              //上傳完畢回撥
              if(res.code >0){  
                return layer.msg('圖片上傳失敗')
              }
              document.getElementById("img_url").value = res.msg;
          }
          ,error: function(){
              //請求異常回撥
              layer.closeAll('loading'); //關閉loading
          }
        });
        //監聽提交
        form.on('submit(add)', function(data){
          data.field.file = document.getElementById("img_url").value;
          //發非同步,把資料提交給php
         $.ajax({
                url:'./goods_add_function.php',
                data:data.field,
                dataType:'text',
                type:'post',
                success:function (data) {
                  layer.alert("增加成功", {icon: 6},function () {
                  // 獲得frame索引
                    var index = parent.layer.getFrameIndex(window.name);
                    //關閉當前frame
                     parent.layer.close(index);
                   });
                }
            })
          return false;
        });

相關文章