uni-app
uni-app x
uniCloud
HBuilder X
uni 小程序 sdk
uni-ad广告
开发者服务
uni-app x
uni-app
uni-app x
uniCloud
HBuilder X
uni 小程序 sdk
uni-ad广告
开发者服务
简体中文
API
uni.chooseFile(options)
chooseFile 兼容性
参数
ChooseFileSuccess 的属性值
ChooseFileFail 的属性值
示例
参见
tips
通用类型
GeneralCallbackResult

# uni.chooseFile(options)

从本地选择文件

# chooseFile 兼容性

Web 微信小程序 Android iOS HarmonyOS HarmonyOS(Vapor)
4.0 4.41 4.51 4.61 4.61 5.0

# 参数

名称 类型 必填 默认值 兼容性 描述
options ChooseFileOptions 是 -
-
名称 类型 必备 默认值 兼容性 描述
count number 否 -
最多可以选择的文件数，默认100,注意Android中count只会决定是否是单选/多选，如果count>1 是多选效果，等于1为单选效果,
type string 否 -
选择文件的类型，默认all，可选
- image: 选择图片文件
- video: 选择视频文件
- audio: 选择音频文件
- all: 默认值，选择本地文件，包含图片和视频
合法值 兼容性 描述
image
图片类型
video
视频类型
audio
音频类型
all
-
-
extension Array<string> 否 -
选择文件的后缀名，暂只支持.zip、.png等，不支持application/msword等值, App平台不支持
sizeType any 否 -
original 原图，compressed 压缩图，默认二者都有, App平台不支持
sourceType Array<string> 否 -
album 从相册选图，camera 使用相机，默认二者都有, App平台不支持
success (result: ChooseFileSuccess) => void 否 -
成功则返回图片的本地文件路径列表 tempFilePaths、tempFiles
fail (result: ChooseFileFail) => void 否 -
接口调用失败的回调函数
complete (result: any) => void 否 -
接口调用结束的回调函数（调用成功、失败都会执行）

# ChooseFileSuccess 的属性值

名称 类型 必备 默认值 兼容性 描述
tempFilePaths Array<string> 是 -
文件的本地文件路径列表, Android平台不支持
tempFiles Array<ChooseFileTempFile> 是 -
文件的本地文件列表，每一项是一个 File 对象
名称 类型 必备 默认值 兼容性 描述
name string 是 -
选择的文件名称
path string 是 -
文件路径
size number 是 -
文件大小，单位 B
type string 是 -
-
选择的文件类型
可选值：
- 'video': 选择了视频文件;
- 'image': 选择了图片文件;
- 'audio': 选择了音频文件;
- 'file': 选择了除图片和视频的文件;
合法值 兼容性 描述
video
视频类型
image
图片类型
audio
音频类型
file
除图片和音视频类型的文件

# ChooseFileFail 的属性值

名称 类型 必备 默认值 兼容性 描述
errCode number 是 -
-
错误码
合法值 兼容性 描述
1101001
-
用户取消
1101002
-
urls至少包含一张图片地址
1101003
-
文件不存在
1101004
-
图片加载失败
1101005
-
未获取权限
1101006
-
图片或视频保存失败
1101007
-
图片裁剪失败
1101008
-
拍照或录像失败
1101009
-
图片压缩失败
1101010
-
其他错误
errSubject string 是 -
-
统一错误主题（模块）名称
data any 否 -
-
错误信息中包含的数据
cause Error 否 -
-
源错误信息，可以包含多个错误，详见SourceError
errMsg string 是 -
-

Android端返回的路径是content协议。

# 示例

示例为hello uni-app x alpha分支，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例另见

扫码体验（手机浏览器跳转到App直达页）

示例

<template>
  <!-- #ifdef APP -->
  <scroll-view style="flex: 1;">
  <!-- #endif -->
    <view>
      <page-head :title="title"></page-head>
      <!-- #ifdef APP-IOS -->
      <view style="padding-left: 20px; padding-right: 20px;">
      		<text style="color: #353535; font-size: 15px;">
      			iOS 调试首先需要添加对应 audio、video、image 存储到文件系统中，步骤如下：\n
      			1. 从系统相册或者语音备忘录中选择具体的video、image、audio；\n
      			2. 点击 ‘分享’ 按钮；\n
      			3. 下滑点击 ’存储到”文件“‘按钮；\n
      		</text>
      </view>
      <!-- #endif -->
      <button size="mini" @click="log=''">清空日志</button>
      <text style="margin: 2px; padding: 2px; border: 1px solid #000000;">{{ log }}</text>

      <button class="btnstyle" type="primary" @tap="chooseVideo">选择文件(video) 单选</button>
      <button class="btnstyle" type="primary" @tap="chooseVideoMul">选择文件(video) 多选</button>
      <button class="btnstyle" type="primary" @tap="playVideo">选择文件(video)并播放</button>
      <video class="video" :src="src" :controls="true" :autoplay="true" :loop="true">111</video>
      <button class="btnstyle" type="primary" @tap="chooseImage">选择文件(image) 单选</button>
      <button class="btnstyle" type="primary" @tap="chooseImageMul">选择文件(image) 多选</button>
      <button class="btnstyle" type="primary" @tap="viewImg">选择文件(image) 并预览</button>
      <button class="btnstyle" type="primary" @tap="chooseAudio">选择文件(audio) 单选</button>
      <button class="btnstyle" type="primary" @tap="chooseAudioMul">选择文件(audio) 多选</button>
      <button class="btnstyle" type="primary" @tap="playAudio">选择文件(audio) 并播放</button>
      <button class="btnstyle" type="primary" @tap='chooseAll'>选择文件(all) 单选</button>
      <button class="btnstyle" type="primary" @tap='chooseAllMul'>选择文件(all) 多选</button>

      <view style="height: 4px;"></view>
    </view>
  <!-- #ifdef APP -->
  </scroll-view>
  <!-- #endif -->
</template>

<script setup lang="uts">
  const log = ref('')
  const title = ref('choose-file')
  const src = ref('')
  const _audioContext = ref(null as InnerAudioContext | null)

  onUnmounted(() => {
    if (_audioContext.value != null) {
      _audioContext.value!.destroy()
    }
  })

  const getPath = (chooseFils: ChooseFileTempFile[]): string => {
    var urls = new Array<string>()
    chooseFils.forEach(value => {
      urls.push(value.path)
    })
    return urls.join(', ')
  }

  const chooseVideo = () => {
    uni.chooseFile({
      type: 'video',
      count: 1,
      success: (res) => {
        console.log(res)
        if (res.tempFiles.length > 0) {
          log.value += getPath(res.tempFiles) + '\n\n'
        }
      },
      complete: (res) => {
        console.log(res)
      }
    })
  }

  const chooseVideoMul = () => {
    uni.chooseFile({
      type: 'video',
      success: (res) => {
        console.log(res)
        if (res.tempFiles.length > 0) {
          log.value += getPath(res.tempFiles) + '\n\n'
        }
      },
      complete: (res) => {
        console.log(res)
      }
    })
  }

  const playVideo = () => {
    uni.chooseFile({
      type: 'video',
      count: 1,
      success: (res) => {
        console.log(res)
        if (res.tempFiles.length > 0) {
          src.value = res.tempFiles[0].path
          _audioContext.value?.destroy()
          _audioContext.value = null
        }
      },
      complete: (res) => {
        console.log(res)
      }
    })
  }

  const chooseImage = () => {
    uni.chooseFile({
      type: 'image',
      count: 1,
      success: (res) => {
        console.log(res)
        if (res.tempFiles.length > 0) {
          log.value += getPath(res.tempFiles) + '\n\n'
        }
      },
      complete: (res) => {
        console.log(res)
      }
    })
  }

  const chooseImageMul = () => {
    uni.chooseFile({
      type: 'image',
      count: 90,
      success: (res) => {
        console.log(res)
        if (res.tempFiles.length > 0) {
          log.value += getPath(res.tempFiles) + '\n\n'
        }
      },
      complete: (res) => {
        console.log(res)
      }
    })
  }

  const viewImg = () => {
    uni.chooseFile({
      type: 'image',
      success: (res) => {
        console.log(res)
        if (res.tempFiles.length > 0) {
          const tempFiles: Array<string> = res.tempFiles.map((value) => {
          	return value.path
          })
          uni.previewImage({
            current: 0,
            urls: tempFiles,
            success: (res) => {
              console.log(res)
            },
            fail: (err) => {
              console.log(err)
            }
          })
        }
      },
      complete: (res) => {
        console.log(res)
      }
    })
  }

  const chooseAudio = () => {
    uni.chooseFile({
      type: 'audio',
      count: 1,
      success: (res) => {
        console.log(res)
        if (res.tempFiles.length > 0) {
          log.value += getPath(res.tempFiles) + '\n\n'
        }
      },
      complete: (res) => {
        console.log(res)
      }
    })
  }

  const chooseAudioMul = () => {
    uni.chooseFile({
      type: 'audio',
      success: (res) => {
        console.log(res)
        if (res.tempFiles.length > 0) {
          log.value += getPath(res.tempFiles) + '\n\n'
        }
      },
      complete: (res) => {
        console.log(res)
      }
    })
  }

  const playAudio = () => {
    uni.chooseFile({
      type: 'audio',
      count: 1,
      success: (res) => {
        console.log(res);
        if (res.tempFiles.length > 0) {
          if (_audioContext.value == null) {
          src.value = ''
            _audioContext.value = uni.createInnerAudioContext()
            _audioContext.value!.autoplay = true
          } else if (!_audioContext.value!.paused) {
            _audioContext.value!.stop()
          }
          _audioContext.value!.src = res.tempFiles[0].path
        }
      },
      complete: (res) => {
        console.log(res);
      }
    });
  }

  const chooseAll = () => {
    uni.chooseFile({
      type: 'all',
      count: 1,
      success: (res) => {
        console.log(res)
        if (res.tempFiles.length > 0) {
          log.value += getPath(res.tempFiles) + '\n\n'
        }
      },
      complete: (res) => {
        console.log(res)
      }
    })
  }

  const chooseAllMul = () => {
    uni.chooseFile({
      type: 'all',
      success: (res) => {
        console.log(res)
        if (res.tempFiles.length > 0) {
          log.value += getPath(res.tempFiles) + '\n\n'
        }
      },
      complete: (res) => {
        console.log(res)
      }
    })
  }
</script>

<style>
  .btnstyle {
    margin: 4px;
  }

  .video {
    width: 100%;
    height: 225px;
  }

  .uni-uploader__input-box {
    margin: 5px;
    width: 104px;
    height: 104px;
    border: 1px solid #D9D9D9;
  }
</style>

# 参见

# tips

  • chooseFile是系统UI，其风格不同rom可能有差异。多选时有的是长按、有的是checkbox。系统UI的暗黑模式、国际化跟随系统，而不跟随App。
  • chooseFile不仅仅是选择现有文件，有的手机也可以新拍照、拍摄、录音。但不同系统的实现存在差异。

# 通用类型

# GeneralCallbackResult

名称 类型 必备 默认值 兼容性 描述
errMsg string 是 -
错误信息
本页导读
uni.chooseFile(options)
chooseFile 兼容性
参数
ChooseFileSuccess 的属性值
ChooseFileFail 的属性值
示例
参见
tips
通用类型
GeneralCallbackResult