10天学会phpWeChat——第十天:phpWeChat的会员注册、登录以及微信网页开发

通过前面的系列教程,我们系统的讲解了phpWeChat从视图端、控制器端到模型端的操作流程;熟悉了phpWeChat的目录结构;掌握了视图端模板如何创建一个丰富的表单和模型端如何操作数据库。这一切都是传统Web以及现代H5开发的核心。

我们今天进行《10天学会phpWeChat》教程的最后一讲,phpWeChat的微信网页开发。在这一讲里,我们将重点讲解在微信网页开发中几个常见参数的获取和一个微信扫一扫的实例。

一、微信网页开发中的几个重要参数(文档参考:https://mp.weixin.qq.com/wiki

如果您熟读过微信官方的公众号开发文档,您应该会清楚,在微信网页开发中,有几个参数是常见且重要的。

1、access_token:微信网页授权是通过OAuth2.0机制实现的,在用户授权给公众号后,公众号可以获取到一个网页授权特有的接口调用凭证(网页授权access_token),通过网页授权access_token可以进行授权后接口调用,如获取用户基本信息,phpWeChat框架默认集成了access_token的获取,您无需自己写代码或者关心其他,只需在需要使用access_token的地方使用PHP常量WECHAT_ACCESS_TOKEN即可获取。

实例:

<?php
    //自适应模块的PC前端控制器
    use wechat\hello\hello;
    use phpWeChat\Area;
    use phpWeChat\CaChe;
    use phpWeChat\Config;
    use phpWeChat\Member;
    use phpWeChat\Module;
    use phpWeChat\MySql;
    use phpWeChat\Order;
    use phpWeChat\Upload;

    !defined(‘IN_APP‘) && exit(‘Access Denied!‘);

    switch($action)
    {
        case ‘index‘:
            echo WECHAT_ACCESS_TOKEN;

            exit();
            break;

        default:
            break;
    }
?>

效果(请在微信web开发者工具里进行打开URL):

2、openid:openid是用户针对某个公众号的一个唯一身份标识。在关注者与公众号产生消息交互后,公众号可获得关注者的OpenID(加密后的微信号,每个用户对每个公众号的OpenID是唯一的。对于不同公众号,同一用户的openid不同)。公众号可通过本接口来根据OpenID获取用户基本信息,包括昵称、头像、性别、所在城市、语言和关注时间。phpWeChat框架默认集成了OpenID的获取,您无需自己写代码或者关心其他,只需在需要使用OpenID的地方使用WeChat::getOpenID()即可获取。

由于phpWeChat使用了命名空间,所以请在需要获取openid的文件头部加上

use WeChat\WeChat;

示例:

<?php
    //自适应模块的PC前端控制器
    use wechat\hello\hello;
    use phpWeChat\Area;
    use phpWeChat\CaChe;
    use phpWeChat\Config;
    use phpWeChat\Member;
    use phpWeChat\Module;
    use phpWeChat\MySql;
    use phpWeChat\Order;
    use phpWeChat\Upload;
    use WeChat\WeChat;

    !defined(‘IN_APP‘) && exit(‘Access Denied!‘);

    switch($action)
    {
        case ‘index‘:
            echo WeChat::getOpenID();

            exit();
            break;

        default:
            break;
    }
?>

效果:

3、jsapi_ticket:jsapi_ticket是公众号用于调用微信JS接口的临时票据。正常情况下,jsapi_ticket的有效期为7200秒,通过access_token来获取。phpWeChat框架默认集成了jsapi_ticket的获取,您无需自己写代码或者关心其他,只需在需要使用jsapi_ticket的地方使用PHP常量WECHAT_JSAPI_TICKET即可获取。

示例同获取access_token,不再赘述。

4、微信JS-SDK几个常用参数的生成

所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用(详见微信官方文档:https://mp.weixin.qq.com/wiki?action=doc&id=mp1421141115&t=0.701470327053836)。

1 wx.config({
2 debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
3 appId: ‘‘, // 必填,公众号的唯一标识
4 timestamp: , // 必填,生成签名的时间戳
5 nonceStr: ‘‘, // 必填,生成签名的随机串
6 signature: ‘‘,// 必填,签名,见附录1
7 jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
8 });

以下代码提供了以上几个参数的生成方法,并赋给了一个数组。

 1 <?php
 2 //jsapipara
 3 $jsapipara=array();
 4
 5 $jsapipara[‘appid‘]=WECHAT_APPID;
 6 $jsapipara[‘noncestr‘]=create_rand(16);
 7 $jsapipara[‘timestamp‘]=CLIENT_TIME;
 8
 9 $str=array();
10
11 $str[0]=‘noncestr=‘.$jsapipara[‘noncestr‘];
12 $str[1]=‘jsapi_ticket=‘.WECHAT_JSAPI_TICKET;
13 $str[2]=‘timestamp=‘.$jsapipara[‘timestamp‘];
14 $str[3]=‘url=‘.format_url(get_current_url());
15
16 sort($str, SORT_STRING);
17
18 $jsapipara[‘signature‘]=sha1(implode(‘&‘,$str));
19
20 print_r($jsapipara);
21 ?>

以上代码生成了一个$jsapipara一维数组,其键值对应jssdk对应的config的几个参数。

二、微信公众号端用户的注册登录和自动登录

1、在phpWeChat的系统里,默认集成了用户登录、注册、找回密码的操作。访问地址分别如下:

会员登录:http://www.example.com/index.php?m=member&a=login

会员注册:http://www.example.com/index.php?m=member&a=register

找回密码:http://www.example.com/index.php?m=member&a=getpwd

在用户登录后,系统会自动生成一个变量$_userid和$PW[‘memberlogin‘],这两个变量分别的意思是:

$_userid:未登录状态下,该变量永远为0,登录状态下,该变量的值为用户的会员ID(pw_member表的userid字段);

我们常用判断$_userid是否为0来判断当前用户是否处于登录状态。

$PW[‘memberlogin‘]:未登录状态下,该变量为一个空数组,登录状态下,改变量则存储了登录用户的全部信息(如登录事件,注册事件,头像等);

2、如果不借助于公众号,我们无论在PC端还是在公众号端,都需要用访问以上地址的方法来进行注册、登录。但是在借助公众号的openid的情况下,我们可以通过以下代码实现用户的自动登录:

 1 <?php
 2     //自适应模块的PC前端控制器
 3     use wechat\hello\hello;
 4     use phpWeChat\Area;
 5     use phpWeChat\CaChe;
 6     use phpWeChat\Config;
 7     use phpWeChat\Member;
 8     use phpWeChat\Module;
 9     use phpWeChat\MySql;
10     use phpWeChat\Order;
11     use phpWeChat\Upload;
12     use WeChat\WeChat;
13
14     !defined(‘IN_APP‘) && exit(‘Access Denied!‘);
15
16     /********* H5公众号端自动登录代码开始 **********/
17     if(!$_SESSION[‘openid‘])
18     {
19         $_SESSION[‘openid‘]=WeChat::getOpenID();
20     }
21
22     Member::createRandAccount();//这个方法是自动创建会员ID
23     /********* H5公众号端自动登录代码结束 **********/
24
25     switch($action)
26     {
27         case ‘test‘:
28             echo $_userid;
29
30             exit();
31             break;
32
33         default:
34             break;
35     }
36 ?>

访问后输出了11(自动为我创建的会员ID),在这个过程里,我没有进行任何注册的操作,系统便通过示例中的代码完成了自动注册、自动登录的2个连续操作。

小贴士:您可以熟记这个自动登录代码,因为它很实用。

此时打印$PW[‘memberlogin‘],也输出了包含我信息的数组。

 1 <?php
 2     //自适应模块的PC前端控制器
 3     use wechat\hello\hello;
 4     use phpWeChat\Area;
 5     use phpWeChat\CaChe;
 6     use phpWeChat\Config;
 7     use phpWeChat\Member;
 8     use phpWeChat\Module;
 9     use phpWeChat\MySql;
10     use phpWeChat\Order;
11     use phpWeChat\Upload;
12     use WeChat\WeChat;
13
14     !defined(‘IN_APP‘) && exit(‘Access Denied!‘);
15
16     /********* H5公众号端自动登录代码开始 **********/
17     if(!$_SESSION[‘openid‘])
18     {
19         $_SESSION[‘openid‘]=WeChat::getOpenID();
20     }
21
22     Member::createRandAccount();//这个方法是自动创建会员ID
23     /********* H5公众号端自动登录代码结束 **********/
24
25     switch($action)
26     {
27         case ‘test‘:
28             echo $_userid;
29             print_r($PW[‘memberlogin‘]);
30             exit();
31             break;
32
33         default:
34             break;
35     }
36 ?>

我们可以把当前登录的信息传给模板视图文件,例如将头像传给会员中心的<img>标签。

三、示例:通过jssdk调用微信扫一扫接口

1、我们首先在控制器端获取jssdk所需的参数

 1 <?php
 2     //自适应模块的PC前端控制器
 3     use wechat\hello\hello;
 4     use phpWeChat\Area;
 5     use phpWeChat\CaChe;
 6     use phpWeChat\Config;
 7     use phpWeChat\Member;
 8     use phpWeChat\Module;
 9     use phpWeChat\MySql;
10     use phpWeChat\Order;
11     use phpWeChat\Upload;
12     use WeChat\WeChat;
13
14     !defined(‘IN_APP‘) && exit(‘Access Denied!‘);
15
16     /********* H5公众号端自动登录代码开始 **********/
17     if(!$_SESSION[‘openid‘])
18     {
19         $_SESSION[‘openid‘]=WeChat::getOpenID();
20     }
21
22     Member::createRandAccount();//这个方法是自动创建会员ID
23     /********* H5公众号端自动登录代码结束 **********/
24
25     switch($action)
26     {
27         case ‘test‘:
28             //jsapipara
29             $jsapipara=array();
30
31             $jsapipara[‘appid‘]=WECHAT_APPID;
32             $jsapipara[‘noncestr‘]=create_rand(16);
33             $jsapipara[‘timestamp‘]=CLIENT_TIME;
34
35             $str=array();
36
37             $str[0]=‘noncestr=‘.$jsapipara[‘noncestr‘];
38             $str[1]=‘jsapi_ticket=‘.WECHAT_JSAPI_TICKET;
39             $str[2]=‘timestamp=‘.$jsapipara[‘timestamp‘];
40             $str[3]=‘url=‘.format_url(get_current_url());
41
42             sort($str, SORT_STRING);
43
44             $jsapipara[‘signature‘]=sha1(implode(‘&‘,$str));
45             break;
46
47         default:
48             break;
49     }
50 ?>

2、我们在视图端发起调用

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5 <script language="javascript" type="text/javascript">
 6    var PW_PATH=‘{__PW_PATH__}‘;
 7 </script>
 8 <script src="{__PW_PATH__}statics/jquery/jquery-1.12.2.min.js" language="javascript"></script>
 9 <script src="{__PW_PATH__}statics/core.js" language="javascript"></script>
10 <title>jssdk示例</title>
11 </head>
12
13 <body>
14 <input type="button" value="点我发起扫一扫" id="saoyisao" />
15 <script language="javascript" src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
16 <script>
17     wx.config({
18       debug: false,
19       appId: ‘{$jsapipara[‘appid‘]}‘,
20       timestamp: {$jsapipara[‘timestamp‘]},
21       nonceStr: ‘{$jsapipara[‘noncestr‘]}‘,
22       signature: ‘{$jsapipara[‘signature‘]}‘,
23       jsApiList: [
24         ‘checkJsApi‘,
25         ‘onMenuShareTimeline‘,
26         ‘onMenuShareAppMessage‘,
27         ‘onMenuShareQQ‘,
28         ‘onMenuShareWeibo‘,
29         ‘onMenuShareQZone‘,
30         ‘hideMenuItems‘,
31         ‘showMenuItems‘,
32         ‘hideAllNonBaseMenuItem‘,
33         ‘showAllNonBaseMenuItem‘,
34         ‘translateVoice‘,
35         ‘startRecord‘,
36         ‘stopRecord‘,
37         ‘onVoiceRecordEnd‘,
38         ‘playVoice‘,
39         ‘onVoicePlayEnd‘,
40         ‘pauseVoice‘,
41         ‘stopVoice‘,
42         ‘uploadVoice‘,
43         ‘downloadVoice‘,
44         ‘chooseImage‘,
45         ‘previewImage‘,
46         ‘uploadImage‘,
47         ‘downloadImage‘,
48         ‘getNetworkType‘,
49         ‘openLocation‘,
50         ‘getLocation‘,
51         ‘hideOptionMenu‘,
52         ‘showOptionMenu‘,
53         ‘closeWindow‘,
54         ‘scanQRCode‘,
55         ‘chooseWXPay‘,
56         ‘openProductSpecificView‘,
57         ‘addCard‘,
58         ‘chooseCard‘,
59         ‘openCard‘
60       ]
61     });
62 </script>
63 <script language="javascript">
64     $(document).ready(function(){
65         $(‘#saoyisao‘).click(function(){
66             wx.scanQRCode({
67                 needResult: 1, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果,
68                 scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码,默认二者都有
69                 success: function (res) {
70                 var result = res.resultStr; // 当needResult 为 1 时,扫码返回的结果
71                 alert(result);
72             }
73             });
74         });
75     });
76 </script>
77 </body>
78 </html>

效果:

点按钮则触发了微信扫一扫操作:

至此,《10天学会phpWeChat》系列教程就讲完了,相信您对phpWeChat以及对PC网站开发、微信公众号开发都有了更清晰的认识。我在后续也将继续发布一些跟phpWeChat开发相关的教程,更加深入、细致的讲解一些功能点。

感谢您花时间来阅读我这10篇语句并不通顺的博文,也期待您在未来对phpWeChat和本博客继续关注。

毕业了,同学们。我们工作中见。

时间: 2024-08-02 07:03:28

10天学会phpWeChat——第十天:phpWeChat的会员注册、登录以及微信网页开发的相关文章

10天学会phpWeChat——第八天:Form类,丰富表单提交的字段类型

通过前面七讲的系列教程,我们完成了一个包含后台并自适应PC+h5移动端的文章管理模块. 在实际的生产环境中,文章投稿.商品上传等操作并不会简单局限于一个text和textarea组成的表单.在实际中,我们可能会用到web富文本编辑器(如ueditor.markdown).图片上传.多图上传.附件上传.地图标注等更加丰富的表单类型. 今天,我们开始<10天学会phpWeChat>的第八讲:Form类,丰富表单提交的字段类型. 一.什么是Form类? Form类是phpWeChat封装好的一个类,

10天学会phpWeChat——第二天:hello world!我的第一个功能模块

今天我们开始进入<10天学会phpWeChat>系列教程的第二天:创建我的第一个hello world! 功能模块. 1.登录后台,进入 系统设置--自定义模块,如图: 自定义模块参数说明: 上级模块:上级模块一共三个选项:会员member (一般很少会在其下面建立模块).pc电脑端(建立Pc访问的官网.单页.商城模块等).wechat微信公共号端(建立微信公共号端访问的微官网.微资讯.微商城等) 这里我们可以根据实际需求选择,此处示例我们选择wechat. 模块名称:模块的中文名称,命名没特

10天学会phpWeChat——第五天:实现新闻投稿功能

在前几讲里,我们逐渐实现了自己小模块的新闻列表展示.新闻详情展示功能,现在您已经初步有能力开发一个phpWeChat小模块了,本文将在已开发的hello world模块基础上,增加一个新的功能--新闻投稿. 今天我们进入<10天学会phpWeChat>系列教程的第五天:实现新闻投稿功能,通过今天的学习,希望大家对phpWeChat的表单提交.数据入库有个清晰的认识. 我们定义,投稿的链接为:http://www.example.com/index.php?m=hello&a=touga

10天学会phpWeChat——第三天:从数据库读取数据到视图

在第二天,我们创建了我们的第一个phpWeChat功能模块,但是比较简单.实际生产环境中,我们不可能有如此简单的需求.更多的情况是数据存储在MySql数据库中,我们开发功能模块的作用就是将这些数据从MySql读取并通过视图多样化的呈现给用户. 今天我们进入<10天学会phpWeChat>系列教程的第三天:从数据库读取数据到视图. 一.首先,我们创建一个MySql数据文章表(pw_wechat_hello_article)用来存储要显示给用户的数据. 为了简单明了,这个表我们只保留3个字段: I

10天学会phpWeChat——第九天:数据库增、删、改、查(CRUD)操作

数据库的操作(CRUD)是一个现代化计算机软件的核心,尤其针对web应用软件.虽然在前面的几讲里,我们针对数据库操作大致有了一些了解,但今天我们需要再次强化下. 除了新瓶装老酒,我们今天还引入一个新的数据库操作方法:连贯操作. 今天讲解的内容是基于phpWeChat核心框架1.1.3版本, 下载地址:http://s.phpwechat.com/app_38026ed22fc1a91d92b5d2ef93540f20 框架更新:http://bbs.phpwechat.com/forum-2-1

学会破解要十招

下面谈到了一些在学习解密过程中经常遇到的问题,本人根据自己的经验简单给大家谈一谈.这些问题对于初学者来 说常常是很需要搞明白的,根据我自己的学习经历,如果你直接照着很多破解教程去学习的话,多半都会把自己搞得满头的雾水,因为有很多的概念要么自己不是很 清楚,要么根本就不知道是怎么一回事,所以希望通过下面的讨论给大家一定的帮助: 1. 断点:所谓断点就是程序被中断的地方,这个词对于解密者来说是再熟悉不过了.那么什么又是中断呢?中断就是由于有特殊事件(中断事件)发生,计算机暂停当 前的任务(即程序),

10分钟学会基于ASP.NET的 JQuery实例 (转)

本文介绍如何在ASP.NET(ASP.NET/AJAX)里使用基于JQuery的AJAX技术.(源代码下载见最后) 在使用JQuery前,请到www.jquery.com下载最新版本的js代码,然后再代码里使用 <script src="_scripts/jQuery-1.2.6.js" type="text/javascript"></script>即可,当然,由于微软已经把JQuery集成到VS里,所以你可以到WWW.ASP.NET/aj

10. 蛤蟆的数据结构进阶十排序相关概念

10. 蛤蟆的数据结构进阶十排序相关概念 本篇名言:"生,亦我所欲也:义,亦我所欲也:二者不可得兼,舍生而取义者也.--孟轲" 接下去我们将来看下排序相关的知识. 欢迎转载,转载请标明出处:http://blog.csdn.net/notbaron/article/details/47381339 1.  排序 排序是什么? 将一组杂乱无章的记录按一定规律顺序排列起来. 什么排序方法是稳定的?什么是不稳定的? 假定在待排序的记录序列中,存在多个具有相同的关键字的记录,若经过排序,这些记

10分钟学会Linux

10分钟学会Linux有点夸张,但是可以让一个新手初步熟悉Linux中最重要最基本的知识,本文翻译的英文网页在众多Linux入门学习的资料中还是非常不错的. 英文地址:http://freeengineer.org/learnUNIXin10minutes.html 中文译文如下: 前言  这是我已经在过去的几年中给学生(CAD用户培训)培训中所使用的材料. 其目的是在一个页面上就可以使用 UNIX的shell的基础命令.(这样他们就没有打电话问我了). 本文档受版权保护,但根据GFDL的条款自