❶ 如何設置upload文件夾，使得這個文件夾可以用來上傳文件，卻不能從localhost/upload訪問到文件列表
首先 要保證你的磁碟的格式是 ntfs格式的
你可以 點 文件夾上的-- 工具--文件夾選項-- 查看--使用簡單文件共享前面的鉤去掉。
然後 在 iis指向的文件夾上 點右鍵 屬性--安全---可以設置不同用戶的 讀寫許可權。。。
另外上傳文件 你可能需要裝一些ftp服務，比如裝個serv-u軟體或者iis自帶的也可以，用來指向這個設置了許可權的目錄。
NTFS許可權
首先我們要知道:只要是存在NTFS磁碟分區上的文件夾或文件，無論是否被共享，都具有此許可權。此許可權對於使用FAT16/FAT32文件系統的文件與文件夾無效! NTFS許可權有兩大要素:一是標准訪問許可權;二是特別訪問許可權。前者將一些常用的系統許可權選項比較籠統地組成6種"套餐型"的許可權，即:完全控制、修改、讀取和運行、列出文件夾目錄、讀取、寫入。 在大多數的情況下，"標准許可權"是可以滿足管理需要的，但對於許可權管理要求嚴格的環境，它往往就不能令管理員們滿意了，如只想賦予某用戶有建立文件夾的許可權，卻沒有建立文件的許可權;如只能刪除當前目錄中的文件，卻不能刪除當前目錄中的子目錄的許可權等......這個時候，就可以讓擁有所有許可權選項的"特別許可權"來大顯身手了。也就是說，特別許可權不再使用"套餐型"，而是使用可以允許用戶進行"菜單型"的細節化許可權管理選擇了。 那麼如何設置標准訪問許可權呢?以對一個在NTFS分區中的名為"guo"的文件夾進行設置標准訪問許可權為例，可以按照如下方法進行操作: 因為NTFS許可權需要在資源屬性頁面的"安全"選項卡設置界面中進行，而Windows XP在安裝後默認狀態下是沒有激活"安全"選項卡設置功能的， 所以需要首先啟用系統中的"安全"選項卡。方法是:依次點擊"開始"→"設置"→"控制面板 "，雙擊"文件夾選項"，在"查看"標簽頁設置界面上的"高級設置"選項列表中清除"使用簡單文件共享(推薦)"選項前的復選框後點擊"應用"按鈕即可。 設置完畢後就可以右鍵點擊"guo" 文件夾，在彈出的快捷菜單中選擇"共享與安全"，在"guo屬性"窗口中就可以看見"安全"選項卡的存在了。針對資源進行NTFS許可權設置就是通過這個選項卡來實現的，此時應首先在"組或用戶名稱"列表中選擇需要賦予許可權的用戶名組(這里選擇"zhong"用戶)，接著在下方的"zhong 的許可權"列表中設置該用戶可以擁有的許可權即可。 下面簡單解釋一下六個許可權選項的含義: ①完全控制(Full Control): 該許可權允許用戶對文件夾、子文件夾、文件進行全權控制，如修改資源的許可權、獲取資源的所有者、刪除資源的許可權等，擁有完全控制許可權就等於擁有了其他所有的許可權; ②修改(Modify): 該許可權允許用戶修改或刪除資源，同時讓用戶擁有寫入及讀取和運行許可權; ③讀取和運行(Read & Execute): 該許可權允許用戶擁有讀取和列出資源目錄的許可權，另外也允許用戶在資源中進行移動和遍歷，這使得用戶能夠直接訪問子文件夾與文件，即使用戶沒有許可權訪問這個路徑; ④列出文件夾目錄(List Folder Contents): 該許可權允許用戶查看資源中的子文件夾與文件名稱; ⑤讀取(Read): 該許可權允許用戶查看該文件夾中的文件以及子文件夾，也允許查看該文件夾的屬性、所有者和擁有的許可權等; ⑥寫入(Write): 該許可權允許用戶在該文件夾中創建新的文件和子文件夾，也可以改變文件夾的屬性、查看文件夾的所有者和許可權等。 如果在"組或用戶名稱"列表中沒有所需的用戶或組，那麼就需要進行相應的添加操作了，方法如下:點擊"添加"按鈕後，在出現的"選擇用戶和組"對話框中，既可以直接在"輸入對象名稱來選擇"文本區域中輸入用戶或組的名稱(使用"計算機名\用戶名"這種方式)，也可以點擊"高級"按鈕，在彈出的對話框中點擊" 立即查找"按鈕讓系統列出當前系統中所有的用戶組和用戶名稱列表。此時再雙擊選擇所需用戶或組將其加入即可。 如果想刪除某個用戶組或用戶的話，只需在" 組或用戶名稱"列表中選中相應的用戶或用戶組後，點擊下方的"刪除"按鈕即可。但實際上，這種刪除並不能確保被刪除的用戶或用戶組被拒絕訪問某個資源，因此，如果希望拒絕某個用戶或用戶組訪問某個資源，還要在"組或用戶名稱"列表中選擇相應的用戶名用戶組後，為其選中下方的"拒絕"復選框即可。 那麼如何設置特殊許可權呢?假設現在需要對一個名為"guo"的目錄賦"zhong"用戶對其具有"讀取"、"建立文件和目錄"的許可權，基於安全考慮，又決定取消該賬戶的"刪除"許可權。此時，如果使用"標准許可權"的話，將無法完成要求，而使用特別許可權則可以很輕松地完成設置。方法如下: 首先，右鍵點擊"guo"目錄，在右鍵快捷菜單中選擇"共享與安全"項，隨後在"安全"選項卡設置界面中選中"zhong"用戶並點擊下方的"高級"按鈕，在彈出的對話框中點擊清空"從父項繼承那些可以應用到子對象的許可權項目，包括那些在此明確定義的項目"項選中狀態，這樣可以斷開當前許可權設置與父級許可權設置之前的繼承關系。在隨即彈出的" 安全"對話框中點擊"復制"或"刪除"按鈕後(點擊"復制"按鈕可以首先復制繼承的父級許可權設置，然後再斷開繼承關系)，接著點擊"應用"按鈕確認設置，再選中"zhong"用戶並點擊"編輯"按鈕，在彈出的"zhong的許可權項目"對話框中請首先點擊"全部清除"按鈕，接著在"許可權"列表中選擇"遍歷文件夾/運行文件"、"列出文件夾/讀取數據"、"讀取屬性"、"創建文件/寫入數據"、"創建文件夾/附加數據"、"讀取許可權"幾項，最後點擊"確定"按鈕結束設置。 在經過上述設置後，"zhong"用戶在對"guo"進行刪除操作時，就會彈出提示框警告操作不能成功的提示了。顯然，相對於標准訪問許可權設置 上的籠統，特別訪問許可權則可以實現更具體、全面、精確的許可權設置。 為了大家更好地理解特殊許可權列表中的許可權含義，以便做出更精確的許可權設置，下面簡單解釋一下其含義: ⑴遍歷文件夾/運行文件(Traverse Folder/Execute File): 該許可權允許用戶在文件夾及其子文件夾之間移動(遍歷)，即使這些文件夾本身沒有訪問許可權。 注意:只有當在"組策略"中("計算機配置 "→"Windows設置"→"安全設置"→"本地策略"→"用戶權利指派")將"跳過遍歷檢查"項授予了特定的用戶或用戶組，該項許可權才能起作用。默認狀態下，包"Administrators"、"Users"、"Everyone"等在內的組都可以使用該許可權。 對於文件來說，擁了這項許可權後，用戶可以執行該程序文件。但是，如果僅為文件夾設置了這項許可權的話，並不會讓用戶對其中的文件帶上"執行"的許可權; ⑵列出文件/讀取數據(List Folder/Read Data): 該許可權允許用戶查看文件夾中的文件名稱、子文件夾名稱和查看文件中的數據; ⑶讀取屬性(Read Attributes): 該許可權允許用戶查看文件或文件夾的屬性(如系統、只讀、隱藏等屬性); ⑷讀取擴展屬性(Read Extended Attributes): 該許可權允許查看文件或文件夾的擴展屬性，這些擴展屬性通常由程序所定義，並可以被程序修改; ⑸創建文件/寫入屬性(Create Files/Write Data): 該許可權允許用戶在文件夾中創建新文件，也允許將數據寫入現有文件並覆蓋現有文件中的數據; ⑹創建文件夾/附加數據(Create Folder/Append Data): 該許可權允許用戶在文件夾中創建新文件夾或允許用戶在現有文件的末尾添加數據，但不能對文件現有的數據進行覆蓋、修改，也不能刪除數據; ⑺寫入屬性(Write Attributes): 該許可權允許用戶改變文件或文件夾的屬性; ⑻寫入擴展屬性(Write Extended Attributes): 該許可權允許用戶對文件或文件夾的擴展屬性進行修改; ⑼刪除子文件夾及文件(Delete Subfolders and Files): 該許可權允許用戶刪除文件夾中的子文件夾或文件，即使在這些子文件夾和文件上沒有設置刪除許可權; ⑽刪除(Delete): 該許可權允許用戶刪除當前文件夾和文件，如果用戶在該文件或文件夾上沒有刪除許可權，但是在其父級的文件夾上有刪除子文件及文件夾許可權，那麼就仍然可以刪除它; ⑾讀取許可權(Read Permissions): 該許可權允許用戶讀取文件或文件夾的許可權列表; ⑿更改許可權(Change Permissions): 該許可權允許用戶改變文件或文件夾上的現有許可權; ⒀取得所有權(Take Ownership): 該許可權允許用戶獲取文件或文件夾的所有權，一旦獲取了所有權，用戶就可以對文件或文件夾進行全權控制。 這里需要單獨說明一下"修改"許可權與"寫入 "許可權的區別:如果僅僅對一個文件擁有修改許可權，那麼，不僅可以對該文件數據進行寫入和附加，而且還可以創建新文件或刪除現有文件。而如果僅僅對一個文件擁有寫入許可權，那麼既可以對文件數據進行寫入和附加，也可以創建新文件，但是不能刪除文件。也就是說，有寫入許可權不等於具有刪除許可權，但擁有修改許可權，就等同於擁有刪除和寫入許可權。
❷ element UI使用Upload 上傳視頻，圖片
elementUI中 upload 的地址： https://element.eleme.cn/#/zh-CN/component/upload 大家可以參考官方文檔
這里我使用的是照片牆這個屬性：list-type
```javascript
<el-upload
name="fileUpload"//上傳文件的欄位名字由後台提供
:data="folderName"//文件存儲的文件夾
:action="這里的介面是後台提供的"
list-type="picture-card"
:on-success="successUpdata"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove">
<i class="el-icon-plus"></i>
</el-upload>
data{
folderName: {folderName:'ycylManage'},
}
methods: {
handleRemove(file, fileList) {
console.log(file, fileList);
},
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible =true;
},
//上傳成功的方法
successUpdata(file){
this.headImg = file.paths[0] //返回的是圖片的路徑
},
圖片示例：
經過試驗這個上傳是可以上傳視頻的，所以推薦大家用這個，上傳圖片與上傳圖片是一樣的
❸ vue el-upload上傳文件方法 詳細解答 action 和 http-request兩種方式
包括action 和 http-request兩種方式
上傳成功回調方法 綁定 handleSuccess 方法
自定義上傳相比action上傳，擴展性更強，當項目里上傳需求較多，且連接不同介面地址時，配置uploadheaders 配置很多顯然不太優雅。
注意：自定義上傳時，需要對該上傳設置一下請求頭 。 在攔截器里設置請求頭
自定義上傳的觸發方式 ，點擊確定時在 importUser 里執行，執行這句即是執行uploadFile方法
注意： formdata列印不出來，實際有值
❹ 誰會用vuejselupload標簽怎麼用如何獲取上傳文件的路徑
<template lang="jade">
vue-file-upload(url='upload.do',
v-bind:files.sync = 'files',
v-bind:filters = "filters",
v-bind:on-complete-upload = 'completeUpload')
table
thead
tr
th name
th size
th progress
th status
th action
tbody
tr(v-for='file in files')
td(v-text='file.name')
td(v-text='file.size')
td(v-text='file.progress')
td(v-text='onStatus(file)')
td
button(type='button',@click="uploadItem(file)") 上傳
button(type='button',@click="uploadAll") 上傳所有文件
</template>
<script>
import VueFileUpload from 'vue-file-upload';
export default{
data(){
return{
files:[],
//文件過濾器，只能上傳圖片
filters:[
{
name:"imageFilter",
fn(file){
var type = '|' + file.type.slice(file.type.lastIndexOf('/') + 1) + '|';
return '|jpg|png|jpeg|bmp|gif|'.indexOf(type) !== -1;
}
}
]
}
},
methods:{
onStatus(file){
if(file.isSuccess){
return "上傳成功";
}else if(file.isError){
return "上傳失敗";
}else if(file.isUploading){
return "正在上傳";
}else{
return "待上傳";
}
},
uploadItem(file){
//單個文件上傳
file.upload();
},
uploadAll(){
//上傳所有文件
this.$broadcast('DO_POST_FILE');
},
completeUpload(file,response,status,header){
console.log("finish upload;")
}
},
components:{
VueFileUpload
}
}
</script>
❺ el-upload
記錄下項目過程中使用el-upload文件上傳遇到的一些坑~
element官方是這樣說明的：
其實不加on-change事件的話，before-upload直接返回false是可以停止上傳的。
http-request綁定的上傳方法必須添加return返回（不加return不好使），並且要返回一個promise對象，不然就會出現file一直是處於ready的狀態，即使你是自己在file-list手動賦值success也是會自動變成ready的，而ready狀態是不顯示成成功狀態的。（參考鏈接： https://zhuanlan.hu.com/p/457370276 ）
歡迎各位大佬指導討論~
❻ el-upload上傳文件後跳轉頁面後再返回已上傳文件的回顯
在使用<el-upload>上傳完文件後，當跳轉到其他頁面再返回時，已上傳的文件由於頁面重新刷新是不存在的，如果要讓頁面重新顯示已上傳的文件有哪些方法？我想的方法是將文件file轉換成Base64保存在sessionStorage中，當再次返回頁面時，從mounted()方法中取出保存的Base64，然後將Base64轉換成文件，將文件關聯到<el-upload>就行了。
整個頁面關閉後，就不保存文件了，所以存放在sessionStorage中了，如果要長久保存，則可以將文件存放在localStorage中。
具體步驟：
this.uploadFile是要保存的文件，這里只保存了一個文件
將文件轉換為Base64
this.dataURLtoFile方法為將Base64轉換為file
❼ el-upload有幾種使用情況
1、用action上傳
2、使用http-request="fn"自定義進行上傳
共同之處
1、當默認:auto-upload="true" ，選取了文件就走了action或者http-request的介面方法。
當:auto-upload="false" ，都需要通過this.$refs.upload.submit()進行介面或者方法的調用
何時使用action，何時使用http-request。
看後台，如果後台只給了個拼接網址的介面時候，沒提文件時候，用action。
如果後台給多個參數包含文件地址等，或者需要三方文件伺服器oss等時候。用http-reques
//當 :auto-upload="false"的時候，要注意以下問題
1、選完文件，http-request="fn" 的fn（file）是不存在file的，因為沒走介面，所以沒有回調
2、使用before-upload可以限制文件大小和格式， :auto-upload="false"時候，這個鉤子是不會被觸發的，可以使用on-change進行處理。同樣都有file入參
=====另外需要注意的問題====
使用了on-change方法 直接賦值this.fileList = fileList，
刪除需要用的on-remove
:on-preview="handlePreview" 是點擊每條數據時候觸發
on-success文件上傳成功時的鉤子，如果:auto-upload="false"，是在submit()後觸發
❽ elementui el-upload一次介面請求上傳多個文件
el-upload組件多個文件上傳都是多次請求上傳介面，沒有在文檔中找到能夠通過一次請求把所有文件上傳的設置。最後只能通過用組件的部分功能，拋棄組件上傳功能，通過axios自己將所有文件一次上傳。
❾ el-upload上傳多條一次性上傳
<el-upload
class="specialinput"
ref="upload"
multiple
:limit="4"
:on-preview="handlePreview"
:on-change="handleChange"
:on-remove="handleRemove"
:on-exceed="handleExceed"
:file-list="imgList"
list-type="picture-card"
:http-request="uploadFile"
:auto-upload="false">
<i class="el-icon-plus"></i>
</el-upload>
// 上傳文件
uploadFile(file) {
this.fileData.append('files', file.file); // append增加數據
},
// 上傳到伺服器
submitUpload() {
if (this.imgList.length === 0) {
this.$message({
message: '請先選擇文件',
type: 'warning'
})
} else {
const isLt100M = this.imgList.every(file => file.size / 1024 / 1024 < 100);
if (!isLt100M) {
this.$message.error('請檢查，上傳文件大小不能超過100MB!');
} else {
this.fileData = new FormData(); // new formData對象
this.$refs.upload.submit(); // 提交調用uploadFile函數
this.$axiosPost(
this.paidanurl + this.paidanport + '/api/Dispatch/UploadImage?flowid='+ this.operaInfo.flowid + '&recordid=' + this.recordid,this.fileData,function(data) {
if (data.Code == 1) {
this.imgList = [];
this.$message.success(data.Message);
} else {
this.$message.error(data.Message);
}
},
function(error) {
}
);
}
}
},
//移除
handleRemove(file, imgList) {
this.imgList = imgList;
},
// 選取文件超過數量提示
handleExceed(files, imgList) {
this.$message.warning(`當前限制選擇 4 個文件，本次選擇了 ${files.length} 個文件，共選擇了 ${files.length + imgList.length} 個文件`);
},
//監控上傳文件列表
handleChange(file, imgList) {
let existFile = imgList.slice(0, imgList.length - 1).find(f => f.name === file.name);
if (existFile) {
this.$message.error('當前文件已經存在!');
imgList.pop();
}
this.imgList = imgList;
}
}
❿ el-upload 上傳列表li的樣式
el-upload的圖標和提示文字，都可以換成你需求圖里的，很簡單的，參考官方示例。
可以設置el-upload的:show-file-list="false"不顯示下方默認上傳的文件列表；然後，在el-upload的上面根據:file-list="fileList"中上傳獲取的fileList，自己做一個需求圖那樣的列表布局樣式，這不難吧？最後，自己做的列表裡刪除和編輯的邏輯，就是數據的操作了。