夺命雷公狗---微信开发54----微信js-sdk接口开发（1）之快速入门

js-sdk基本介绍

除去服务号的九大接口外，微信提供了JS-SDK接口，所谓JS-SDK接口也就是在网页中使用javascript来更改网页设置，

（比如隐藏右上角的菜单）获取用户状态（比如地理位置）甚至调用微信的录音功能上传下载和扫描等功能，

由于需要用到JS代码，因此该接口只能在开发模式下使用。

我们还是照老规矩，先查看手册

JS-SDK快速入门体验案例：

我们来实现一个简单的小功能，通过js-sdk接口，灵活的控制右上角菜单的显示和隐藏

我们先来看看手册：

我们将上一节课的dream.php代码稍微的进行修改一下，代码如下所示：

<?phprequire_once "common.php";//获取code，得到access_token和appid$code = $_GET['code'];//公众号的appid$appid = "wxed89d8f74fa6fc51";//公众号的appsecret$appsecret = 'd4624c36b6795d1d99dcf0547af5443d';$url = "https://api.weixin.qq.com/sns/oauth2/access_token?appid={$appid}&secret={$appsecret}&code={$code}&grant_type=authorization_code";$res = http_request($url,null);//json解码$res = json_decode($res);//获取openid和access_token$openid = $res->openid;$access_token = $res->access_token;//这里是请求过去拉取用户信息这和基本接口的获取是不一样的，详情可以参考手册上的第四步$url = "https://api.weixin.qq.com/sns/userinfo?access_token={$access_token}&openid={$openid}";$res = http_request($url,null);//他是通过json返回用户的基本信息的$res = json_decode($res);$nickname = $res->nickname;  //用户昵称$headimgurl = $res->headimgurl; //用户头像//因为他放回http://wx.qlogo.cn/mmopen/g3MonUZtNHkdmzicIlibx6iaFqAc56vxLSUfpb6n5WKSYVY0ChQKkiaJSgQ1dZuTOgvLLrhJbERQQ4eMsv84eavHiaiceqxibJxCfHe/46//所以要处理以下后面的46$small_head_imgurl = substr($headimgurl,0,-1).'132'; //小头像的地址//通过access_token和openid获取该用户的详细信息
?>
<!doctype html>
<html> <head> <meta charset="utf-8"> <title>世界留言板</title> <meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0, maximum-scale=1.0,user-scalable=no;"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="format-detection" content="telephone=no"> <link href="./jquery.mobile-1.0.min.css" rel="stylesheet" type="text/css"> <script src="./jquery-1.6.4.min.js" type="text/javascript"></script> <script src="./jquery.mobile-1.0.min.js" type="text/javascript"></script> <!--加入JS-SDK的代码--><script>//加一个监听事件来调用js-sdk接口
            document.addEventListener('WeixinJSBridgeReady',function onBridgeReady(){WeixinJSBridge.call('hideOptionMenu'); //意思是调用这个函数去隐藏菜单
                });//通过函数来直接调用function test1(){WeixinJSBridge.call('hideOptionMenu'); //意思是隐藏右上角菜单
                alert('成功关闭右上角菜单');}function test2(){WeixinJSBridge.call('showOptionMenu');  //意思是显示右上角的菜单嘛
                alert("成功显示右上角菜单");}//使用jquery的绑定方式来进行调用js-sdk接口
            $(document).ready(function(){$('#test3').click(function(){WeixinJSBridge.call('hideOptionMenu');alert('成功关闭右上角菜单');});});$(document).ready(function(){$('#test4').click(function(){WeixinJSBridge.call('showOptionMenu');alert('成功显示右上角菜单');});});</script></head> <body> <div data-role="page" id="page3"> <div data-role="header"> <h1>世界留言板</h1> </div> <div data-role="content"> <form action="post_dream.php" method="post" data-ajax="false" > <div data-role="fieldcontain"> <label for="textarea"><?php echo $nickname; ?>, 请说出您对世界心声:</label> <textarea cols="40" rows="8" name="textarea" id="textarea"></textarea> </div> <!--通过隐藏表单发送我们会用到的参数--><input type="hidden" name="openid" value="<?php echo $openid; ?>" /><input type="hidden" name="nickname" value="<?php echo $nickname; ?>" /><input type="hidden" name="small_head_imgurl" value="<?php echo $small_head_imgurl; ?>" /><div class="ui-grid-a"> <div class="ui-block-a"> <button type="submit" data-role="button" >提交心声</button> </div> <div class="ui-block-b"> <button type="reset" data-role="button">重输心声</button> </div> </div> </form><div class="ui-block-a"> <button onclick="test1()" data-role="button" >关闭右上角</button> </div><div class="ui-block-a"> <button onclick="test2()" data-role="button" >显示右上角</button> </div><!--通过id来调用js-sdk--><div class="ui-block-a"> <button id="test3" data-role="button" >JQ关闭右上角</button> </div><div class="ui-block-a"> <button id="test4" data-role="button" >JQ显示右上角</button> </div></div> </div> </body>
</html>

我们这节课主要用了2个js-sdk的接口

1...hideOptionMenu-----------------（隐藏右上角菜单）

2...showOptionMenu----------------（显示右上角菜单）

转载于:https://www.cnblogs.com/leigood/p/5257508.html

夺命雷公狗---微信开发54----微信js-sdk接口开发（1）之快速入门相关推荐

夺命雷公狗---微信开发39----微信语言识别接口1
语音识别接口的基本介绍注意: 由于客户端缓存,开发者开启或者关闭语音识别功能,对新关注者立即生效,对已关注用户需要24小时生效,开发者可以从新关注帐号进行测试. 我们可以在测试号下方的体验接口权限表 ...
夺命雷公狗---微信开发26----客服消息接口基础和推送视频
我们按照上一课的套路继续改写下index.php即可实现,代码如下所示: <?php /*** wechat php test*///define your token require_once ...
夺命雷公狗-----React---5--props对象的传递
提示:props的值是不可以改变的... <!DOCTYPE html> <html lang="en"> <head><meta cha ...
夺命雷公狗TP3.2.3商城2-----后台模版引入和后台控制器的创建
首先我们来到D:\phpStudy\WWW\shop\WEB 目录下,将Home目录进行复制一份,并且改名为Admin,如下所示: 然后将我们准备好的后台首页模版放入 D:\phpStudy\W ...
夺命雷公狗ThinkPHP项目之----商城1项目整体架构
夺命雷公狗项目之---商城本人准备更新套基于tp下开发的商城的项目,为啥呢?原因和简单,本人没使用过框架开发商城,准备用一些时间来开发套B2C的商城系统.. 项目规划: 1:项目整体架构用户部分 ...
夺命雷公狗ThinkPHP项目之----商城10商品属性管理
我们一般做项目前就要分析业务逻辑先,这次也不例外. attr_type:是指属性的类型,有唯一,单选和多选之分唯一属性,是指用户在购买商品时,可以看到的扩展属性如下图所示: 单选属性,是指用户在购买 ...
夺命雷公狗之后台登录一条龙模版
今天用bootstrap开发了套后台登录和管理后台管理的模版,有需要的朋友可以拿去用用. 或者可以@夺命雷公狗进行技术交流.... 下载地址: http://pan.baidu.com/s/1kVff ...
个人号微信淘宝客机器人SDK定制开发教程
个人号微信淘宝客机器人SDK定制开发教程,来自秋天不穿秋裤,天冷也要风度的程序猿之手,必属精品! 今天给大家介绍微信个人号自动回复机器人的开发教程!使用微信机器人托管微信,可以避免不及时回复错过的消息 ...
做微信h5支付的统一下单接口开发，虽然已经生成了mweb_url支付链接，但是访问时出现错误提示：‘商家参数格式有误，请联系商家解决’，但是检查h5支付提交的参数，都没有错误。微信h5支付开发错误
做微信h5支付的统一下单接口开发,虽然已经生成了mweb_url支付链接,但是访问时出现错误提示:'商家参数格式有误,请联系商家解决',但是检查h5支付提交的参数,都没有错误. 后面看到官方文档, 说 ...
PHP支付宝微信个人免签即时到帐接口开发实例
PHP支付宝微信个人免签即时到帐接口开发实例,使用原生支付宝即时到帐接口修改而来,即可实现多接口收款功能,开发只需要按照支付宝即时到帐接口开发即可,减少开发难度需要修改的文件:notify_url. ...

夺命雷公狗---微信开发54----微信js-sdk接口开发（1）之快速入门

夺命雷公狗---微信开发54----微信js-sdk接口开发（1）之快速入门相关推荐

最新文章

热门文章