提交 9e2de20d 编写于 作者: Q qiang

feat: H5端选择文件接口支持返回原始File对象 close #1510 #1004

上级 e449a680
...@@ -61,3 +61,8 @@ export function fileToUrl (file) { ...@@ -61,3 +61,8 @@ export function fileToUrl (file) {
files[url] = file files[url] = file
return url return url
} }
export function revokeObjectURL (url) {
(window.URL || window.webkitURL).revokeObjectURL(url)
delete files[url]
}
...@@ -50,26 +50,27 @@ export function chooseImage ({ ...@@ -50,26 +50,27 @@ export function chooseImage ({
document.body.appendChild(imageInput) document.body.appendChild(imageInput)
imageInput.addEventListener('change', function (event) { imageInput.addEventListener('change', function (event) {
const tempFilePaths = []
const tempFiles = [] const tempFiles = []
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 = fileToUrl(file) let filePath
Object.defineProperty(file, 'filePath', {
tempFilePaths.push(filePath) get () {
tempFiles.push({ filePath = filePath || fileToUrl(file)
path: filePath, return filePath
size: file.size, }
name: file.name
}) })
tempFiles.push(file)
} }
const res = {
invoke(callbackId, {
errMsg: 'chooseImage:ok', errMsg: 'chooseImage:ok',
tempFilePaths: tempFilePaths, get tempFilePaths () {
return tempFiles.map(({ filePath }) => filePath)
},
tempFiles: tempFiles tempFiles: tempFiles
}) }
invoke(callbackId, res)
// TODO 用户取消选择时,触发 fail,目前尚未找到合适的方法。 // TODO 用户取消选择时,触发 fail,目前尚未找到合适的方法。
}) })
......
import { fileToUrl } from 'uni-platform/helpers/file' import { fileToUrl, revokeObjectURL } from 'uni-platform/helpers/file'
import { updateElementStyle } from 'uni-shared' import { updateElementStyle } from 'uni-shared'
const { const {
...@@ -42,23 +42,30 @@ export function chooseVideo ({ ...@@ -42,23 +42,30 @@ 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 = fileToUrl(file) const callbackResult = {
let callbackResult = {
errMsg: 'chooseVideo:ok', errMsg: 'chooseVideo:ok',
tempFilePath: filePath, tempFile: file,
size: file.size, size: file.size,
duration: 0, duration: 0,
width: 0, width: 0,
height: 0, height: 0,
name: file.name name: file.name
} }
let filePath
Object.defineProperty(callbackResult, 'tempFilePath', {
get () {
filePath = filePath || fileToUrl(this.tempFile)
return filePath
}
})
const video = document.createElement('video') const video = document.createElement('video')
if (video.onloadedmetadata !== undefined) { if (video.onloadedmetadata !== undefined) {
const filePath = fileToUrl(file)
// 尝试获取视频的宽高信息 // 尝试获取视频的宽高信息
video.onloadedmetadata = function () { video.onloadedmetadata = function () {
invoke(callbackId, Object.assign({}, callbackResult, { revokeObjectURL(filePath)
invoke(callbackId, Object.assign(callbackResult, {
duration: video.duration || 0, duration: video.duration || 0,
width: video.videoWidth || 0, width: video.videoWidth || 0,
height: video.videoHeight || 0 height: video.videoHeight || 0
...@@ -66,11 +73,9 @@ export function chooseVideo ({ ...@@ -66,11 +73,9 @@ export function chooseVideo ({
} }
// 部分浏览器(如微信内置浏览器)未播放无法触发loadedmetadata事件 // 部分浏览器(如微信内置浏览器)未播放无法触发loadedmetadata事件
setTimeout(() => { setTimeout(() => {
invoke(callbackId, Object.assign({}, callbackResult, { video.onloadedmetadata = null
duration: 0, revokeObjectURL(filePath)
width: 0, invoke(callbackId, callbackResult)
height: 0
}))
}, 300) }, 300)
video.src = filePath video.src = filePath
} else { } else {
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册