Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
小浣熊撸代码
uni-app
提交
ced3159e
U
uni-app
项目概览
小浣熊撸代码
/
uni-app
与 Fork 源项目一致
Fork自
DCloud / uni-app
通知
1
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
1
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
uni-app
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
1
Issue
1
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
ced3159e
编写于
4月 15, 2021
作者:
D
DCloud_LXH
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat(h5): chooseFile
上级
f34dc72f
变更
5
隐藏空白更改
内联
并排
Showing
5 changed file
with
254 addition
and
1 deletion
+254
-1
packages/uni-api/src/helpers/api/index.ts
packages/uni-api/src/helpers/api/index.ts
+1
-1
packages/uni-api/src/protocols/media/chooseFile.ts
packages/uni-api/src/protocols/media/chooseFile.ts
+42
-0
packages/uni-h5/src/service/api/media/MIMEType.ts
packages/uni-h5/src/service/api/media/MIMEType.ts
+58
-0
packages/uni-h5/src/service/api/media/chooseFile.ts
packages/uni-h5/src/service/api/media/chooseFile.ts
+82
-0
packages/uni-h5/src/service/api/media/createInput.ts
packages/uni-h5/src/service/api/media/createInput.ts
+71
-0
未找到文件。
packages/uni-api/src/helpers/api/index.ts
浏览文件 @
ced3159e
...
...
@@ -189,7 +189,7 @@ export function defineOffApi<T extends ApiLike>(
export
function
defineTaskApi
<
T
extends
TaskApiLike
,
P
=
AsyncApiOptions
<
T
>>
(
name
:
string
,
fn
:
(
args
:
Omit
<
P
,
'
success
'
|
'
fail
'
|
'
complete
'
>
,
args
:
Omit
<
P
,
CALLBACK_TYPES
>
,
res
:
{
resolve
:
(
res
?:
AsyncApiRes
<
P
>
)
=>
void
reject
:
(
err
?:
string
)
=>
void
...
...
packages/uni-api/src/protocols/media/chooseFile.ts
0 → 100644
浏览文件 @
ced3159e
import
{
CHOOSE_SOURCE_TYPES
,
elemsInArray
,
elemInArray
,
}
from
'
../../helpers/protocol
'
export
const
API_CHOOSE_FILE
=
'
chooseFile
'
export
type
API_TYPE_CHOOSE_FILE
=
typeof
uni
.
chooseFile
export
type
API_TYPE_CHOOSE_FILE_OPTIONS
=
AsyncApiOptions
<
API_TYPE_CHOOSE_FILE
>
const
CHOOSE_MEDIA_TYPE
:
API_TYPE_CHOOSE_FILE_OPTIONS
[
'
type
'
][]
=
[
'
all
'
,
'
image
'
,
'
video
'
,
]
export
const
ChooseFileOptions
:
ApiOptions
<
API_TYPE_CHOOSE_FILE
>
=
{
formatArgs
:
{
count
(
count
,
params
)
{
if
(
count
!
<=
0
)
{
params
.
count
=
100
}
},
sourceType
(
sourceType
,
params
)
{
params
.
sourceType
=
elemsInArray
(
sourceType
,
CHOOSE_SOURCE_TYPES
)
},
type
(
type
,
params
)
{
params
.
type
=
elemInArray
(
type
,
CHOOSE_MEDIA_TYPE
)
},
extension
(
extension
,
params
)
{
if
(
extension
instanceof
Array
&&
extension
.
length
===
0
)
{
return
'
param extension should not be empty.
'
}
if
(
!
extension
)
params
.
extension
=
[
''
]
},
},
}
export
const
ChooseFileProtocol
:
ApiProtocol
<
API_TYPE_CHOOSE_FILE
>
=
{
count
:
Number
,
sourceType
:
Array
,
type
:
String
as
any
,
extension
:
Array
,
}
packages/uni-h5/src/service/api/media/MIMEType.ts
0 → 100644
浏览文件 @
ced3159e
const
MIMEType
:
{
image
:
Record
<
string
,
any
>
video
:
Record
<
string
,
any
>
}
=
{
/**
* 关于图片常见的MIME类型
*/
image
:
{
jpg
:
'
jpeg
'
,
jpe
:
'
jpeg
'
,
pbm
:
'
x-portable-bitmap
'
,
pgm
:
'
x-portable-graymap
'
,
pnm
:
'
x-portable-anymap
'
,
ppm
:
'
x-portable-pixmap
'
,
psd
:
'
vnd.adobe.photoshop
'
,
pic
:
'
x-pict
'
,
rgb
:
'
x-rgb
'
,
svg
:
'
svg+xml
'
,
svgz
:
'
svg+xml
'
,
tif
:
'
tiff
'
,
xif
:
'
vnd.xiff
'
,
wbmp
:
'
vnd.wap.wbmp
'
,
wdp
:
'
vnd.ms-photo
'
,
xbm
:
'
x-xbitmap
'
,
ico
:
'
x-icon
'
,
},
/**
* 关于视频常见的MIME类型
*/
video
:
{
'
3g2
'
:
'
3gpp2
'
,
'
3gp
'
:
'
3gpp
'
,
avi
:
'
x-msvideo
'
,
f4v
:
'
x-f4v
'
,
flv
:
'
x-flv
'
,
jpgm
:
'
jpm
'
,
jpgv
:
'
jpeg
'
,
m1v
:
'
mpeg
'
,
m2v
:
'
mpeg
'
,
mpe
:
'
mpeg
'
,
mpg
:
'
mpeg
'
,
mpg4
:
'
mpeg
'
,
m4v
:
'
x-m4v
'
,
mkv
:
'
x-matroska
'
,
mov
:
'
quicktime
'
,
qt
:
'
quicktime
'
,
movie
:
'
x-sgi-movie
'
,
mp4v
:
'
mp4
'
,
ogv
:
'
ogg
'
,
smv
:
'
x-smv
'
,
wm
:
'
x-ms-wm
'
,
wmv
:
'
x-ms-wmv
'
,
wmx
:
'
x-ms-wmx
'
,
wvx
:
'
x-ms-wvx
'
,
},
}
export
default
MIMEType
packages/uni-h5/src/service/api/media/chooseFile.ts
0 → 100644
浏览文件 @
ced3159e
//#region imp functions
import
{
API_CHOOSE_FILE
,
ChooseFileOptions
,
ChooseFileProtocol
,
defineAsyncApi
,
}
from
'
@dcloudio/uni-api
'
import
{
fileToUrl
}
from
'
../../../helpers/file
'
import
_createInput
from
'
./createInput
'
//#endregion
//#region types
import
type
{
API_TYPE_CHOOSE_FILE
}
from
'
@dcloudio/uni-api
'
type
TempFile
=
UniApp
.
ChooseFileSuccessCallbackResultFile
//#endregion
let
fileInput
:
HTMLInputElement
=
null
as
any
export
const
chooseFile
=
defineAsyncApi
<
API_TYPE_CHOOSE_FILE
>
(
API_CHOOSE_FILE
,
(
{
// sizeType,
count
,
sourceType
,
type
,
extension
,
},
{
resolve
,
reject
}
)
=>
{
// TODO handle sizeType 尝试通过 canvas 压缩
if
(
fileInput
)
{
document
.
body
.
removeChild
(
fileInput
)
fileInput
=
null
as
any
}
fileInput
=
_createInput
({
count
,
sourceType
,
type
,
extension
,
})
document
.
body
.
appendChild
(
fileInput
)
fileInput
.
addEventListener
(
'
change
'
,
function
(
event
:
Event
)
{
const
eventTarget
=
event
.
target
as
HTMLInputElement
const
tempFiles
:
TempFile
[]
=
[]
if
(
eventTarget
&&
eventTarget
.
files
)
{
const
fileCount
=
eventTarget
.
files
.
length
for
(
let
i
=
0
;
i
<
fileCount
;
i
++
)
{
const
file
=
eventTarget
.
files
[
i
]
let
filePath
:
string
Object
.
defineProperty
(
file
,
'
path
'
,
{
get
()
{
filePath
=
filePath
||
fileToUrl
(
file
)
return
filePath
},
})
if
(
i
<
count
!
)
tempFiles
.
push
(
file
as
any
)
}
}
const
res
=
{
errMsg
:
'
chooseFile:ok
'
,
get
tempFilePaths
()
{
return
tempFiles
.
map
(({
path
})
=>
path
)
},
tempFiles
:
tempFiles
,
}
resolve
(
res
)
// TODO 用户取消选择时,触发 fail,目前尚未找到合适的方法。
})
fileInput
.
click
()
},
ChooseFileProtocol
,
ChooseFileOptions
)
packages/uni-h5/src/service/api/media/createInput.ts
0 → 100644
浏览文件 @
ced3159e
import
{
updateElementStyle
}
from
'
@dcloudio/uni-shared
'
import
MIMEType
from
'
./MIMEType
'
export
type
createInputOptions
=
Pick
<
UniApp
.
ChooseFileOptions
,
'
count
'
|
'
sourceType
'
|
'
type
'
|
'
extension
'
>
const
ALL
=
'
all
'
function
isWXEnv
():
boolean
{
const
ua
=
window
.
navigator
.
userAgent
.
toLowerCase
()
const
matchUA
=
ua
.
match
(
/MicroMessenger/i
)
return
!!
(
matchUA
&&
matchUA
[
0
]
===
'
micromessenger
'
)
}
export
default
function
({
count
,
sourceType
,
type
,
extension
,
}:
createInputOptions
):
HTMLInputElement
{
const
inputEl
=
document
.
createElement
(
'
input
'
)
inputEl
.
type
=
'
file
'
updateElementStyle
(
inputEl
,
{
position
:
'
absolute
'
,
visibility
:
'
hidden
'
,
zIndex
:
'
-999
'
,
width
:
'
0
'
,
height
:
'
0
'
,
top
:
'
0
'
,
left
:
'
0
'
,
})
/**
* 选择文件
* chooseFile 使用后缀名
* chooseImage、chooseVideo 使用MIME类型
*/
inputEl
.
accept
=
extension
!
.
map
((
item
)
=>
{
if
(
type
!==
ALL
)
{
const
MIMEKey
=
item
.
replace
(
'
.
'
,
''
)
return
`
${
type
}
/
${
MIMEType
[
type
!
][
MIMEKey
]
||
MIMEKey
}
`
}
else
{
// 在微信环境里,'.jpeg,.png' 会提示没有应用可执行此操作
if
(
isWXEnv
())
{
return
'
.
'
}
return
item
.
indexOf
(
'
.
'
)
===
0
?
item
:
`.
${
item
}
`
}
})
.
join
(
'
,
'
)
if
(
count
&&
count
>
1
)
{
inputEl
.
multiple
=
true
}
// 经过测试,仅能限制只通过相机拍摄,不能限制只允许从相册选择。
if
(
type
!==
ALL
&&
sourceType
instanceof
Array
&&
sourceType
.
length
===
1
&&
sourceType
[
0
]
===
'
camera
'
)
{
inputEl
.
setAttribute
(
'
capture
'
,
'
camera
'
)
}
return
inputEl
}
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录