微信小程序通过php后端显示(解密)微信步数

这篇具有很好参考价值的文章主要介绍了微信小程序通过php后端显示(解密)微信步数。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

今天来讲一下微信小程序如何获得微信运动步数,并通过后端php解密。
  微信小程序通过wx.getWeRunData获得用户过去三十一天微信运动步数,获取成功后,会得到一个叫encryptedData的参数,它对将用户涉及用户隐私的信息进行了加密,如此处的微信步数,需要通过后端解密,才能得到有用信息,encryptedData的解密算法可参考官方文档https://developers.weixin.qq.com/minigame/dev/guide/open-ability/signature.html#加密数据解密算法。官方文档还提供示例代码https://res.wx.qq.com/wxdoc/dist/assets/media/aes-sample.eae1f364.zip下载。下载后得到一个压缩包,解压后里面有C++、Node、php、Python四种语言的后端语言示例代码,这里用php用后端来解密数据。下面就对php用后端来解密微信步数数据。为了方便理解我将整个过程切割成几大块。以下讲解都是基于win10 64位讲解。
  第一块内容是安装配置php程序,这里需要你的php版本为7.0及以上,如果是7.0以下建议卸载,原因后面会讲。到php官网下载php,解压放到磁盘上,我下载的就php8,php8需要 VC++2019支持,解压路径中不要有空格和非英文字符。
  在线测试解密微信小程序 运动,微信小程序,php,notepad++
  图1
  在线测试解密微信小程序 运动,微信小程序,php,notepad++
图2

接下来配置环境变量,右键此电脑,属性,如图1界面,选择高级系统设置,弹出系统属性窗口如图2点击环境变量按钮,出现环境变量窗口,在系统变量窗格中如图3,找到path对其编辑,没有自己建一个,弹出编辑环境变量窗口如图4,新建一个变量,将刚下载的php根路径填入。保存
  在线测试解密微信小程序 运动,微信小程序,php,notepad++
  图3
  在线测试解密微信小程序 运动,微信小程序,php,notepad++
图4

最后,打开命令窗口输入php -v,如果能看到php的版本信息,说明php安装完成了。
  第二块内容是如何添加iis信息服务,虽然Appace可以运行php,但我配不好,或许版本高吧,所以选择了IIS,如果你的Appace能成功运行php8页面在或者已经配好iis可跳过此步。
  在线测试解密微信小程序 运动,微信小程序,php,notepad++
  图5
  在线测试解密微信小程序 运动,微信小程序,php,notepad++
  图6

首先,打开控制面板,点击程序 卸载程序(图5),进入后可以看到如图6界面,再选择启用或关闭windows功能,进入如图7界面将Internet information services节点下下web管理功能、万维网功能相应选项勾上,如果不知道哪些需要选择,全部勾上也无妨。点击确定后,等其进度全部后重启计算机。
  在线测试解密微信小程序 运动,微信小程序,php,notepad++
  图7

重启后,在桌面右键此电脑图标,在弹出菜单中选择管理后可以看到在计算机管理界面服务和应用程序节点已经有了Internet information services,说明我们已经安装了IIS,将其选择,可以看到一个网站节点如图8,右键添加网站,如图9,根据实际情况填写红框中的内容,然后确定。这样我们就建立了一个站点。
  在线测试解密微信小程序 运动,微信小程序,php,notepad++
  图8
  在线测试解密微信小程序 运动,微信小程序,php,notepad++
  图9

第三块,让php演示代码正常运行。首先,选择我们刚建立站点节点,如图10,点击处理程序映射,在处理程序映射界面,右键,选择添加模块映射,按图10填写,注意可执行文件要替换你自己的路径。确定。
  在线测试解密微信小程序 运动,微信小程序,php,notepad++
图10
  接着找到从微信公众平台下载好的后端语言示例代码,将php整目录复制到刚新建站点目录下,展开站点节点,我们可以看到多了一个php目录,打开php目录,新建一个index.php。在index.php中添加如下代码,保存。在浏览器输入地址,如http://localhost/PHP/index.php,应可以看到图11信息,说明iis成功运行了php。
  在线测试解密微信小程序 运动,微信小程序,php,notepad++
  图11

 文件内容如下:
 
<?php 
  phpinfo();
?>

在线测试解密微信小程序 运动,微信小程序,php,notepad++
图12
  这时,你是不是已经非常激动在浏览器打开demo.php页面,但是你却看到如下界面,如图12,这是因类需要openssl来完成解密,并且只有php7及以上才支持openssl,这也前面为什么要卸载低版本php的原因。再回到index.php运行界面,再来看图11红框中的内容,可以看到Loaded Configuration File中为none,这说明我们php8目录没有php.ini配置文件,我们暂时搁置php.ini先来先下载安装opessl。打开地址:https://slproweb.com/products/Win32OpenSSL.html,下载合适版本,我这里下载light版本,下载并安装,之后,我们再去配置环境变量,将openssl安装路径添加到path中。装完openssl,去配置php.ini,编辑php.ini,配置如下
extension=php_openssl.dll

extension_dir = “你的php程序路径\ext”
  保存,重启iis。再在浏览器访问index.php页面,如图13,Loaded Configuration File已经有了php.ini,还多出一个openssl的内容(图13为拼图,可以在网页上搜一下openssl),此时打开demo.php后端完成了encryptedData的解密。如图与官网示例解密内容一致。下面对官方的demo.php进行修改(注意:解密时有一个变量sessionkey,需要访问微信api解码,此过程应在后端完成,访问微信api是不允许在前端进行的,在发布小程序时,应将需要需要访问的域名放到白名单中,而微信官方禁止微信api放到白名单中,因为访问需要你的appid和秘钥secret,二者可在微信公众后台去申请,前端容易被反编译官方解释https://kf.qq.com/faq/1706236NjINj1706236VRZBR.html,故此,要将你的appid和秘钥保存到后端然后去访问,之前我就犯错误,将访问微信api放到了前端,之所以仍能在模拟器运行,是因为勾选了不校验域名合法性)。
修改后代码如下。

<?php

include_once "wxBizDataCrypt.php";
// 设置API接口的URL
 $appid = '你的appid';
 $secret='你的密钥';
 
 $rescode=$_GET['rescode'];
 
 $encryptedData=$_GET['encryptedData'];

$iv =$_GET['iv'] ;
 //步骤一 访问api 获得数据
$url = 'https://api.weixin.qq.com/sns/jscode2session?appid=' . $appid . '&secret=' . $secret . '&js_code=' . $rescode . '&grant_type=authorization_code';

// 设置请求的header
$options = [
    'http' => [
        'header' => "Authorization: Bearer YOUR_API_TOKEN
" .
                    "Content-Type: application/json
",
        'method' => 'GET',
    ],
];

// 发起请求并获取响应
$response = file_get_contents($url, false, stream_context_create($options));

// 输出API接口返回的数据





//echo $response 


//解析json,获得sesionkey
$jsondata = json_decode($response, true);


$sessionkey =$jsondata['session_key'];

//echo $sessionkey

$pc = new WXBizDataCrypt($appid, $sessionkey);
$errCode = $pc->decryptData($encryptedData, $iv, $data );

if ($errCode == 0) {
    print($data . "\n");
} else {
    print($errCode . "\n");
}
?>

至此后端工作全部完成。接下去就是微信小程序前端代码。
  第四块:微信小程序前端代码,打开微信开发者工具新建一个微信,选择一个不使用云服务JS-基础模板。删除page下其它页面,只保留一个index页面,在app.json中删除其它页面配置,只保留index,清除index.wxml的布局文件,清除index.js的自定义代码及data中定义参数。
  我们先写index.js,在调用wx.getWeRunData,要先用wx.login登录,会获得一个res.code,对对应于访问微信api中的js_code参数,而调用wx.getWeRunData会获得encryptedData和iv,然后wx.request去访问自己的php后端就行了,注意由于是测试,不要点忘记点击微信开发者工具右上角的详情按钮,然后在本地设置中勾上不校验合法域名。

// pages/index/index.js

var common = require('../../utils/common.js')
var util=require('../../utils/util.js')
Page({

  /**
   * 页面的初始数据
   */
  data: {

  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    
   
    
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  },

  getrundata()
  {
   
    var that=this;
    wx.login({ 
      success: function (res) { 
       
        var encryptedData="";
        var iv=""
       
        if (res.code)
         { 
           var rescode=res.code
           
           
          wx.getWeRunData({ 
            success: function (res2) {
             console.log("wx.getWeRunData成功")
           
               encryptedData = res2.encryptedData; 
               iv = res2.iv;
               that.conndemo(rescode,encryptedData,iv)
              
            },
           fail: function (e) { console.log("wx.getWeRunData获取数据失败") }
       })
              
                 }
            } 
            }) 
  },

  getFullUrl(options) //获得拼接后url,无实际意义,只用于检查url输出是否正确
  {
    // 获取请求的 URL
    let url = options.url;
   
    // 如果 URL 以 ? 结尾,则直接添加 data,否则检查是否已有查询参数,若无则添加 ?
    if (url.endsWith('?')) {
      url += options.data;
    } else {
      let hasQuery = url.includes('?');
      let sep = hasQuery ? '&' : '?';
      url += sep + Object.keys(options.data)
        .map(key => `${encodeURIComponent(key)}=${encodeURIComponent(options.data[key])}`)
        .join('&');
    }
   
    return url;
  },

  conndemo(rescode,encryptedData,iv)
  {
    
    var that=this;
    var url='http://localhost/PHP/demo.php'
    var sessionkey="";
 
   //-----
 
   ///-----
    wx.request({
      url: url,
     
      data:
      {
        
        rescode:rescode,
        grant_type:"authorization_code",
        encryptedData:encryptedData,
        iv:iv,
        
      },
    
      success:function (res) {
      sessionkey=res.data.session_key
      console.log("输出session_key啦"+sessionkey)
      that.setData({
        steplist:res.data.stepInfoList
      })
     // that.conndemo(sessionkey,encryptedData,iv)
     
    }
    })

    let fullUrl = that.getFullUrl({
      url: 'http://localhost/PHP/transferweixinapi.php',
      data: {
        rescode:rescode,
        grant_type:"authorization_code",
        encryptedData:encryptedData,
        iv:iv
        
      }
    });
     
    console.log('Full URL:', fullUrl);
   
  },

  

 

  ts_to_time(timestamp) {
    //const timestamp = 1619183582000;
   // 网上js1970-1-1加多少毫秒,此处是秒,所以*1000
    const date = new Date(timestamp*1000);
    const year = date.getFullYear();
    const month = ('0' + (date.getMonth() + 1)).slice(-2);
    const day = ('0' + date.getDate()).slice(-2);
    const hours = ('0' + date.getHours()).slice(-2);
    const minutes = ('0' + date.getMinutes()).slice(-2);
    const seconds = ('0' + date.getSeconds()).slice(-2);
    //const formattedDate = year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds;
    const formattedDate = year + '-' + month + '-' + day ;
    
    return formattedDate

},

 getSecondsDifference(date1, date2) {
  return Math.abs(new Date(date1) - new Date(date2)) / 1000;
}

 



 
  
})

写完index.js写index.wxml,代码如下,其中步数列表有个timestamp,时间戳,需要转年月日,转换的js代码要写wxml上,在wxs标志内写,然后调用。
  代码如下

<wxs module="m1">
var msg = "hello world";

module.exports.message = msg;
var ts2date=function(timestamp)
{
    //timestamp默认是1970-1-1加timestamp毫秒,这里秒,所以*1000
    var date = getDate(timestamp*1000);
    var year = date.getFullYear();
    var month = ('0' + (date.getMonth() + 1)).slice(-2);
    var day = ('0' + date.getDate()).slice(-2);
    var hours = ('0' + date.getHours()).slice(-2);
    var minutes = ('0' + date.getMinutes()).slice(-2);
    var seconds = ('0' + date.getSeconds()).slice(-2);
    //const formattedDate = year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds;
    var formattedDate = year + '-' + month + '-' + day ;
    
    return formattedDate;
    //return "fdsf";
}
module.exports.ts2date=ts2date;


</wxs>

<button type="warn" plain="true" bind:tap="getrundata">获取微信步数</button>
<view wx:for="{{steplist}}"> {{m1.ts2date(item.timestamp)}} {{item.step}}步</view>

至此,全部代码已完成,在模拟器上运行代码,如图14,成功!
  在线测试解密微信小程序 运动,微信小程序,php,notepad++

源码下载地址:https://download.csdn.net/download/wstcl/89124859,查看本人的评论,有彩蛋。文章来源地址https://www.toymoban.com/news/detail-851092.html

到了这里,关于微信小程序通过php后端显示(解密)微信步数的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序学习实录2(下拉刷新、下拉加载更多、小程序事件、PHP后端代码、刷新无数据解决方案)

    lazyCodeLoading基础库 2.11.1 及以上版本支持,2.11.1 以下兼容但无优化效果 通常情况下,在小程序启动期间,所有页面及自定义组件的代码都会进行注入,当前页面没有使用到的自定义组件和页面在注入后其实并没有被使用。自基础库版本 2.11.1 起,小程序支持有选择地注入必要

    2024年02月05日
    浏览(49)
  • 微信小程序通过点击按钮控制元素隐藏与显示

    一、效果图: 二、代码 js: wxml: 一、效果图: js: wxml:

    2024年02月12日
    浏览(49)
  • 微信小程序微信原生小程序如何通过后端返回的二进制流导出excel文件并保存和转发

    首先后端返回给我们的数据是这样的,一串二进制流 然后直接上代码吧,注释基本上说的差不多了 打开后的界面就是这样,导出成功,然后右上角三个点可以保存本地和转发

    2024年02月11日
    浏览(56)
  • ESP32上实现环境温湿度检测上传数据并通过微信小程序显示

    共包含三个步骤 Arduino端代码  onenet云平台产品准备  微信小程序代码 1. Arduino端代码如下: #include WiFi.h #include \\\"DHT.h\\\" #include \\\"PubSubClient.h\\\" #include \\\"Ticker.h\\\" #define DHTPIN 17      #define DHTTYPE DHT11    DHT dht(DHTPIN, DHTTYPE); int god=0; const char *ssid     = \\\"FAST_CAED9A\\\"; const char *password = \\\"13837

    2024年02月11日
    浏览(47)
  • 微信小程序逆向解密

    WeChatAppEx.exe 版本:2.0.6609.4 以融智云考学生端为例。 网上已经有关于微信小程序解密的非常优秀的文章,本着学习的目的便不参考相关内容。 笔者水平实在有限,如发现纰漏,还请读者不吝赐教。 工具:火绒剑 首先看看打开一个小程序微信做了点什么,对微信进行火绒行为

    2024年02月11日
    浏览(45)
  • 微信小程序--解密用户信息

    前端传值:encryptedData、iv、code step1:将code发送给微信服务器,获取openid和session_key step2:根据encryptedData、iv、session_key(会话密钥),通过AES解密获取到用户所有信息

    2024年02月15日
    浏览(36)
  • 微信小程序前端加解密逆向分析

    某小程序渗透测试项目,测试时发现请求包内容进行了加密 小程序文件目录: 使用网易Mumu模拟器,开启root权限,安装手机微信并访问指定小程序,然后打开RE文件管理器,在 data/data/com.tencent.mm/MicroMsg 会生成一个md5加密命名的文件夹,在该文件夹下的 appbrand/pkg 目录下找到

    2024年02月05日
    浏览(53)
  • 微信小程序之 base-64加密、解密

    后端获取 token 接口,需要加密认证

    2024年02月11日
    浏览(60)
  • 【微信小程序】实现微信小程序登录(附源码)后端,微信小程序获取手机号

    登录简介 第一步:获取token 第二步:通过token拿用户信息 第三步:调用接口获取手机号 HttpClientUtil: WeChatUtil: controller层: service层: serviceImpl层: 登录简介        新版本微信小程序登录 是前端获取用户信息,不再是后端获取信息进行保存。所以后端要做的主要流程就是

    2024年04月23日
    浏览(59)
  • js 微信小程序aes解密-CryptoJS

    随着微信小程序的不断发展,js这门技术也越来越重要,很多人都开启了学习js,本文就介绍了aes解密。 crypto-js 是一个纯 javascript 写的加密算法类库 ,可以非常方便地在 javascript 进行 MD5、SHA1、SHA2、SHA3、RIPEMD-160 哈希散列,进行 AES、DES、Rabbit、RC4、Triple DES 加解密。 我们可

    2024年02月16日
    浏览(54)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包