微信小程序开发的坑

最近在做微信小程序，知识付费类的，需要播放背景音频。微信版本6.6.5

iOS上播放没有问题，Android上播放出现随机播放不了的情况？早已经排除网上说的 title 没有传值的情况。
解决：后面发现是播放url 里面多了一个 '/', 像这样 https://xxx.com/api//playmedia?id=xxx&name=xxx 这种情况iOS播放没有问题，但Android会随机出现问题。
解决了上面1的问题，又发现播放某个课程下的音频的时候，老是播放不了？
解决：排除小程序代码本身的问题，因为所有音频播放都是同一个函数。后来抓包，发现播放这个音频的时候，调用了2次服务器音频接口，百思不得其解，仔细查看request的header头信息，发现有时候请求会带“ range”参数，所以这个时候需要特别处理。因为是用

/// 方法一
var readstream = fs.createReadStream(filepath);
readstream.pipe(res);

这种形式，所以有“range”参数是需要计算起始位置的：

/// 方法二
var stream = fs.createReadStream(filepath, {
                            "start": range.start,
                            "end": range.end
                        });

stream.pipe(res);

如果不计算，还是使用方法一，就会出现莫名播放不了的情况。

大概是因为小程序有缓存，如果小程序发现有音频下载过部分，它会带“range”参数。

mp3格式导致iOS手机播放不了？
有些mp3的格式是带封面的，这样的格式在iOS上播放不了，Android上可以播放。红色箭头的这种就不行，绿框的才行。

mp3格式问题.jpg

使用开发者工具做远程调试Android手机，经常出现什么第三方sdkxxx错误，导致setStorageSync不成功。开发者工具版本1.02.1802080

开发者工具远程调试错误.jpg
在基础库2.3.0上使用Map组件的enable-scroll功能，禁止地图的拖动。
下面代码无效

<map id="map" enable-scroll="false" longitude="113.324520" latitude="23.099994" scale="14" style="width: 100%; height: 300px;"></map>

下面代码ok

<map id="map" enable-scroll="{{false}}" longitude="113.324520" latitude="23.099994" scale="14" style="width: 100%; height: 300px;"></map>

猜测是微信小程序解析的问题。

因为自己前后端都做，所以找问题还稍微方便点。如果是多人合作，这些诡异的问题估计需要花不少时间

微信小程序开发的坑

推荐阅读更多精彩内容