简体中文
简体中文
# uni.getImageInfo(options)
获取图片信息
# getImageInfo 兼容性
| Web | 微信小程序 | Android | iOS | HarmonyOS | HarmonyOS(Vapor) |
|---|---|---|---|---|---|
| 4.0 | 4.41 | 4.18 | 4.25 | 4.61 | 5.0 |
# 参数
| 名称 | 类型 | 必填 | 默认值 | 兼容性 | 描述 | ||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| options | GetImageInfoOptions | 是 | - | - | |||||||||||||||||||||||||||||||
| |||||||||||||||||||||||||||||||||||
# GetImageInfoSuccess 的属性值
| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 | |||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| width | number | 是 | - | 图片宽度，单位px | ||||||||||||||||||||||||||||
| height | number | 是 | - | 图片高度，单位px | ||||||||||||||||||||||||||||
| path | string | 是 | - | 返回图片的本地路径 | ||||||||||||||||||||||||||||
| orientation | string | 否 | - | 返回图片的方向 | ||||||||||||||||||||||||||||
| ||||||||||||||||||||||||||||||||
| type | string | 否 | - | 返回图片的格式 | ||||||||||||||||||||||||||||
# GetImageInfoFail 的属性值
| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 | |||||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| errCode | number | 是 | - | - | 错误码 | |||||||||||||||||||||||||||||||||
| ||||||||||||||||||||||||||||||||||||||
| errSubject | string | 是 | - | - | 统一错误主题（模块）名称 | |||||||||||||||||||||||||||||||||
| data | any | 否 | - | - | 错误信息中包含的数据 | |||||||||||||||||||||||||||||||||
| cause | Error | 否 | - | - | 源错误信息，可以包含多个错误，详见SourceError | |||||||||||||||||||||||||||||||||
| errMsg | string | 是 | - | - | ||||||||||||||||||||||||||||||||||
# 参见
- 相关 Bug
- 参见uni-app相关文档
- 微信小程序文档
- 支付宝小程序文档
- 百度小程序文档
- 抖音小程序文档
- 飞书小程序文档
- 钉钉小程序文档
- QQ小程序文档
- 快手小程序文档
- 京东小程序文档
- 华为快应用文档
- 360小程序文档
# tips
web平台读取图片的exif信息，需要引入三方库。考虑到影响web runtime的体积大小，这些三方库并没有内置在uni-app x中。
目前比较主流的库是ExifReader，开发者可自行使用。
# 示例
示例为hello uni-app x alpha分支，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例另见
示例
<template>
<!-- #ifdef APP -->
<scroll-view style="flex:1">
<!-- #endif -->
<page-head :title="title"></page-head>
<view class="uni-padding-wrap">
<view class="uni-title">
<text class="uni-subtitle-text">获取本地相对路径图片信息</text>
</view>
<image class="image" :src="relativeImagePath" mode="aspectFit"></image>
<text class="margin-top-10">{{absoluteImageInfo}}</text>
<view class="uni-title">
<text class="uni-subtitle-text">获取网络路径图片信息</text>
</view>
<image class="image" :src="remoteImagePath" mode="aspectFit"></image>
<text class="margin-top-10">{{remoteImageInfo}}</text>
<view class="uni-title">
<text class="uni-subtitle-text">获取本地绝对路径图片信息</text>
</view>
<image class="image" :src="absoluteImagePath" mode="aspectFit"></image>
<text class="margin-top-10">{{relativeImageInfo}}</text>
<view class="uni-btn-v">
<button type="primary" @click="chooseImage">拍摄照片或从相册中选择照片</button>
</view>
</view>
<!-- #ifdef APP -->
</scroll-view>
<!-- #endif -->
</template>
<script setup lang="uts">
type TestStateType = {
imageInfoForTest: UTSJSONObject | null
}
const title = ref("getImageInfo")
const relativeImagePath = ref("/static/test-image/logo.png")
const relativeImageInfo = ref("")
const absoluteImagePath = ref("")
const absoluteImageInfo = ref("")
const remoteImagePath = ref("https://request.dcloud.net.cn/api/http/contentType/image/png")
const remoteImageInfo = ref("")
// 自动化测试
const testState = reactive({
imageInfoForTest: null as UTSJSONObject | null
} as TestStateType)
const chooseImage = () => {
uni.chooseImage({
count: 1,
success: (res) => {
absoluteImagePath.value = res.tempFilePaths[0];
uni.getImageInfo({
src: res.tempFilePaths[0],
success: (_res) => {
console.log("getImageInfo success", JSON.stringify(_res));
relativeImageInfo.value = `图片宽度: ${_res.width}\n图片高度: ${_res.height}\n图片路径: ${_res.path}\n图片方向: ${_res.orientation}\n图片格式: ${_res.type}`;
},
fail: (err) => {
uni.showModal({
title: "获取图片信息失败",
content: JSON.stringify(err),
showCancel: false
});
}
});
}
});
}
onReady(() => {
uni.getImageInfo({
src: relativeImagePath.value,
success: (res) => {
console.log("getImageInfo success", JSON.stringify(res));
absoluteImageInfo.value = `图片宽度: ${res.width}\n图片高度: ${res.height}\n图片路径: ${res.path}\n图片方向: ${res.orientation}\n图片格式: ${res.type}`;
testState.imageInfoForTest = {
"width": res.width,
"height": res.height,
"path": res.path.slice(res.path.indexOf('static/') + 'static/'.length),
"orientation": res.orientation,
"type": res.type
};
},
fail: (err) => {
uni.showModal({
title: "获取图片信息失败",
content: JSON.stringify(err),
showCancel: false
});
testState.imageInfoForTest = null;
}
});
uni.getImageInfo({
src: remoteImagePath.value,
success: (res) => {
console.log("getImageInfo success", JSON.stringify(res));
remoteImageInfo.value = `图片宽度: ${res.width}\n图片高度: ${res.height}\n图片路径: ${res.path}\n图片方向: ${res.orientation}\n图片格式: ${res.type}`;
},
fail: (err) => {
uni.showModal({
title: "获取图片信息失败",
content: JSON.stringify(err),
showCancel: false
});
}
});
})
defineExpose({
testState,
chooseImage
})
</script>
<style>
.image {
align-self: center;
}
.margin-top-10 {
margin-top: 10px;
}
</style>
# 通用类型
# GeneralCallbackResult
| 名称 | 类型 | 必备 | 默认值 | 兼容性 | 描述 |
|---|---|---|---|---|---|
| errMsg | string | 是 | - | 错误信息 |
