课程中心 问答&分享 读书 注册、登录 关闭菜单
《微信公众号开发权威教程》
目录
第一章 课程介绍及环境部署 课程介绍及环境部署 第二章 开发者模式接入及消息回复 2.1 开发者模式接入 2.2 接收客户消息及openId 2.3 回复文本消息 2.4 回复图文消息 2.5 封装slog函数记录接口信息 第三章 获取接口调用凭据 3.1 基础知识 - curl 3.2 获取access token 3.3 获取微信服务器IP地址 第四章 接收事件推送 4.1 关注/取消关注事件 4.2 上报地理位置事件 第五章 菜单创建及菜单点击事件 5.1 接口形式创建自定义菜单 5.2 自定义菜单点击事件的识别 第六章 微信网页开发 6.1 微信网页授权-微信登录 6.2 微信JS-SDK介绍 6.3 微信JS-SDK部署 6.4 分享接口的实现 6.5 图片接口 6.6 音频接口 第七章 素材管理 7.1 新增临时素材 7.2 获取临时素材 7.3 新增永久素材 7.4 获取素材列表及素材总数 7.5 删除永久素材 第八章 微信盖楼游戏 8.1 盖楼游戏原理 8.2 盖楼游戏源码 第九章 天气查询 9.1 百度免费天气API介绍 9.2 微信公众号天气查询开发
6.3 微信JS-SDK部署

微信JS-SDK部署步骤:


1、编写一个测试页面 demo.php 并在页面底部引入js文件

<html>
<head>
<title>demo</title>
</head>
<body>
    <div style="width:90%;">
        <img src="http://static.hcoder.net/public/course_images/5595e9446293b.jpg" width="100%" />
    </div>
</body>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js" type="text/javascript"></script>
</html>


2、通过config接口注入权限验证配置

下载微信官方提供的演示代码 进行修改,下载地址:

http://demo.open.weixin.qq.com/jssdk/sample.zip

下载后解压,找到对应的php代码包

将 access_token.php、jsapi_ticket.php、jssdk.php 文件拷贝到项目目录下,示例结构:

|_ demo.php
|_ jsapi_ticket.php
|_ access_token.php
|_ jssdk.php


注意事项

保证access_token.php的可写权限!


3、在demo.php中完成权限验证

<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js" type="text/javascript"></script>
<?php
require_once "jssdk.php";
//$jssdk = new JSSDK("appid", "appsecret");
$jssdk = new JSSDK("wxecbdf50f2ffea20f", "eb2e237b0ed8624d4fd87a718ae2285b");
$signPackage = $jssdk->GetSignPackage();
/* 
 * $signPackage
 * 是一个数组 格式如下
 * Array ( [appId] => wxecbdf50f2ffea20f [nonceStr] => 9XvxklnD5tdwIfMF [timestamp] => 1462502279 
 * [url] => http://wx.hcoder.net/demo.php [signature] => xxxx [rawString] => jsapi_ticket=xcxc
 * &noncestr=9XvxklnD5tdwIfMF×tamp=1462502279
 * &url=http://wx.hcoder.net/demo.php )
 */
?>
<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: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', 'onMenuShareQZone']
  });
  wx.ready(function () {
    alert('ok');
  });
</script>



4、验证结果

在微信浏览器中执行 demo.php ,页面弹出ok代表配置成功。


5、调试及错误

wx.config({
    debug: true,//正式发布后建议把值改为false

当 debug 取值为true 系统会自动弹出执行过程的重要信息。


wx.error(function(res){
    alert(res);
});

出现错误时如果我们设置了 error函数,系统会根据error函数的设置去展示错误信息

CopyRight © 2011 - 2016 Hcoder.net 陕ICP备14004669号-2
客服QQ : 1265928288