微信公众号开发之坑（一）

有个说法是微信浏览器==移动端IE6。分享一下开发中遇到的坑

1.在自己的公众号能实现支付，从别的公众号进来不能支付。

既然自己的公众号能支付了，那么很有可能是跳转过来的公众号的url出现的问题。
正确的：htt P://3w.yijia.com/wechat/pay/？id=1
错误的：htt P://3w.yijia.com/wechat/pay？id=1 参数（也就是问号之前）要以/结尾，因为这是公众号支付配置的要求。

2.微信api上传图片，在苹果和安卓系统下的小区别。问题描述：要上传多张图片。在安卓手机上传成功；在苹果手机那里只能上传成功最后一张。

解决方法：苹果使用递归函数上传。

3.iframe 中如果有输入框，在苹果手机下弹出软键盘时，会导致宽度无法适配

代码：

        $(window).resize(function () { 
            $(‘iframe‘).css("width",$(window).width());
        });

并在iframe上增加属性

<iframe frameborder=0 scrolling="no"></iframe>

4.绝对定位的元素被键盘顶起来。

解决方式：https://segmentfault.com/a/11...
如果使用一些时间插件，地址选择插件，是从底部弹起来的又要绝对定位的。又要设计input的。建议改为从屏幕中间弹出。

5.音频无法自动播放

 //一般情况下，这样就可以自动播放了，但是一些奇葩iPhone机不可以
 document.getElementById(‘car_audio‘).play();
//必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效
document.addEventListener("WeixinJSBridgeReady", function () {
    document.getElementById(‘audio‘).play();
    document.getElementById(‘video‘).play();
}, false);

6.vue2.0路由(react不知道)采用history 在IOS中模式无法识别二维码

这个我这的服，一直没找到解决方法，后来改用哈希路由。

7.输入框在IOS中设置只读readonly="readonly" 时，点击扔出现光标。

$(‘input[readonly]‘).on(‘focus‘, function() {
            $(this).trigger(‘blur‘);
});

8.微信缓存。

手动清理http://debugx5.qq.com 手机打开拉到最后，把4个选上。
本文仅提供php代码,js的自行查找。因为考虑到js是在css加载完成之后才执行的。所以要把动态生成随机数或时间戳的js放到适当的位置。比如你的css是放在head标签里面的。但是你的css是不想被缓存的，要在url后面生成一些动态信息，那么在引入该css的下面就要紧接着js代码。

<link rel="stylesheet" href="/modules/wechatmp/statics/css/1111.css?v=<?php echo time(); ?> " />
<script class=‘math‘ src="/modules/wechatmp/statics/js/11111.js?ver=<?php echo time(); ?> "></script>

9.微信分享链接不支持

微信分享接口不支持hash传递。

带有hash的url分享朋友圈的时候，跳转信息中不包含hash信息。例如：

view/guide/home.php#share/service/detail/

只能得到：

view/guide/home.php

建议：分享的时候不要带hash信息。如果一定要带附加信息，可以转为：

view/guide/home.php?share/service/detail/。

在做单页面应用的时候，如果要分享当前页面的动态数据，要把参数拼接到url后面。页面之间使用路由传参，并用get请求。