Salesforce input 标签 成熟文件上传方案,
这次项目开发由于客户要求无法使用lwc标准的文件上传标签只能只能使用input标签来上传文件。下面是试验成功的方案。
注意:只能上传3mb文件,salesforce限制。也希望看到的文章大神们指点一下。
前端html
<input autocomplete="off"
style="padding: 0;display:none;"
type="file" id="file" name="file"
onchange={handleFileChanges}
accept="image/*,.pdf,.txt,.rtf,.doc,.docx,.xls,.xlsx,.ppt,.pptx" multiple />
javascript 方法
//base64 方法
handleFileChanges(event) {
// this.uploadedFileList = [];
const fileMaxSize = 1024 * 1024 * 3;
var overSize = false;
var emptyFile = false;
this.fileUploadProgress = true;
let files = event.target.files;
if (files.length > 0) {
for (let i = 0; i < files.length; i++) {
let file = files[i];
if(file.size < fileMaxSize && file.size > 0){
this.uploadedFileList.push({name:file.name,url:i});
}else{
overSize = true;
}
if(file.size == 0){
emptyFile = true;
}
}
if(overSize == true){
this.showToast('error','ERROR','小于3mb');
return;
}
if(emptyFile == true){
this.showToast('error','ERROR','空文件');
return;
}
for (let i = 0; i < files.length; i++) {
let file = files[i];
let freader = new FileReader();
freader.onload = f => {
let base64 = 'base64,';
let content = freader.result.indexOf(base64) + base64.length;
let fileContents = freader.result.substring(content);
if(file.size < fileMaxSize){
this.filesUploaded.push({
Title: file.name,
VersionData: fileContents
});
}
};
freader.readAsDataURL(file);
}
}
}
文件上传的时候由于想上传多个就需要每个文件都执行一次insert文件方法,
注意:一定要使用 async 和 await 等待每个文件上传成功后执行
async handleInsertFileMethod(){
this.countFileUploadSuccess = [];
for (let index = 0; index < this.filesUploaded.length; index++) {
const element = this.filesUploaded[index];
const finalResult = await insertPartnerOrderFile({filesToInsert: element,partnerOrderId:this.partnerOrderId});
if(finalResult){
if(finalResult.status == 'success'){
this.countFileUploadSuccess.push(1);
if(this.countFileUploadSuccess.length == this.filesUploaded.length){
}
}else if(finalResult.status == 'fail'){
this.countFileUploadSuccess.push(1);
this.showToast('error','ERROR',finalResult.error);
if(this.countFileUploadSuccess.length == this.filesUploaded.length){
}
}
}
}
}
apx方法如下
@AuraEnabled
public static Map<String, Object> insertPartnerOrderFile(Object filesToInsert,String partnerOrderId){
Map<String, Object> resMap = new Map<String, Object>();
try {
FileInfoWrapper fileData = (FileInfoWrapper)JSON.deserialize(JSON.serialize(filesToInsert), COP_PartnerOrderCreateCtrl.FileInfoWrapper.class);
ContentVersion contentVersionRec = new ContentVersion();
contentVersionRec.Title = fileData.Title;
// contentVersionRec.ContentLocation = 'S';
contentVersionRec.PathOnClient = fileData.Title;
contentVersionRec.FirstPublishLocationId = partnerOrderId;
contentVersionRec.VersionData =fileData.VersionData;
contentVersionRec.IsMajorVersion = true;
insert contentVersionRec;
resMap.put('status', 'success');
return resMap;
} catch (Exception e) {
resMap.put('status', 'fail');
resMap.put('error', e.getMessage()+'\n'+e.getStackTraceString());
}
return resMap;
}
//文件内容传输内部class
public class FileInfoWrapper {
public String Title;
public Blob VersionData;
}
浙公网安备 33010602011771号