小程序制作笔记-小程序代码之wx.request-Sham@双目瞿

制作小程序过程中，会用到读取、递交数据到服务器后台，这里就会用到 wx.request ，其实在前面的文章中已经多次出现，这里单独拎出来记录下。

以下是Sham用来读取数据库中当前登录微信对应的用户信息的代码，供参考。

首先是小程序端，在js中的 onLoad: function () {}中添加：(Sham最近才搞清楚如何在js中调用读取到的数组中的某个值，就是fmcname: res.data.fmcinfo[0].fmcname，特别记录下）

 var that = this; 
//首先读取当前微信账号对应的openid，这个前面文章中介绍过，详见：https://www.shamqu.cn/wechat-applet-learning-get-openid.html
    wx.login({
      success: function (res) {
        console.log(res.code)
        //发送请求
        wx.request({
          url: 'https://网址/user/getopenid.php', //接口地址
          data: { code: res.code },
          header: {
            'content-type': 'application/json' //默认值
          },
          success: function (res) {
            console.log(res.data)
            that.setData({
              fmc: res.data,//将表中查询出来的信息传给fmc，这个可以自己定义
            })
//然后通过将openid传值发送给后台php，读取对应的用户的信息（提前登记过的），可参考：https://www.shamqu.cn/wechat-applet-learning-user-login-with-classify.html
            var openid = res.data.openid  //将openid定义为上面读取到的数据
            wx.request({
              url: 'https://网址/user/user.php?fmcopenid=' + openid, //连接服务器从表中查询的接口   
              data: {
              },
              header: {
                'content-type': 'application/json'
              },
              success: function (res) {
                console.log(res.data)
                that.setData({
                  list: res.data.fmcinfo,//将表中查询出来的信息传给list
                  fmcname: res.data.fmcinfo[0].fmcname,  //将fmcname设置为读取到的fmcname信息，这里[0]是指读取到的数组的第一个，然后前端就可以直接通过{{fmcname}}来调用了，也可以设置数组中的其他值，可以通过console.log看到数组明细
                })
                if (res.data.fmcinfo.length
                  == 1) {
                  that.setData({
                    hasFMCInfo: true  //当读到信息时，显示当前用户信息
                  })
                }
                else {
                  that.setData({
                    hasFMCInfo: false  //不然，就显示“你还未登录，请先登录”
                  })
                }
              },
            })
          }
        })
      }
    });

var that = this;

//首先读取当前微信账号对应的openid，这个前面文章中介绍过，详见：https://www.shamqu.cn/wechat-applet-learning-get-openid.html

wx.login({

success: function (res) {

console.log(res.code)

//发送请求

wx.request({

url: 'https://网址/user/getopenid.php', //接口地址

data: { code: res.code },

header: {

'content-type': 'application/json' //默认值

success: function (res) {

console.log(res.data)

that.setData({

fmc: res.data,//将表中查询出来的信息传给fmc，这个可以自己定义

})

//然后通过将openid传值发送给后台php，读取对应的用户的信息（提前登记过的），可参考：https://www.shamqu.cn/wechat-applet-learning-user-login-with-classify.html

var openid = res.data.openid //将openid定义为上面读取到的数据

wx.request({

url: 'https://网址/user/user.php?fmcopenid=' + openid, //连接服务器从表中查询的接口

data: {

header: {

'content-type': 'application/json'

success: function (res) {

console.log(res.data)

that.setData({

list: res.data.fmcinfo,//将表中查询出来的信息传给list

fmcname: res.data.fmcinfo[0].fmcname, //将fmcname设置为读取到的fmcname信息，这里[0]是指读取到的数组的第一个，然后前端就可以直接通过{{fmcname}}来调用了，也可以设置数组中的其他值，可以通过console.log看到数组明细

})

if (res.data.fmcinfo.length

== 1) {

that.setData({

hasFMCInfo: true //当读到信息时，显示当前用户信息

})

}

else {

that.setData({

hasFMCInfo: false //不然，就显示“你还未登录，请先登录”

})

}

})

}

})

}

});

然后就是前段wxml文件代码：

  <!--工号姓名等信息-->
  <view class="userdetail">
      <!--如果数据库没有个人信息，则要求登录-->
      <view wx:if="{{!hasFMCInfo}}">
        <button class="fmcinfoup" bindtap="infologin">暂未登录，请提交个人信息 </button>
      </view>
  <!--如果数据库有个人信息，则显示个人信息-->
    <block wx:else>
      <view wx:for="{{list}}" wx:key="fmcopenid" class='fmcinfo'>             
        <view class='fmcinfod'>
          <view class="items"> 工号： </view>
          <view class="itemsd">{{item.fmcid}}</view>
        </view>
        <view class='fmcinfod'>
          <view class="items"> 姓名： </view>
          <view class="itemsd">{{item.fmcname}}</view>
        </view>
        <view class='fmcinfod'>
          <view class="items"> 电话： </view>
          <view class="itemsd">{{item.fmcphone}}</view> 
        </view>
        <view class='fmcinfod'>
          <view class="items"> 我是： </view>
          <view class="itemsd">{{item.usertype}}</view> 
        </view>
      </view>
    </block>
  </view>
</view>

<button class="fmcinfoup" bindtap="infologin">暂未登录，请提交个人信息 </button>

</view>

<view class="itemsd">{{item.fmcid}}</view>

</view>

<view class="itemsd">{{item.fmcname}}</view>

</view>

<view class="itemsd">{{item.fmcphone}}</view>

</view>

<view class="itemsd">{{item.usertype}}</view>

</view>

</block>

</view>

顺便附上wxss代码：

.userdetail{
  width: 60%;
  height:auto;
  margin: 10px 20rpx;
}

.fmcinfod {
  display:flex;
  flex-direction: row;
  margin-top:5px;
  color:#fff;
  font-size:15px;
}
.items{
  font-size:16px;
  font-weight:bold;
}
.itemsd{
  color:#fff;
  border-bottom:1px #fff dashed;
}

.userdetail{

width: 60%;

height:auto;

margin: 10px 20rpx;

}

.fmcinfod {

display:flex;

flex-direction: row;

margin-top:5px;

color:#fff;

font-size:15px;

}

.items{

font-size:16px;

font-weight:bold;

}

.itemsd{

color:#fff;

border-bottom:1px #fff dashed;

}

最后就是后端PHP代码，文件名和路径对应上面js中的wx.request里的url:

<?php
include_once("con.php");  //链接数据库
$json = '';
$data = array();
class Fmcinfo 
{
}
//如果是通过个人信息页传值openid，则通过openid读取数据库信息并返回数据
if($fmcopenid =isset($_GET['fmcopenid'])?$_GET['fmcopenid']:''){
$sql = "SELECT * FROM fmc_user where fmcopenid='$fmcopenid'";
//又或者如果是通过人员清单页面传值fmcid工号，则通过fmcid读取数据库信息并返回数据，在前台显示对应工号的人员信息（用于通过fmcid查询）
}elseif($fmcid =isset($_GET['fmcid'])?$_GET['fmcid']:''){
$sql = "SELECT * FROM fmc_user where fmcid='$fmcid'";
//最后是如果没有传值，则显示所有人员清单，用于在前台显示用户列表，供管理员查阅
}else{
  $sql = "SELECT * FROM fmc_user";
}
$result = $con->query($sql);
if($result){
//echo "查询成功";
while ($row = mysqli_fetch_array($result,MYSQL_ASSOC))
{
$fmcinfo = new Fmcinfo();   //这里的fmcinfo，就是最后打包成json供小程序使用，并前面js中setdata里面对应res.data.fmcinfo，这个要保持一致，不然无法读取
$fmcinfo->userid= $row["userid"];
$fmcinfo->fmcopenid= $row["fmcopenid"];
$fmcinfo->fmcid= "FME{$row["fmcid"]}"; //这里添加了自动加上FME，这样在小程序中只要登记数字就行
$fmcinfo->fmcname = $row["fmcname"];
$fmcinfo->fmcphone = $row["fmcphone"];
$fmcinfo->fmcnickname = $row["fmcnickname"];
$fmcinfo->useravatar = $row["useravatar"];  
//这里通过读取到的fmcid和fmcname进行判断，通过另一个员工清单表格，读取当前用户的对应的用户类别权限
$loginSql = <<<login
select * from fmc_staff where fmcid="FME{$row["fmcid"]}" and fmcname = "{$row["fmcname"]}";
login;
$res = mysqli_query($con, $loginSql);
if($rows = mysqli_fetch_array($res)){
$fmcinfo->usertype=$rows['usertype'];
$fmcinfo->ctcommitee = $rows['ctcommitee'];
$fmcinfo->dormitory = $rows['dormitory']; 
//如果读取不到，则显示用户类别为游客，不享有使用微信小程序功能的权利
}else{
$fmcinfo->usertype='游客';
$fmcinfo->ctcommitee = '0';
$fmcinfo->dormitory = '0'; 
}
$data[]=$fmcinfo;
}
$json = json_encode($data);//把数据转换为JSON数据.
echo "{".'"fmcinfo"'.":".$json."}";
}else{
echo "查询失败";
}
?>

<?php

include_once("con.php"); //链接数据库

$json = '';

$data = array();

class Fmcinfo

{

}

//如果是通过个人信息页传值openid，则通过openid读取数据库信息并返回数据

if($fmcopenid =isset($_GET['fmcopenid'])?$_GET['fmcopenid']:''){

$sql = "SELECT * FROM fmc_user where fmcopenid='$fmcopenid'";

//又或者如果是通过人员清单页面传值fmcid工号，则通过fmcid读取数据库信息并返回数据，在前台显示对应工号的人员信息（用于通过fmcid查询）

}elseif($fmcid =isset($_GET['fmcid'])?$_GET['fmcid']:''){

$sql = "SELECT * FROM fmc_user where fmcid='$fmcid'";

//最后是如果没有传值，则显示所有人员清单，用于在前台显示用户列表，供管理员查阅

}else{

$sql = "SELECT * FROM fmc_user";

}

$result = $con->query($sql);

if($result){

//echo "查询成功";

while ($row = mysqli_fetch_array($result,MYSQL_ASSOC))

{

$fmcinfo = new Fmcinfo(); //这里的fmcinfo，就是最后打包成json供小程序使用，并前面js中setdata里面对应res.data.fmcinfo，这个要保持一致，不然无法读取

$fmcinfo->userid= $row["userid"];

$fmcinfo->fmcopenid= $row["fmcopenid"];

$fmcinfo->fmcid= "FME{$row["fmcid"]}"; //这里添加了自动加上FME，这样在小程序中只要登记数字就行

$fmcinfo->fmcname = $row["fmcname"];

$fmcinfo->fmcphone = $row["fmcphone"];

$fmcinfo->fmcnickname = $row["fmcnickname"];

$fmcinfo->useravatar = $row["useravatar"];

//这里通过读取到的fmcid和fmcname进行判断，通过另一个员工清单表格，读取当前用户的对应的用户类别权限

$loginSql = <<<login

select * from fmc_staff where fmcid="FME{$row["fmcid"]}" and fmcname = "{$row["fmcname"]}";

$res = mysqli_query($con, $loginSql);

if($rows = mysqli_fetch_array($res)){

$fmcinfo->usertype=$rows['usertype'];

$fmcinfo->ctcommitee = $rows['ctcommitee'];

$fmcinfo->dormitory = $rows['dormitory'];

//如果读取不到，则显示用户类别为游客，不享有使用微信小程序功能的权利

}else{

$fmcinfo->usertype='游客';

$fmcinfo->ctcommitee = '0';

$fmcinfo->dormitory = '0';

}

$data[]=$fmcinfo;

}

$json = json_encode($data);//把数据转换为JSON数据.

echo "{".'"fmcinfo"'.":".$json."}";

}else{

echo "查询失败";

}

好了，这样就就基本上实现了用户信息展示的功能了，特此记录，以便自己不忘记，也希望能帮助到见到的人，图就不上了，可以看下前面文章中展示的个人中心页。

小程序制作笔记-小程序代码之wx.request

相关推荐

评论抢沙发

最新评论

热门文章

热门标签

网站统计

如果你觉得文章好，请赏1杯速溶咖啡给Sham吧！

微信扫一扫打赏

相关推荐

评论 抢沙发

最新评论

热门文章

热门标签

网站统计

如果你觉得文章好，请赏1杯速溶咖啡给Sham吧！

微信扫一扫打赏

评论抢沙发