手机网站的网页进行微信转发时遇到的问题

以前公司往外推送微信信息的时候，都是在后台添加的文本，大家转发起来没有任何问题。最近手机网站上上了几个新活动，用微信转发的时候，问题来了，左下角的小图片没有，应该是文字简介的地方是一条url，实在不雅观。用一些笨笨的方法也能够弥补一下这个问题，比如，把<title>标签中的内容丰满一下，在脚本的开头可以隐藏一张图片，确实标题和图片能够出来，但这终究不是正道，今天就研究了一下微信的这个东东，在网上搜索了一下，还真是找到一个非常棒的类库，用起来效果也很不错。

<?php
class WeixinAction extends Action {
    /**
     * php curl 请求链接
     * 当$post_data为空时使用GET方式发送
     * @param unknown $url
     * @param string $post_data
     * @return mixed
     */
    function curlSend($url,$post_data=""){
        $ch = curl_init();
        curl_setopt($ch, CURLOPT_URL,$url);
        if($post_data != ""){
            curl_setopt($ch,CURLOPT_POST,1);
            curl_setopt($ch,CURLOPT_POSTFIELDS,$post_data);
        }
        curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
        curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        $result = curl_exec($ch);
        curl_close($ch);
        return $result;
    }
    /**
     * 调用接口获取 $ACCESS_TOKEN
     * 微信缓存 7200 秒，这里使用thinkphp的缓存方法
     * @param unknown $APP_ID
     * @param unknown $APP_SECRET
     * @return Ambigous <mixed, Thinkmixed, object>
     */
    function get_accesstoken($APP_ID,$APP_SECRET){
        $ACCESS_TOKEN = S($APP_ID);
        if($ACCESS_TOKEN == false){
            $url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=".$APP_ID."&secret=".$APP_SECRET;
            $json = $this->curlSend($url);
            $data=json_decode($json,true);
            S($APP_ID,$data[access_token],7000);
            $ACCESS_TOKEN = S($APP_ID);
        }
        return $ACCESS_TOKEN;
    }
    /**
     * 微信网页JSSDK?调用接口获取 $jsapi_ticket
     * 微信缓存 7200 秒，这里使用thinkphp的缓存方法
     * @param unknown $ACCESS_TOKEN
     * @return Ambigous <mixed, Thinkmixed, object>
     */
    function get_jsapi_ticket($ACCESS_TOKEN){
        $jsapi_ticket = S($ACCESS_TOKEN);
        if($jsapi_ticket == false){
            $url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=".$ACCESS_TOKEN."&type=jsapi";
            $json = $this->curlSend($url);
            $data = json_decode($json,true);
            S($ACCESS_TOKEN,$data[ticket],7000);
            $jsapi_ticket = S($ACCESS_TOKEN);
        }
        return $jsapi_ticket;
    }
    /**
     * 微信网页JSSDK 获取签名字符串
     * 所有参数名均为小写字符
     * @param unknown $nonceStr 随机字符串
     * @param unknown $timestamp 时间戳
     * @param unknown $jsapi_ticket
     * @param unknown $url 调用JS接口页面的完整URL，不包含#及其后面部分
     */
    function get_js_sdk($APP_ID,$APP_SECRET){
//        echo $APP_ID.‘/‘.$APP_SECRET;
        $protocol = (!empty($_SERVER[HTTPS]) && $_SERVER[HTTPS] !== off || $_SERVER[SERVER_PORT] == 443) ? "https://" : "http://";
        $url = $protocol.$_SERVER[HTTP_HOST].$_SERVER[REQUEST_URI];
        $argu = array();
        $argu[appId] = $APP_ID;
        $argu[url] = $url;
        $argu[nonceStr] = $this->createNonceStr();
        $argu[timestamp] = time();
        $ACCESS_TOKEN = $this->get_accesstoken($APP_ID, $APP_SECRET);
        $argu[jsapi_ticket] = $this->get_jsapi_ticket($ACCESS_TOKEN);
        $string = "jsapi_ticket=".$argu[jsapi_ticket]."&noncestr=".$argu[nonceStr]."&timestamp=".$argu[timestamp]."&url=".$argu[url];
        $argu[signature] = sha1(trim($string));
        return $argu;
    }
    /**
     * 获取随机字符串
     * @param number $length
     * @return string
     */
    function createNonceStr($length = 16) {
        $chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
        $str = "";
        for ($i = 0; $i < $length; $i++) {
            $str .= substr($chars, mt_rand(0, strlen($chars) - 1), 1);
        }
        return $str;
    }
}
?>

使用的时候用R函数带着两个参数，请求get_jsapi_ticket（）方法，两个参数分别是$APP_ID,$APP_SECRET，这两个参数在自己的微信公共平台上可以看到。返回值可以将config中的选项填充起来。

 wx.config({
                debug: false, // 开启调试模式
                appId: ‘{$res.appId}‘, // 必填，公众号的唯一标识
                timestamp: {$res.timestamp}, // 必填，生成签名的时间戳
                nonceStr: ‘{$res.nonceStr}‘, // 必填，生成签名的随机串的
                signature: ‘{$res.signature}‘,// 必填，签名，见附录1
                jsApiList: {$res.jsApiList} // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
        });

jsApiList可以根据自己的需要添加。然后就简单多了，打开微信开发文档吧。

wx.ready(function(){
            wx.onMenuShareAppMessage({
                title: ‘{$res.title}‘,
                desc: ‘{$res.desc}‘,
                link: ‘{$res.link}‘,
                imgUrl: ‘{$res.imgUrl}‘,
                success: function (res) {
                    alert(‘感谢您的分享‘);
                }
            });
            wx.onMenuShareTimeline({
                title: ‘{$res.title}‘, // 分享标题
                link: ‘{$res.link}‘, // 分享链接
                imgUrl: ‘{$res.imgUrl}‘, // 分享图标
                success: function () {
                    // 用户确认分享后执行的回调函数
                    alert(‘感谢您的分享‘);
                },
                cancel: function () {
                    // 用户取消分享后执行的回调函数
                }
            });
        });

这样无论分享给朋友还是分享到朋友圈，就漂亮多了。