chrome上傳圖片 路徑為c:/fakepath的解決辦法
因為瀏覽器提升了安全級別,預設是不會獲取檔案的真實路徑的,都是用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;
});
相關文章
- laravel上傳圖片路徑問題Laravel
- PbootCMS上傳圖片變模糊、上傳圖片尺寸受限的解決方案boot
- word轉html用到的圖片路徑替換上傳HTML
- QQ空間無法上傳多張圖片解決方案
- Overleaf中插入pdf圖片只顯示圖片路徑的解決方式
- 上傳檔案(圖片)失敗 error=6 找不到臨時檔案解決辦法Error
- Chrome不能在網易網盤中上傳檔案的解決辦法Chrome
- KindEditor 圖片上傳後生成帶域名絕對路徑配置方法
- XML檔案中url路徑中&失效解決辦法XML
- 圖片下方三畫素原因及解決辦法
- 織夢dedecms圖片集上傳圖片不能上傳 彈出提示302的解決方法
- 解決uni-app在App端上傳圖片時路徑轉Base64的問題APP
- IOS下圖片不能顯示問題的解決辦法iOS
- IMG圖片下面出現下邊距的解決辦法
- 圖片上傳方案詳解
- koa 圖片上傳詳解
- PbootCMS上傳圖片被壓縮怎麼解決boot
- 將圖片上傳到gitee伺服器,md不依賴於本地路徑:Gitee伺服器
- H5-4 圖片路徑詳解H5
- 上傳圖片
- 瀏覽器報圖片404錯誤,但是在路徑下明明存在該圖片(idel中專案做圖片上傳,上傳成功成功,路徑下真實存在,但是前端瀏覽器開啟就是報404)瀏覽器IDE前端
- win10工作列沒有網路圖示連不上網 網路圖示消失的解決辦法Win10
- 未能找到路徑“in oslyncsc.exe”的一部分 的解決辦法
- 微信JSSDK上傳圖片過程中編輯圖片描述,解決思路記錄JS
- electron上傳圖片
- 上傳圖片jsJS
- 裁剪上傳圖片
- Chrome圖片解碼與ImageDecodingHintChrome
- 圖片上傳及圖片處理
- 如何透過 wireshark 捕獲 C# 上傳的圖片C#
- java,springboot + thymeleaf 上傳圖片、刪除圖片到伺服器、本地,壓縮圖片上傳(有些圖片會失真),原圖上傳JavaSpring Boot伺服器
- [文件教程]解決sae下編輯器圖片上傳問題
- ajax上傳陣列物件,spring mvc接收不成功的解決辦法陣列物件SpringMVC
- wordress小程式圖片訪問出現404問題解決辦法
- getBase64();得到圖片路徑
- chrome瀏覽器被360導航劫持解決辦法Chrome瀏覽器
- 關於Chrome報錯 ERR_NAME_NOT_RESOLVED 解決辦法Chrome
- vue 關於圖片路徑的問題Vue