提交 81281856 编写于 作者: 郭胜强

fix: 解决本地选择的文件上传时丢失原始文件名的问题

上级 0e5e7208
/** /**
* 从url读取Blob * 暂存的文件对象
*/
const files = {}
/**
* 从url读取File
* @param {string} url * @param {string} url
* @param {Function} success * @param {Promise}
* @param {Function} error
*/ */
export function urlToBlob (url, success, error) { export function urlToFile (url) {
var xhr = new XMLHttpRequest() var file = files[url]
xhr.open('GET', url, true) if (file) {
xhr.responseType = 'blob' return Promise.resolve(file)
xhr.onload = function () {
success(this.response)
} }
xhr.onerror = error if (/^data:[a-z-]+\/[a-z-]+;base64,/.test(url)) {
xhr.send() return Promise.resolve(base64ToBlob(url))
}
return new Promise((resolve, reject) => {
var xhr = new XMLHttpRequest()
xhr.open('GET', url, true)
xhr.responseType = 'blob'
xhr.onload = function () {
resolve(this.response)
}
xhr.onerror = reject
xhr.send()
})
} }
/** /**
* base64转Blob * base64转Blob
...@@ -32,9 +44,19 @@ export function base64ToBlob (base64) { ...@@ -32,9 +44,19 @@ export function base64ToBlob (base64) {
} }
/** /**
* 从本地file或者blob对象创建url * 从本地file或者blob对象创建url
* @param {Blob|File} blob * @param {Blob|File} file
* @return {string} * @return {string}
*/ */
export function blobToUrl (blob) { export function fileToUrl (file) {
return (window.URL || window.webkitURL).createObjectURL(blob) for (const key in files) {
if (files.hasOwnProperty(key)) {
const oldFile = files[key]
if (oldFile === file) {
return key
}
}
}
var url = (window.URL || window.webkitURL).createObjectURL(file)
files[url] = file
return url
} }
import { fileToUrl } from '../file/util'
const { const {
invokeCallbackHandler: invoke invokeCallbackHandler: invoke
} = UniServiceJSBridge } = UniServiceJSBridge
...@@ -44,7 +46,7 @@ export function chooseImage ({ ...@@ -44,7 +46,7 @@ export function chooseImage ({
const fileCount = event.target.files.length const fileCount = event.target.files.length
for (let i = 0; i < fileCount; i++) { for (let i = 0; i < fileCount; i++) {
const file = event.target.files[i] const file = event.target.files[i]
const filePath = window.URL.createObjectURL(file) const filePath = fileToUrl(file)
tempFilePaths.push(filePath) tempFilePaths.push(filePath)
tempFiles.push({ tempFiles.push({
...@@ -63,4 +65,4 @@ export function chooseImage ({ ...@@ -63,4 +65,4 @@ export function chooseImage ({
}) })
imageInput.click() imageInput.click()
} }
import { fileToUrl } from '../file/util'
const { const {
invokeCallbackHandler: invoke invokeCallbackHandler: invoke
} = UniServiceJSBridge } = UniServiceJSBridge
...@@ -31,7 +33,7 @@ export function chooseVideo ({ ...@@ -31,7 +33,7 @@ export function chooseVideo ({
videoInput.addEventListener('change', function (event) { videoInput.addEventListener('change', function (event) {
const file = event.target.files[0] const file = event.target.files[0]
const filePath = window.URL.createObjectURL(file) const filePath = fileToUrl(file)
invoke(callbackId, { invoke(callbackId, {
errMsg: 'chooseVideo:ok', errMsg: 'chooseVideo:ok',
...@@ -43,4 +45,4 @@ export function chooseVideo ({ ...@@ -43,4 +45,4 @@ export function chooseVideo ({
}) })
videoInput.click() videoInput.click()
} }
import { blobToUrl } from '../file/util' import { fileToUrl } from '../file/util'
/** /**
* 下载任务 * 下载任务
*/ */
...@@ -57,7 +57,7 @@ export function downloadFile ({ ...@@ -57,7 +57,7 @@ export function downloadFile ({
invoke(callbackId, { invoke(callbackId, {
errMsg: 'downloadFile:ok', errMsg: 'downloadFile:ok',
statusCode, statusCode,
tempFilePath: blobToUrl(blob) tempFilePath: fileToUrl(blob)
}) })
} }
xhr.onabort = function () { xhr.onabort = function () {
......
import { import { urlToFile } from '../file/util'
urlToBlob,
base64ToBlob
} from '../file/util'
/** /**
* 上传任务 * 上传任务
*/ */
...@@ -52,32 +49,15 @@ export function uploadFile ({ ...@@ -52,32 +49,15 @@ export function uploadFile ({
invokeCallbackHandler: invoke invokeCallbackHandler: invoke
} = UniServiceJSBridge } = UniServiceJSBridge
var uploadTask = new UploadTask(null, callbackId) var uploadTask = new UploadTask(null, callbackId)
// 暂时只支持blob和base64
if (filePath.indexOf('blob:http') === 0) { function upload (file) {
urlToBlob(filePath, upload, () => {
setTimeout(() => {
invoke(callbackId, {
errMsg: 'uploadFile:fail file error'
})
}, 0)
})
} else if (/^data:[a-z-]+\/[a-z-]+;base64,/.test(filePath)) {
upload(base64ToBlob(filePath))
} else {
setTimeout(() => {
invoke(callbackId, {
errMsg: 'uploadFile:fail filePath error'
})
}, 0)
}
function upload (blob) {
var xhr = new XMLHttpRequest() var xhr = new XMLHttpRequest()
var form = new FormData() var form = new FormData()
var timer var timer
Object.keys(formData).forEach(key => { Object.keys(formData).forEach(key => {
form.append(key, formData[key]) form.append(key, formData[key])
}) })
form.append(name, blob, `file-${Date.now()}`) form.append(name, file, file.name || `file-${Date.now()}`)
xhr.open('POST', url) xhr.open('POST', url)
Object.keys(header).forEach(key => { Object.keys(header).forEach(key => {
xhr.setRequestHeader(key, header[key]) xhr.setRequestHeader(key, header[key])
...@@ -131,5 +111,14 @@ export function uploadFile ({ ...@@ -131,5 +111,14 @@ export function uploadFile ({
}) })
} }
} }
urlToFile(filePath).then(upload).catch(() => {
setTimeout(() => {
invoke(callbackId, {
errMsg: 'uploadFile:fail file error'
})
}, 0)
})
return uploadTask return uploadTask
} }
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册