移动端默认是禁止背景音乐自动播放的,很多需求都需要在页面加载完成的情况下同时出现背景音乐。

既然是微信h5,那么wx.config肯定不陌生,废话不多,直接上代码:

html:
  <audio src="../audio/one.mp3" id="audioPlay"></audio> js:
  wx.config({
  debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来
  appId: data.configMap.appId, // 必填,公众号的唯一标识
   timestamp: data.configMap.timestamp, // 必填,生成签名的时间戳
  nonceStr: data.configMap.nonceStr, // 必填,生成签名的随机串
   signature: data.configMap.signature,// 必填,签名,见附录1
 jsApiList: [
"onMenuShareTimeline",//分享朋友圈接口
"onMenuShareAppMessage"//分享给朋友接口
 ] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
  });
  wx.ready(function(){
    var audio = document.getElementById("audioPlay");
    audio.play()
  })

wx.config配置成功之后执行wx.ready,在ready里让音乐播放就可以达到自动播放的要求,遗憾的是这个方法只能让音乐自动播放,视频还是需要触发才能自动播放...

微信h5,背景音乐自动播放的更多相关文章

  1. 新版微信h5视频自动播放

    微信最近升级了新版本,直播视频不能自动播放,经过了一番探索,发现下列方法可以实现自动播放. if (typeof WeixinJSBridge == "undefined") { ...

  2. 解决 iPhone 微信 H5 无法自动播放音乐问题

    使用 wx sdk 在html导入sdk js文件.(如果网站是https导入的sdk也要使用https!) 然后在 wx.ready 中设置 play 方法并复制给全局变量 fm,当需要使用的时候再 ...

  3. H5背景音乐自动播放(兼容微信IOS,进程后台切换自动停止播放,本文例子为Vue写法)

    <template> <audio src="./static/music.mp3" id="bgMusic" preload="a ...

  4. video 在iphone手机的ios系统和微信端无法自动播放

    描述:video 在iphone手机,微信端无法自动播放,ios系统下不能自动播放视频.而且如果没有autoplay属性,在微信端点击一次,弹不出视频,要一直触着两秒后才可以打开视频.如果点击播放的话 ...

  5. iOS 微信 音频 视频自动播放

    iOS 微信 音频 视频自动播放 http://www.w3ctech.com/topic/1165

  6. 在iOS微信浏览器中自动播放HTML5 audio(音乐)的2种正确方式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. H5的audio在ios系统的微信上不能自动播放的问题

    前几天有个需求,要在H5页面中添加背景音乐,本以为很easy,却也踩了一些坑,废话不多说,进入正题: 撸完代码测试的时候才发现在安卓手机上背景音乐可以正常播放,但在iphone里的微信和safari中 ...

  8. 网页背景H5视频自动播放---PC端、移动端兼容问题完美解决方案(IOS、安卓、微信端)

    最近公司官网需要使用视频当做banner背景且自动播放,并且因为是官网需要做到PC端和移动端都可以适配兼容,这些问题很是头疼: 兵来将挡,水来土掩,进过查阅相关技术资料,现已完美兼容PC端和移动端.下 ...

  9. HTML5中的audio在手机端和 微信端的自动播放

    再做H5页面的时候,发现audio在手机端和微信端添加了autoplay以后还是不可以自动播放,这是因为手机端为了节约流浪所设置的 通常解决方法是给一个交互事件,一定要是交互事件 标签:<aud ...

随机推荐

  1. sqlserverdatasouce控件如何让添加删除修改自动化

    对于sqlserverdatasouce控件,添加插入修改和删除命令,可以自动删除修改更新数据,不需要编写一行代码,但是有时更新失败,原因在于选中了[开放式并发],这个选中,如果该表与其他的数据表关联 ...

  2. linux 线程详解

    线程 是计算机中独立运行的最小单位,运行时占用很少的系统资源.可以把线程看成是操作系统分配CPU时间的基本单元.一个进程可以拥有一个至多个线程.它线程在进程内部共享地址空间.打开的文件描述符等资源.同 ...

  3. 第九次java课堂笔记

  4. 四、Linux的常用命令

    linux常用命令可以参考这位前辈的:https://www.cnblogs.com/gaojun/p/3359355.html 这篇博文介绍的比较详细!

  5. emacs技巧

    Table of Contents "ctrl space"设置mark 同时在选中的各行行首添加相同内容 寄存器 跳转到某行 删除光标所在的空格和TAB或空白行 把TAB全部转换 ...

  6. java基础1(二)

    Bean的xml配置 1.bean的初始化方式 三种方式: 默认构造器,静态工厂初始化(了解)和实例工厂初始化(了解) 2.springbean的作用域 Bean默认作用域是单实例的 可以设置非单实例 ...

  7. LeetCode算法历程-02

    编写一个程序判断给定的数是否为丑数. 丑数就是只包含质因数 2, 3, 5 的正整数. 示例 1: 输入: 6 输出: true 解释: 6 = 2 × 3 示例 2: 输入: 8 输出: true ...

  8. 实训任务05 MapReduce获取成绩表的最高分记录

    实训任务05  MapReduce获取成绩表的最高分记录 实训1:统计用户纺问次数 任务描述: 统计用户在2016年度每个自然日的总访问次数.原始数据文件中提供了用户名称与访问日期.这个任务就是要获取 ...

  9. 关于Linux时间设置的总结

    系统环境:centos Linux的时间有两种,一种是系统时间,一种是硬件时间. 系统时间的查看:#date 系统时间的设置:#date -set 时间同步工具准备 Linux进行时间同步要使用一个工 ...

  10. Python字符串与格式化的一点用法

    #python的基本语法网上已经有很多详细的解释了,写在这里方便自己记忆一些 1.python于C语言不同的是,python没有字符的概念,所谓的字符就是长度为1的字符串,使用切片或者索引同样可以对字 ...