zoukankan      html  css  js  c++  java
  • 微信小程序背景音频播放分享功能

    如果正常背景音频播放的话,只能跳转到自己对应的微信小程序,无法分享朋友圈,我们需要设置分享朋友圈,需要调用一个API

    音频背景播放

    注意:背景播放在锁屏后播放只支持IOS端,安卓端虽然可以播放,但是锁屏不显示,IOS锁屏会显示

    • wxml
    <audio poster="{{poster}}" name="{{name}}" author="{{author}}" src="{{src}}" id="myAudio" controls loop></audio>
    <button type="primary" bindtap="audioPlay">播放</button>
    <button type="primary" bindtap="audioPause">暂停</button>
    <button type="primary" bindtap="audio14">设置当前播放时间为14秒</button>
    <button type="primary" bindtap="audioStart">回到开头</button>
    
    • wxjs
    Page({
      onReady: function (e) {
        // 使用 wx.createAudioContext 获取 audio 上下文 context
        this.audioCtx = wx.createAudioContext('myAudio')
      },
      data: {
        poster: 'http://y.gtimg.cn/music/photo_new/T002R300x300M000003rsKF44GyaSk.jpg?max_age=2592000',
        name: '此时此刻',
        author: '许巍',
        src: 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E06DCBDC9AB7C49FD713D632D313AC4858BACB8DDD29067D3C601481D36E62053BF8DFEAF74C0A5CCFADD6471160CAF3E6A&fromtag=46',
      },
      audioPlay: function () {
        this.audioCtx.play()
      },
      audioPause: function () {
        this.audioCtx.pause()
      },
      audio14: function () {
        this.audioCtx.seek(14)
      },
      audioStart: function () {
        this.audioCtx.seek(0)
      }
    })
    const backgroundAudioManager = wx.getBackgroundAudioManager()
    
    backgroundAudioManager.title = '此时此刻'
    backgroundAudioManager.epname = '此时此刻'
    backgroundAudioManager.singer = '许巍'
    backgroundAudioManager.coverImgUrl = 'http://y.gtimg.cn/music/photo_new/T002R300x300M000003rsKF44GyaSk.jpg?max_age=2592000'
    backgroundAudioManager.src = 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E061FF02C31F716658E5C81F5594D561F2E88B854E81CAAB7806D5E4F103E55D33C16F3FAC506D1AB172DE8600B37E43FAD&fromtag=46' // 设置了 src 之后会自动播放
    

    背景音频播放分享功能

    backgroundAudioManager.webUrl="www.baidu.com"
    只需要加上这个 我们就可以实现背景音频播放分享到朋友圈
    webUrl :页面链接,原生音频播放器中的分享功能,分享出去的卡片简介,也将使用该值。
    
  • 相关阅读:
    记录wordpress+nginx配置的坑
    Nginx进行反向代理多个web项目
    Docker 安装 Zabbix-4
    小特跨境电商ERP 小程序版 库存好帮手
    小特跨境电商ERP 浏览器版 为决策者提供数据支持
    小特跨境电商ERP桌面版 8.如何部署 真的这么难安装吗?
    小特跨境电商ERP桌面版 7.销售订单毛利计算 就是这么简单
    小特跨境电商ERP桌面版 6.运费结算是个大问题?容易一团糟
    小特跨境电商ERP桌面版 5.订单发货提交后,后续还要做什么?
    小特跨境电商ERP桌面版 4.平台商品和本地单品如何映射?
  • 原文地址:https://www.cnblogs.com/luxiaoyao/p/9024163.html
Copyright © 2011-2022 走看看