2019独角兽企业重金招聘Python工程师标准>>>

一、JS端

1、绑定域名

先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。

备注:登录后可在“开发者中心”查看对应的接口权限。

2、引入JS文件:http://res.wx.qq.com/open/js/jweixin-1.0.0.js

3、通过config接口注入配置

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

appId:公众号原始ID

timestamp:当前时间的时间戳

nonce_str:随机字符串

signature:签名。

1、首先通过https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=appId&secret=secret接口得到token

2、通过https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi得到ticket

3、通过这些参数指定方式进行签名,签名方式使用SHA1,得到signature(注意需要传递URL,URL是指访问当前页面的URL。不知道这里URL解释错了没用)

二、后台端调用接口得到相应参数,传递到前端(spring mvc /servlet/struts2都可以)

request.setAttribute("timestamp", data.get("timestamp"));
 request.setAttribute("nonceStr", data.get("nonceStr"));
 request.setAttribute("signature", data.get("signature"));
 request.getServletContext().getRequestDispatcher("/wechat.jsp").forward(request,response);

三:使用微信官网提供的调试工具进行调试。http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=cardsign

注意:

1、获取验证参数接口,得到相应参数(php、java、nodejs以及python)

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

2、分享接口并不是只有认证号能用,现在测试号和未认证号到可以用。(以测试的)

3、测试分享接口需要注意的是,需要你主动去触发分享接口(比如分享到朋友圈,然后点击分享按钮触发Js代码)

4、使用图像和音频上传接口上传的图片和音频只有3天的有效期,如果图片和音频你想长期使用的话,你本地也要保存。

不理解:

1、链接中包含php、java、nodejs以及python的示例代码供第三方参考,第三方切记要对获取的accesstoken以及jsapi_ticket进行缓存以确保不会触发频率限制。

2、所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用(同一个url仅需调用一次,对于变化url的SPA的web app可在每次url变化时进行调用,目前Android微信客户端不支持pushState的H5新特性,所以使用pushState来实现web app的页面会导致签名失败,此问题会在Android6.2中修复)。

3、不要尝试在trigger中使用ajax异步请求修改本次分享的内容,因为客户端分享操作是一个同步操作,这时候使用ajax的回包会还没有返回。

4、对于调用jssdk的时候,wx.ready需要注意,判断你的事件是否是页面加载的时候主动触发,还是用户有操作的触发。如果页面加载的时候自动触发,你必须要用wx.ready包括对应的事件,否则不需要。

转载于:https://my.oschina.net/u/2472104/blog/625525

微信JS SDK网页接口相关推荐

  1. 微信js sdk图片接口 上传图片

    开发微信平台网页不可避免的需要调用微信提供的接口.微信JS-SDK提供了方便的调用. 需要实现上传图片更换头像的功能,要用到图片相关的几个接口.根据微信开发者文档的说明,步骤一绑定域名,步骤二引入js ...

  2. 微信JS SDK开放,前端开发者“鸡冻”了!

    HTML5又一次逆袭了,其实之前微信也是有一些JS API的,比如分享.但这次一股脑开放了拍摄.录音.语音识别.二维码.地图.支付.分享.卡券等几十个API,这条消息不需宣传,瞬间就占满了HTML5从 ...

  3. 微信js sdk 授权上传头像下载代码片段和注意事项

    /*  * 描述:当前页授权  * @param url   例:index.html / 如果有参数,需加密index.html?id=1     */ 1.对需要运用js sdk的页面授权 get ...

  4. 使用微信js sdk关于选择及上传图片至腾讯云COS

    使用微信js sdk关于选择及上传图片至腾讯云COS 使用微信js sdk关于选择及上传图片至腾讯云COS 背景 名词 参考 效果图展示 开发步骤 1:概要步骤 2:上代码 结束: 使用微信js sd ...

  5. 微信-js sdk invalid signature签名错误 问题解决

    微信-js sdk invalid signature签名错误 问题解决 参考文章: (1)微信-js sdk invalid signature签名错误 问题解决 (2)https://www.cn ...

  6. 微信js sdk 分享 失败 有时候好 有时候坏

    微信js sdk 分享 失败  有时候好 有时候坏 用了一个www开头的域名 和一个xx.com的域名 两个在解析上有问题. 实践是www.xx.com的比较 稳定 转载于:https://www.c ...

  7. 淘宝客微信机器人SDK调用接口

    淘宝客微信机器人SDK调用接口定义 手机客户端上传的通知类消息 (删除了没用的) 8.手机客户端微信上线通知 9.手机客户端微信下线通知 10.微信个人号新增好友通知 11.微信个人号移除好友通知 1 ...

  8. 实战微信JS SDK开发:贺卡制作与播放(1)

    前段时间忙于CanTK 2.0的开发,所以博客一直没有更新.CanTK 2.0主要增强了游戏和富媒体的开发,现在编码和测试基本完成了,等文档完成了再正式发布,里面有不少激动人心的功能,等发布时再一一细 ...

  9. php转发朋友圈缩略图片,解释最全的,手把手教的微信JS sdk分享设置教程-微信分享插件PHP源码JS-SDK接口,分享到朋友圈 转发好友带缩略图...

    亲们,此文是我上传的有关微信分享插件PHP源码JS-SDK接口的.rar和.zip的说明使用文件 许多朋友都面临自己编写的网站通过微信转发时,无论是分享微信好友或是微信朋友圈时,出现无缩略图显示的问题 ...

  10. 开发微信小程序,就是这么简单!可自动生成微信小程序源代码,配套JS SDK、接口和后台

    开发微信小程序,就是这么简单!自己动手,丰衣足食! 开发微信小程序有多简单?
 你只需要掌握前端开发,就可以轻松开发自己的微信小程序,实现自己的业务功能.借助果创云,无须域名.无须服务器.无须数据库, ...

最新文章

  1. 2020 AI DEBATE即将召开, Judea Pearl、李飞飞等10多位顶级科学家参与 | AI日报
  2. MTK前CFO喻铭铎分享经营智慧:山寨只是门票
  3. 绍中考能不能用计算机了,全国计算机二级考什么内容
  4. CTF-Xortool,windows上的安装与使用
  5. [Nginx]用Nginx实现与应用结合的訪问控制 - 防盗链
  6. Vue—上手实践—快速入门
  7. 容器学习 之 镜像的分层结构(六)
  8. matlab m文件的编写,Matlab实验报告(四)M文件的编写.doc
  9. js模板引擎art template数组渲染的方法
  10. 多功能拼团商城源码-带优惠券功能+自适应移动端+对接免签约支付
  11. java字节转xml_关于XML文档和JAVA中的JTree之间如何转换的问题
  12. JavaScript中的innerHTML,innerHTML,value属性
  13. 关于filenet中的folder以及document简单操作
  14. 模糊综合评价法(FCE)-快速理解
  15. 机器学习:线性SVM损失函数转换拉格朗日乘数
  16. 八年开心网,它的是非功过都在这里了
  17. 微软收购雅虎遇新难题 或遭中国反垄断法阻碍
  18. 64位服务器采购全攻略
  19. 如何避开PPT演讲的几个误区(上)
  20. SLAM优秀开源工程大汇总

热门文章

  1. c++ 打印条码_条码打印软件之优化导入PDF文档的清晰度
  2. 分布式 集群 负载均衡含义
  3. abp调用登录接口获取token再调用其他接口
  4. PHP批量插入多条数据到Mysql报错:Mysql Prepared statement contains too many placeholders
  5. PHP实现用户浏览记录接口
  6. No package ‘libmate-menu‘ found
  7. No package ‘gtksourceview-4‘ found
  8. 字写得难看,是什么原因
  9. bash: dh_make:未找到命令
  10. eclipse注释中,文字大小不等的解决办法