个人中心
gpt4 book ai didi

php微信公众号js-sdk开发应用

转载 作者：qq735679552 更新时间：2022-09-27 22:32:09 25 4
gpt4 key购买 nike

CFSDN坚持开源创造价值，我们致力于搭建一个资源共享平台，让每一个IT人在这里找到属于你的精彩世界.

这篇CFSDN的博客文章php微信公众号js-sdk开发应用由作者收集整理，如果你对这篇文章有兴趣，记得点赞哟.

测试js的接口功能，我用的是bae服务器不是sae服务器。sae服务器不能写入文件，测试会出问题。 什么叫js-sdk，我先演示js-sdk接口的具体作用.

我在微信随便打开一片推送文章如下图:

php微信公众号js-sdk开发应用

点开第一篇文章 。

php微信公众号js-sdk开发应用

上面就是我们的连接文章，如果我们把这篇文章发送给朋友，显示效果如下图:

php微信公众号js-sdk开发应用

分享到朋友圈我们再来看看效果:

php微信公众号js-sdk开发应用

为什么同样是文章连接，在公众号、发送给朋友、发送到朋友圈显示的界面效果不一样。公众号的显示效果是因为微信公众帐号在推送的时候调用了微信的消息接口，而后两者是因为页面调用js-sdk相关的sdk接口。 发送给朋友调用了js接口的获取“分享给朋友”按钮点击状态及自定义分享内容接口。 发送给朋友圈调用了js接口的获取“分享到朋友圈”按钮点击状态及自定义分享内容接口.

下面我们来实现调用js-sdk接口的步骤:

第一步：微信公众平台进入“公众号设置”的“功能设置”里填写“js接口安全域名”.

如下图:

php微信公众号js-sdk开发应用

只有置于该域名下的页面才能调用js接口.

第二步：http://demo.open.weixin.qq.com/jssdk/sample.zip 连接这个地址下载 ，打开里面的php文件夹，你发现4个php文件 。

php微信公众号js-sdk开发应用

前面3 个php文件是配置文件，不要动它，sample.php是我们在微信中打开的连接页面，在这个页面中我们来编写我们的页面代码。这个文件我用来测试，里面的代码跟原版已经不同.

?
1
2
3
4
5
6
<?php
// echo "nihao";
require_once "jssdk.php" ;
$jssdk = new jssdk( "wxaf471be5d2bc9521" , "93f5c3817074d43e7a7ab3f403cc72dd" ); //jssdk中的参数是appid和appsecret。
$signpackage = $jssdk ->getsignpackage(); //获取配置参数。
?>
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
<!doctype html>
<html lang= "en" >
<head>
  <meta charset= "utf-8" >
  <title></title>
<meta name= "viewport" content= "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
</head>
<body>
  <div>我靠</div>
  <div>猪八戒</div>
  <button style= "color: red" id= "btn" >你好</button>
  <button id= "btn1" >唐生</button>
</body>
<script src= "http://res.wx.qq.com/open/js/jweixin-1.0.0.js" ></script>//这个是js-sdk文件，一定要引入。
<script>
 
  var button = document.getelementsbytagname( "button" );
  var btn = document.getelementbyid( "btn" );
  var div = document.getelementsbytagname( "div" )[0];
  var btn1 = document.getelementbyid( "btn1" );
  //wx表示一个js-sdk构建的一个对象。config（）是它的一个方法，这个接口用来验证配置。
  wx.config({
  debug: true, //true表示每调用一个接口信息都会在页面alert一段字符串。方便测试过程中国是否能正确调用接口。
  appid: '<?php echo $signpackage["appid"];?>' ,
  timestamp: <?php echo $signpackage [ "timestamp" ];?>,
  noncestr: '<?php echo $signpackage["noncestr"];?>' ,
  signature: '<?php echo $signpackage["signature"];?>' ,
  //上面的4个参数，如果你像深入了解其来源就去查看jssdk.php代码。测试过程不需要对上面的代码做任何操作。
  jsapilist: [
   // 所有要调用的 api 都要加到这个列表中
   'onmenushareappmessage' , //获取“分享给朋友”按钮点击状态及自定义分享内容接口。
   'chooseimage' , //获取手机相片接口
   'openlocation' //获取微信地图接口
  ]
  });
 
//所有的js调用接口都要放到下面的ready（）中。
  wx.ready( function () {
  // 在这里调用 api
  //获取“分享给朋友”按钮点击状态，点击后发送给朋友微信，微信上的推送显示内容就是下面的数据
   wx.onmenushareappmessage({
    title: '大圣' , // 分享标题
    desc: '我要坚持' , // 分享描述
    link: 'http://www.baidu.com' , // 分享链接
    imgurl: 'http://discuz.comli.com/weixin/weather/icon/cartoon.jpg' , // 分享图标
    type: 'link' , // 分享类型,music、video或link，不填默认为link
    dataurl: '' , // 如果type是music或video，则要提供数据链接，默认为空
    success: function () {
     // 用户确认分享后执行的回调函数
     alert( "success" );
    },
    cancel: function () {
     // 用户取消分享后执行的回调函数
     alert( "error" );
    }
   });
  //拍照或从手机相册选择。点击页面上的按钮就可以调用手机里的相册。
   btn.onclick = function (){
   wx.chooseimage({
    count : 1, // 默认9
    sizetype: [ 'original' , 'compressed' ], // 可以指定是原图还是压缩图，默认二者都有
    sourcetype: [ 'album' , 'camera' ], // 可以指定来源是相册还是相机，默认二者都有
    success: function (res) {
     var localids = res.localids; // 返回选定照片的本地id列表，localid可以作为img标签的src属性显示图片
    }
   })
   };
  //微信内置地图接口。点击该按钮就可转到显示当前位置的地图页面
   btn1.onclick = function () {
 
   wx.openlocation({
  latitude: 0, // 纬度，浮点数，范围为90 ~ -90
  longitude: 0, // 经度，浮点数，范围为180 ~ -180。
  name: '' , // 位置名
  address: '' , // 地址详情说明
  scale: 1, // 地图缩放级别,整形值,范围从1~28。默认为最大
  infourl: '' // 在查看位置界面底部显示的超链接,可点击跳转
});
   }
 
  });
// wx.checkjsapi({
//  jsapilist: ['onmenushareappmessage'], // 需要检测的js接口列表，所有js接口列表见附录2,
//  success: function(res) {
//   // 以键值对的形式返回，可用的api值true，不可用为false
//   // 如：{"checkresult":{"chooseimage":true},"errmsg":"checkjsapi:ok"}
//   alert("success");
//  }
// });
 
// btn.onclick = function() {
//  div.innertext = "齐天大圣";
//  wx.onmenushareappmessage({
//  title: '大圣', // 分享标题
//  desc: '我要坚持', // 分享描述
//  link: 'http://www.baidu.com', // 分享链接
//  imgurl: 'http://discuz.comli.com/weixin/weather/icon/cartoon.jpg', // 分享图标
//  type: 'link', // 分享类型,music、video或link，不填默认为link
//  dataurl: '', // 如果type是music或video，则要提供数据链接，默认为空
//  success: function () {
//   // 用户确认分享后执行的回调函数
//   alert("success");
//  },
//  cancel: function () {
//   // 用户取消分享后执行的回调函数
//   alert("error");
//  }
// });
  // }
</script>
</html>

测试js的接口功能，我用的是bae服务器不是sae服务器。sae服务器不能写入文件，测试会出问题。 更多功能及详细信息，请大家访问 http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html 。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我.

最后此篇关于php微信公众号js-sdk开发应用的文章就讲到这里了,如果你想了解更多关于php微信公众号js-sdk开发应用的内容请搜索CFSDN的文章或继续浏览相关文章，希望大家以后支持我的博客！ 。

25 4 0
文章推荐： java 工厂方法详解及实例代码
文章推荐： 深入分析escape()、encodeURI()、encodeURIComponent()的区别及示例
文章推荐： springmvc利用jquery.form插件异步上传文件示例
文章推荐： checkbox选中与未选中判断示例
qq735679552
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com