tp3.2微信sdk改tp5例子配置步骤

知兮丶青微信

阅读(728) 2018-03-07

之前发过一篇文章《tp5微信sdk之小改麦当苗儿的tp3.2微信sdk》，可能对部分刚刚接触微信开发的新手不知道怎么操作，可能是对《微信开发文档》和《tp5.0开发文档》没看完或没理解到位。

下面续《tp5微信sdk之小改麦当苗儿的tp3.2微信sdk》这篇文章，展开图文并茂的从无到有的开发及配置步骤：

下面与【麦当苗儿的github下载tp3.2微信sdk（更新时间2015年8月4日）】和【以ThinkPHP5.0.15完整版】为例

第一步：下载tp5.0

下载最新ThinkPHP5.0.15完整版：

http://www.thinkphp.cn/down/1125.html

第二步：运行tp5.0

解压到本地 php 环境下，例如：我的wampserver2.5

配置httpd-vhosts.conf：C:/XQ/wamp/bin/apache/apache2.4.9/conf/extra/httpd-vhosts.conf

<VirtualHost *:80>
    DocumentRoot "C:/XQ/wamp/www/tp5/public"
    ErrorLog "logs/error.log"
    CustomLog "logs/tp5.log" common
</VirtualHost>

这样，可以正常使用tp5了。如：http://localhost

部署运行tp5.0.png

配置运行tp5.png

第三步：按照文章修改

按照文章《tp5微信sdk之小改麦当苗儿的tp3.2微信sdk》开发

测试控制器：

<?php
namespace app\index\controller;

use com\Wechat;
use com\WechatAuth;
use think\Controller;
use think\Exception;
use think\Log;

class Index extends Controller {

    //默认首页
    public function index(){

        return '<style type="text/css">*{ padding: 0; margin: 0; } .think_default_text{ padding: 4px 48px;} a{color:#2E5CD5;cursor: pointer;text-decoration: none} a:hover{text-decoration:underline; } body{ background: #fff; font-family: "Century Gothic","Microsoft yahei"; color: #333;font-size:18px} h1{ font-size: 100px; font-weight: normal; margin-bottom: 12px; } p{ line-height: 1.6em; font-size: 42px }</style><div style="padding: 24px 48px;"> <h1>:)</h1><p> ThinkPHP V5<br/><span style="font-size:30px">十年磨一剑 - 为API开发设计的高性能框架</span></p><span style="font-size:22px;">[ V5.0 版本由 <a href="http://www.qiniu.com" target="qiniu">七牛云</a> 独家赞助发布 ]</span></div><script type="text/Javascript" src="https://tajs.qq.com/stats?sId=9347272" charset="UTF-8"></script><script type="text/Javascript" src="https://e.topthink.com/Public/static/client.js"></script><think id="ad_bd568ce7058a1091"></think>';
    }

    //微信入口
    public function wx() {
        try{
            $wechat = new Wechat();
            $data = $wechat->request();
            if($data && is_array($data)) {

                switch ($data['MsgType']) {
                    case Wechat::MSG_TYPE_EVENT: //事件消息
                        switch ($data['Event']) {
                            case Wechat::MSG_EVENT_SUBSCRIBE: //关注
                                $wechat->replyText('欢迎您关注！');
                                break;
                            case Wechat::MSG_EVENT_UNSUBSCRIBE: //取消关注
                                break;
                            default:
                                break;
                        }
                        break;
                    case Wechat::MSG_TYPE_TEXT: //文本消息
                        $wechat->replyText('欢迎您关注，这是文本回复的内容！');
                        break;
                    case Wechat::MSG_TYPE_IMAGE: //图片消息
                        $wechat->replyText("这是一张图片");
                        break;
                    default:
                        break;
                }

            }
        } catch(Exception $e){
            Log::error($e->getMessage());
        }
    }

    //演示页面调用网页授权
    public function view(){
        //检查授权
        $user_info = $this->checkAuth();
        //用户信息
        $this->assign("info", $user_info);

        $auth = new WechatAuth();
        //获取JS-SDK的页面必须先注入配置信息
        $signPackage = $auth->getSignPackage();
        $this->assign("signPackage", $signPackage);
        return $this->fetch();
    }

    //简单写个验证授权
    //实际这里按业务来确定是否来源微信、请求方法类型、数据库处理等判断和操作
    private function checkAuth(){
        $user_info = session('user_info');
        if(!empty($user_info)){
            return $user_info;
        }
        $auth = new WechatAuth();
        //如果code为空
        if(empty(input('get.code'))){
            //跳转至授权
            $url = $auth->getRequestCodeURL(request()->url(true));
            $this->redirect($url);
        }
        //根据code换取网页授权access_token和获取用户信息
        $user_info = $auth->getAuthUserInfo();
        session("user_info", $user_info);
        return $user_info;
    }

}

view.html

<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8">
        <title>test</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    </head>
    <body>

    <!-- 输出用户信息 -->
    <!--{:var_dump($info)}-->

 <img src="{$info['headimgurl']}" alt="" width="64px" />
    <p>{$info['nickname']}</p>


    <script>
        wx.config({
            debug: true,
            appId: '<?php echo $signPackage["appId"];?>',
            timestamp: '<?php echo $signPackage["timestamp"];?>',
            nonceStr: '<?php echo $signPackage["nonceStr"];?>',
            signature: '<?php echo $signPackage["signature"];?>',
            jsApiList: [
                // 所有要调用的 API 都要加到这个列表中
 'getLocation'
 ]
        });

        wx.ready(function () {
            // 在这里调用 API

            //定位测试
 wx.getLocation({
                type: 'wgs84', // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'
 success: function (res) {
                    var latitude = res.latitude; // 纬度，浮点数，范围为90 ~ -90
 var longitude = res.longitude; // 经度，浮点数，范围为180 ~ -180。
 var speed = res.speed; // 速度，以米/每秒计
 var accuracy = res.accuracy; // 位置精度
 }
            });
        });
    </script>

</body>
</html>

第四步：配置项目

修改完之后，为了方便测试和开发，使用微信测试公众号来操作。

1、登录进入你自己的微信测试公众号。微信公众平台接口测试账号：http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login

2、获取测试号中的 appID 和 appsecret 填入配置。

3、token 你自定义一个。

4、key 用于加密，不用理，因为测试公众号无需配置。

配置项目config.php

'wechat' => [
'appid' => 'wx25c716edaef*****',
'appsecret' => '04b6fc04520d3fff38a161b435f*****',
'token' => 'f8eeb52b67fff74c19d1b2a2cb*****',
'key' => 'EgYE5EYFheuSdVMurQC7Fd62C6uSAhAtnagkddg2e9K'
]