wxJsSDK.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. // 获取微信公众号SDK权限
  2. //接口请求方法
  3. import $http from '@/config/requestConfig';
  4. import base from '@/config/baseUrl';
  5. import { publicShareFun } from '@/config/html5Utils';
  6. //获取地理位置
  7. export const getLocation = () => {
  8. return new Promise((resolve, reject) => {
  9. //配置校验成功后执行
  10. jWeixin.ready(function () {
  11. // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
  12. jWeixin.getLocation({
  13. type: 'gcj02', // 默认为wgs84的gps坐标,如果要返回直接给openLocation用的火星坐标,可传入'gcj02'
  14. success: function (res) {
  15. console.log(res);
  16. resolve(res);
  17. },
  18. fail: (err) => {
  19. reject(err);
  20. }
  21. });
  22. });
  23. });
  24. }
  25. //设置分享信息
  26. export const setShare = (data, callback) => {
  27. //配置校验成功后执行
  28. jWeixin.ready(function () {
  29. if (!data.link) {
  30. let url = window.location.href;
  31. let index = url.indexOf("?");
  32. if (index != -1) {
  33. if (url.indexOf("#") != -1 && url.indexOf("#") > index) {
  34. url = url.substring(0, index) + url.substring(url.indexOf("#"));
  35. } else {
  36. url = url.substr(0, index);
  37. }
  38. }
  39. data.link = url;
  40. }
  41. // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
  42. jWeixin.updateAppMessageShareData({
  43. title: data.title, // 分享标题
  44. desc: data.desc, // 分享描述
  45. link: data.link, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
  46. imgUrl: data.imgUrl, // 分享图标
  47. success: function () {
  48. // 设置成功
  49. callback && callback();
  50. }
  51. });
  52. jWeixin.updateTimelineShareData({
  53. title: data.title, // 分享标题
  54. link: data.link, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
  55. imgUrl: data.imgUrl, // 分享图标
  56. success: function () {
  57. // 设置成功
  58. callback && callback();
  59. }
  60. });
  61. });
  62. }
  63. //微信扫一扫
  64. export const scanQRCode = ( callback,needResult = 1) => {
  65. //配置校验成功后执行
  66. jWeixin.ready(function () {
  67. jWeixin.scanQRCode({
  68. needResult: needResult, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果,
  69. scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码,默认二者都有
  70. success: function (res) {
  71. callback && callback(res);
  72. }
  73. });
  74. });
  75. }
  76. window.onload = function () {
  77. // 配置文件里面没有publicAppId将不激活微信SDK功能
  78. if (!base.publicAppId) {
  79. return;
  80. }
  81. //获取当前页面地址
  82. let url = window.location.href;
  83. url = url.substring(0, url.indexOf("#"));
  84. //获取微信公众号SDK权限的签名、随机数、时间戳
  85. $http.post("api/open/signature", {
  86. url: url
  87. }).then(res => {
  88. // 微信SDK配置
  89. jWeixin.config({
  90. debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
  91. appId: base.publicAppId, // 必填,公众号的唯一标识
  92. timestamp: res.timestamp, // 必填,生成签名的时间戳
  93. nonceStr: res.noncestr, // 必填,生成签名的随机串
  94. signature: res.signature,// 必填,签名
  95. jsApiList: [
  96. "getLocation",
  97. "updateAppMessageShareData",
  98. "updateTimelineShareData",
  99. 'onMenuShareAppMessage', //旧的接口,即将废弃
  100. 'onMenuShareTimeline' //旧的接口,即将废弃
  101. ] // 必填,需要使用的JS接口列表
  102. });
  103. //设置分享内容
  104. publicShareFun();
  105. });
  106. //配置校验失败后执行
  107. jWeixin.error(function (res) {
  108. // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
  109. console.log(res);
  110. });
  111. };