ios不顯示拍照和相冊選中的圖片
問題描述:
vue打包成5+app,ios端,安卓端是可以直接顯示的,pc不支持呼叫5+app屬性的
解決方案:
ios不顯示拍照和相冊選中的圖片
配置:5+app中的manifest.json
permissions下面配置系統相冊和攝像頭
plus或者app-plus下面配置"runmode" : “liberate”,
權限配置:選中權限前面打勾即可
android.hardware.camera
android.hardware.camera.autofocus
android.permission.CAMERA
android.permission.WRITE_EXTERNAL_STORAGE
android.permission.READ_EXTERNAL_STORAGE
manifest.json:
"permissions" : {
"Gallery" : {
"description" : "系統相冊"
},
"Camera" : {
"description" : "攝像頭"
},
},
"plus" : {
"runmode" : "liberate",
},
html:
<template>
<div class="test">
<div @click="imgshow = true">
<!-- 默認頭像 -->
<img src="../../assets/x.png" v-show="imgSrc == ''" width="100px" height="100px"/>
<!-- 選中照片和照片,圖片顯示 -->
<img :src="imgSrc" v-show="imgSrc != ''" />
</div>
<div>
<van-action-sheet
v-model="imgshow"
:actions="actions"
cancel-text="取消"
close-on-click-action
@select="onSelect"
title="選擇"
close-icon
/>
</div>
</div>
</template>
js:
<script>
export default {
data() {
return {
imgshow: false,
imgSrc: "", //展示的圖片路徑
actions: [{ name: "拍照" }, { name: "相冊" }],
};
},
methods:{
onSelect(item) {
// 默認情況下點擊選項時不會自動收起
// 可以通過 close-on-click-action 屬性開啟自動收起
this.imgshow = false;
// Toast(item.name);
if (item.name == "拍照") {
console.log("拍照");
// 呼叫方法
this.captureImage();
} else {
console.log("照片");
this.galleryImg();
}
},
// 拍照方法
captureImage() {
let This = this;
var cmr = plus.camera.getCamera(); //獲取攝像頭管理物件
var res = cmr.supportedImageResolutions[0]; //字串陣列,攝像頭支持的拍照解析度
var fmt = cmr.supportedImageFormats[0]; //字串陣列,攝像頭支持的拍照檔案格式
console.log("拍照解析度: " + res + ", 拍照檔案格式: " + fmt);
cmr.captureImage(
function (path) {
//進行拍照操作
// 通過URL引數獲取目錄物件或檔案物件
plus.io.resolveLocalFileSystemURL(path, function (entry) {
var tmpPath = entry.toLocalURL(); //獲取目錄路徑轉換為本地路徑URL地址
This.imgSrc = tmpPath;
// alert("拍攝成功: " + tmpPath);
});
},
function (error) {
//捕獲影像失敗回呼
console.log("捕獲影像失敗: " + error.message);
},
{ resolution: res, format: fmt }
);
},
// 相冊方法
galleryImg() {
let This = this;
console.log("從相冊中選擇圖片:");
plus.gallery.pick(
function (path) {
//從相冊中選擇圖片
This.imgSrc = path;
// alert(path);
},
function (e) {
//取消選擇圖片
console.log("取消選擇圖片");
},
{ filter: "image" }
);
},
},
};
</script>
原因分析:
liberate模式在第一次啟動時將解壓應用資源(Android平臺File API才可正常訪問_www目錄)

轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/277067.html
標籤:其他
