test.vue 1.57 KB
<!--
 * @Date: 2025-12-18 00:22:07
 * @LastEditors: hookehuyr hookehuyr@gmail.com
 * @LastEditTime: 2025-12-27 22:17:50
 * @FilePath: /mlaj/src/views/test.vue
 * @Description: 文件描述
-->
<template>
  <button @click="setVolume">设置音量</button>
  <audio ref="audioRef" src="https://img.tukuppt.com/newpreview_music/09/03/95/5c8af46b01eb138909.mp3"></audio>

  <StarryBackground bgImage="https://cdn.ipadbiz.cn/mlaj/images/test-bgg03.jpg" />
</template>

<script setup>
import { ref } from 'vue';
import StarryBackground from '@/components/effects/StarryBackground.vue';

const audioRef = ref(null);

const setVolume = async () => {
  try {
    await audioRef.value.play();
    if (typeof WeixinJSBridge !== 'undefined') {
      WeixinJSBridge.invoke('setAudioVolume', { volume: 0.5 }, (res) => {
        if (res.err_msg === 'setAudioVolume:ok') {
          console.log('音量设置成功');
        } else {
          console.error('1音量设置失败:', res.err_msg);
        }
      });
    } else {
      document.addEventListener('WeixinJSBridgeReady', () => {
        WeixinJSBridge.invoke('setAudioVolume', { volume: 0.5 }, (res) => {
          if (res.err_msg === 'setAudioVolume:ok') {
            console.log('音量设置成功');
          } else {
            console.error('2音量设置失败:', res.err_msg);
          }
        });
      }, false);
    }
  } catch (error) {
    console.error('激活音频上下文失败:', error);
  }
};
</script>

<style scoped>
button {
  position: relative;
  z-index: 10;
  padding: 10px 20px;
  font-size: 16px;
  cursor: pointer;
}
</style>