plus 解决uni-app播放多音频背景音乐

播放音频文件

let audioPlayer = null;  

// #ifdef APP-PLUS  
// 背景音乐文件  
let path = plus.io.convertLocalFileSystemURL("_www/static/audio/background_music.mp3");  
if (plus.os.name == 'Android') {  
    let MediaPlayer = plus.android.importClass("android.media.MediaPlayer");  
    audioPlayer = new MediaPlayer()  
    audioPlayer.setDataSource(path); //指定音频文件路径  
    audioPlayer.setLooping(true); //设置为循环播放  
    audioPlayer.prepare(); //初始化播放器MediaPlayer  
    audioPlayer.start();  
    // 获取音乐的总时长  
    console.log(audioPlayer.getDuration());  
}  
if (plus.os.name == "iOS") {  
    let NSData = plus.ios.importClass("NSData");  
    let AVAudioPlayer = plus.ios.importClass("AVAudioPlayer");  
    let pathFileData = NSData.dataWithContentsOfFile(path);  
    audioPlayer = new AVAudioPlayer();  
    audioPlayer.initWithDataerror(pathFileData, null);  
    audioPlayer.setNumberOfLoops(-1); //-1：无限循环   
    audioPlayer.prepareToPlay(); //初始化播放器  
    audioPlayer.play();  
    // 获取音乐的总时长  
    console.log(audioPlayer.duration());  
}  
// #endif

调节系统媒体音量

let AudioManager = null;  
let audioManager = null;  

/// 获取系统音量控制  
// #ifdef APP-PLUS  
if (plus.os.name == 'Android') {  
    let context = plus.android.importClass("android.content.Context");  
    let main = plus.android.runtimeMainActivity();  
    AudioManager = plus.android.importClass("android.media.AudioManager");  
    audioManager = main.getSystemService(context.AUDIO_SERVICE);  
    // 调节是否显示调节ui  
    // audioManager.adjustStreamVolume (AudioManager.STREAM_MUSIC , AudioManager.ADJUST_RAISE, AudioManager.FLAG_SHOW_UI)  
    // 音量最大范围  
    let max = audioManager.getStreamMaxVolume(AudioManager.STREAM_MUSIC);  
    // 当前音量值  
    let current = audioManager.getStreamVolume(AudioManager.STREAM_MUSIC);  
    console.log(max, current);  
}  
if (plus.os.name == "iOS") {  
    // 暂无查找  
}  
// #endif  

// 设置音量值  
// #ifdef APP-PLUS  
if (plus.os.name == 'Android') {  
    audioManager.setStreamVolume(AudioManager.STREAM_MUSIC, 89, 0); // 89为音量值  
}  
if (plus.os.name == "iOS") {  
    // 暂无查找  
}  
// #endif  

在项目后期有次打包，结果打包后的apk闪退，最后发现项目中多了package.json和extension.js文件，将这两个文件删除后就行了

uni.webView 这个有没有文档，
这个方法只在https://uniapp.dcloud.io/api/router?id=event-channel 提了一句话
在uniapp引入uni的H5页面 uni.webView 显示undefined
methods: {
back() {
console.log(uni.webView);
uni.webView.navigateBack();
}
}

undefined at webpack-internal:///./node_modules/babel-loader/lib/index.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js?!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader/index.js?!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-uni-app-loader/using-components.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/index.js?!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-scoped-loader/index.js!../../../pages/index/zhubotixianlogin.vue?vue&type=script&lang=js&:39
11:35:26.799 [Vue warn]: Error in v-on handler: "TypeError: Cannot read property 'navigateBack' of undefined"
11:35:26.840 found in
11:35:26.881 ---> at pages/index/zhubotixianlogin.vue at http://192.168.0.108:8081/static/js/chunk-vendors.js:3883
11:35:26.902 [system] TypeError: Cannot read property 'navigateBack' of undefined at http://192.168.0.108:8081/static/js/chunk-vendors.js:124

刚接触nuve的 新手想知道如何在 nvue 中使用vuex，大家肯定上官网搜索 方法，并且对官方人员发的文章深信不疑，过度依赖官方，嗯 我也是是这样的，导致了至始至终都是从自己身上找问题，结果焦躁一整天得不到解决！！

官方人员并不是神，也是有血有肉的人，程序开发过程难免会出现一些BUG，文章也是！！！

比如这个：https://ask.dcloud.net.cn/article/35021

我不止一次的提出改文章的问题，并且页得到官方的认可！！

这篇文章教你 在 uni-app 项目根目录下新建 store 目录，在 store 目录下创建 index.js 定义状态值

const store = new Vuex.Store({    
    state: {    
        login: false,    
        token: '',    
        avatarUrl: '',    
        userName: ''    
    },    
    mutations: {    
        login(state, provider) {    
            console.log(state)    
            console.log(provider)    
            state.login = true;    
            state.token = provider.token;    
            state.userName = provider.userName;    
            state.avatarUrl = provider.avatarUrl;    
        },    
        logout(state) {    
            state.login = false;    
            state.token = '';    
            state.userName = '';    
            state.avatarUrl = '';    
        }    
    }    
})

然后，需要在 main.js 挂载 Vuex

import store from './store'    
Vue.prototype.$store = store

如果你信了，直接复制粘贴，程序启动就报错了，不信你可以试试！！

其实正确的写法应该是这样：

import Vue from 'vue'  
import Vuex from 'vuex'  
Vue.use(Vuex)  
const store = new Vuex.Store({  
  state: {  
    value:''  
  },  
  mutations: {  
     setWebset(state, value) {  
         state.value = value  
     },  
  },  
  actions: {  

  },  
  modules: {  

  }  

})  
export default store

然后，需要在 main.js 挂载 Vuex

import store from './store'    
Vue.prototype.$store = store

这样写保你不报错！！

下面是测试赋值和取值的方法！

你可以在App.vue中赋值测试

onLaunch: function() {  
    this.$store.commit("setWebset", '赋值');  
},

然后在其他页面 取值

console.log(this.$store.state.value)

运行结果如下：

我发这个提示并不是纯粹的吐槽官方，同时也提供了解决方法！

1. 通过defineComponents定义的组件导出的时候会提示"export 'defineComponent' was not found in 'vue'
   小程序开发工具会报错 TypeError: Object(...) is not a function

   <script>  
   import { defineComponent, toRefs } from 'vue'  
   export default defineComponent({  
   name: 'xxx',  
   props: {  
       tips: {  
           type: Array,  
           default: () => {  
               return []  
           }  
       }  
   },  
   setup(props, context) {  
       return {  
           ...toRefs(props)  
       }  
   }  
   })  
   </script>

2. import { getCurrentInstance } from vue，uni-app框架下在vue中暂时拿不到getCurrentInstance这个函数，无法访问到getCurrentInstance

3. v-model双向数据绑定默认用的还是原来的value属性和input事件，不是vue3.0中的v-bind:modelValue="xxx"的modelValue属性和update:modelValue事件;

4. ref无法获取组件实例ref引用;

   
   <share ref="shareRef" ></share>  
   const shareRef = ref(null)  
   onMounted(() => {  
   console.log('onMounted, shareRef: ', shareRef.value)//此处打印null,undefined  
   })  

感谢：我的好兄弟柳晨以及朱玉丹

有图有真相

前同事镇楼

第一步：

去下面这个网址 下载csr文件 免费的
https://www.yunedit.com/update/appstore/list

第二步：

1.苹果开发者网站 注册开发者 需要填写信息（太多了不做过多的描述）

https://developer.apple.com/account/#/overview/3T76S86992

红色框内选中注册

2.勾选 iOS Distribution (App Store and Ad Hoc)（上线到appsore） 一路next

下载 文件 ios_distribution.cer

回到第一步 上传cer 文件

3.点击 Identifiers 选中 App IDs app 填写 Bundle ID 一路next 保存即可 不需要下载

4.点击Profiles 两种选项 Development（开发） Distribution（生产）选中 App Store 下载mobileprovision

5.回到第一步生成.p12文件（不免费 一年大约29元人民币）同时生成密码

以上云打包ios上线所需要的文件 全部齐全

                                                                                                                                                                                           HBuildx:2.8.11.20200907  

                                                                                                                                                                                           联系邮箱：97272442@qq.com  

HTML部分

scroll-y="true" style="height: 500px;" :scroll-top="scrollTop" @scroll="scroll" 这四项都得有

高度需要设置一个具体值，可用变量，有时会用到uni.getSystemInfo获取屏幕高度进一步计算

<scroll-view scroll-y="true" style="height: 500px;" :scroll-top="scrollTop"  @scroll="scroll">  
</scroll-view>

data部分 俩变量

scrollTop: 100,  
old: {  
    scrollTop: 0  
},

methods部分

scroll(e) {  
    this.old.scrollTop = e.detail.scrollTop  
},

// 使页面元素滚动的方法(切换两个tab让下面的内容滚动到紧挨着tab下面)  
changeRuleItem(item, index) {  
                this.policyTitle.map( (current, cindex) => {  
                    if (index == cindex) {  
                        current.active = true;  
                    } else {  
                        current.active = false;  
                    }  
                })  
                var that = this;  
                this.scrollTop = this.old.scrollTop; // 先初始化scrollTop为上次滚动值  
                if (this.policyTitle[0].active) {  
                    uni.createSelectorQuery().select("#policy-begin").boundingClientRect(data=>{//目标节点  
                    　　uni.createSelectorQuery().select(".check-popup").boundingClientRect((res)=>{//最外层盒子节点  
                            setTimeout(gogogo, 100);  
                            function gogogo() {  
                                const query = uni.createSelectorQuery().in(that);  
                                query.select('#policy-pop').boundingClientRect(data => {  
                                    if (data) {  
                                        console.log()  
                                        that.scrollTop = res.top - data.top;  
                                    }  
                                }).exec();  
                            }  
                    　　}).exec()  
                    }).exec();  

                } else {  
                    uni.createSelectorQuery().select("#policy-luggage").boundingClientRect(data=>{//目标节点  
                    　　uni.createSelectorQuery().select("#policy-begin").boundingClientRect((res)=>{//最外层盒子节点  
                            setTimeout(gogogo, 100);  
                            function gogogo() {  
                                const query = uni.createSelectorQuery().in(that);  
                                query.select('#policy-pop').boundingClientRect(data1 => {  
                                    if (data) {  
                                        that.scrollTop = data.top - res.top;  
                                    }  
                                }).exec();  
                            }  
                    　　}).exec()  
                    }).exec();  
                }  
            }  

尚未解决的问题

1. 没有滚动过程
2. 没弄清楚怎么精确到指定位置

在hx 新版本中会调用音频方法编译小程序后，会出现部分机型闪退，以及v-show和v-if失效的问题。回退hx

调用compressImage 后在显示即可

uni.compressImage({  
        src : path, // 本地路径 file://-------  
    quality: 100,  
    success(res) {  
              console.log(res.tempFilePath) // 可以显示的路径  
        }  
})

问题链接: uniap image标签问题

什么是e签宝

e签宝是互联网电子签名公司，从身份认证数据源、证书核验、可信时间戳、私钥保存位置等多个关键点入手提供技术保障，同时从实名认证、意愿认证、签名、存证等环节提供可靠签署流程，证据实时上链，为用户提供放心的签署服务。

e签宝作用

保障用户购买源码授权版本时，用户和插件作者双方的权益，提供法律服务、避免法律纠纷。

e签宝实名认证流程

点击查看e签宝实名认证流程

e签宝电子协议签署流程

点击查看e签宝电子协议签署流程

插件源码授权版购买流程

点击查看插件源码授权版购买流程

parser-audio

完善jyf-parser的audio插件，实现jyf-parser在uniapp中支持微信小程序和APP的audio,可自动暂停上一首
GitHub:https://github.com/woxiaoyao81/parser-audio

首先非常感谢

Parser是非常优秀的富文本解析插件，以前开发微信小程序用它，现在开放uniapp也用它，目前没发现比它更强大的，作者地址https://github.com/jin-yufeng/Parser

使用时遇到问题

• autopause属性无效，经过检查它是依据id来实现，而视频和音频的id默认是video1和audio1，除非html中已经给video和audio指定id，明显这不现实
• audio插件在uniapp编译后，微信小程序工作正常，而在APP中则不正常，当然官方已经申明了APP不支持audio

目前解决的

• 修改了audio插件，使用它可以支持微信小程序和APP
  • 为支持app，将this.setSrc(this.src)移到_buttonTap()方法中
  • 为实现app播放时自动暂停上一首，增加了onPause事件
  • 为实现微信小程序也支持自动暂停，引入了vuex，这里vuex是使用uView封装的https://www.uviewui.com/guide/globalVariable.html
    通过数组压入和弹出来控制暂停上一首，需要增加vuex变量vuex_audio。
  • 原audio插件布局太不灵活，在平板适配时非常大，不好看，我对界面进行了自适应调整，适配微信小程序、手机和平板，比较人性化

目录结构

• jyf-parser是Parser官方的uni包，我增加了修改后的audio，已经可以支持APP和微信小程序了
• store是uView封装的vuex，vuex_audio变量我已经增加，自己可以修改。

推荐

Parser https://github.com/jin-yufeng/Parser
uView https://www.uviewui.com

压缩包见下：