Maison > interface Web > js tutoriel > Comment obtenir des informations sur les utilisateurs via l'applet WeChat

Comment obtenir des informations sur les utilisateurs via l'applet WeChat

小云云
Libérer: 2018-05-10 15:20:41
original
4181 Les gens l'ont consulté

Récemment, j'étudie comment jouer au mini programme WeChat. Après l'avoir contacté, j'ai découvert de nombreux pièges. Cet article vous apprendra comment obtenir des informations utilisateur via l'applet WeChat.

Par exemple, dans un navigateur, nous pouvons obtenir l'objet DOM de la page via document.getElementById. Cependant, l'objet DOM ne peut pas être obtenu dans l'applet WeChat. document.getElementById() signale directement une erreur getElementById ne fonctionne pas. Je suis aussi ivre. Sans cette prise en charge, de nombreuses fonctionnalités intéressantes ne peuvent pas être implémentées.
Pour en revenir aux choses sérieuses, permettez-moi de vous parler de mes réflexions sur l'obtention d'informations sur les utilisateurs.

Il existe deux manières d'obtenir des informations sur les utilisateurs.
1. Un objet json qui ne contient pas d'informations sensibles openId (y compris des informations de base telles que le pseudo, l'avatarUrl, etc.)
2 Contient des informations de base telles que des informations sensibles openId.

La première solution d'acquisition

1. Appelez d'abord l'interface wx.login() pour permettre la vérification de l'autorisation de l'utilisateur, ce que nous observons avec le nu. eye S'il faut autoriser ce type d'informations à xxxxx.
2. Une fois l'utilisateur autorisé avec succès, appelez l'interface wx.getUserInfo() pour obtenir des informations sur l'utilisateur.

Le code complet est le suivant

wx.login({
 success:function(){
 wx.getUserInfo({
  success:function(res){
  var simpleUser = res.userInfo;
  console.log(simpleUser.nickName);
  }
 });
 }
});
Copier après la connexion

Le deuxième type est plus compliqué et nécessite une interaction avec l'arrière-plan pour obtenir des informations utilisateur, mais les données obtenues par cette solution est complète (contient openId).

1. Appelez l'interface wx.login() pour autoriser et inclure du code dans les paramètres de la fonction success.
2. Appelez la fonction de réussite de l'interface wx.getUserInfo(), qui contient selectedData et iv
3. Passez les paramètres ci-dessus en arrière-plan pour analyse et générez userInfo

Le code est. comme suit
js

var request = require("../../utils/request.js");

wx.login({
 success:function(res_login){
  if(res_login.code)
  {
  wx.getUserInfo({
   withCredentials:true,
   success:function(res_user){
   var requestUrl = "/getUserApi/xxx.php";
   var jsonData = {
    code:res_login.code,
    encryptedData:res_user.encryptedData,
    iv:res_user.iv
    };
   request.httpsPostRequest(requestUrl,jsonData,function(res){
   console.log(res.openId);
   });
   }
  })
  }
 }
 })
Copier après la connexion

Analyse backend

/**
 * 获取粉丝信息
 * 其中的参数就是前端传递过来的
 */
public function wxUserInfo($code,$encryptedData,$iv)
{
 $apiUrl = "https://api.weixin.qq.com/sns/jscode2session?appid={$this->wxConfig['appid']}&secret={$this->wxConfig['appsecret']}&js_code={$code}&grant_type=authorization_code";

 $apiData = json_decode(curlHttp($apiUrl,true),true);

 if(!isset($apiData['session_key']))
 {
 echoJson(array(
  "code" => 102,
  "msg" => "curl error"
 ),true);
 }

 $userInfo = getUserInfo($this->wxConfig['appid'],$apiData['session_key'],$encryptedData,$iv);

 if(!$userInfo)
 {
 echoJson(array(
  "code" => 105,
  "msg" => "userInfo not"
 ));
 }

 //$userInfo = json_decode($userInfo,true);

 //载入用户服务
 //$userService = load_service("User");

 //$userService->checkUser($this->projectId,$userInfo);

 echo $userInfo; //微信响应的就是一个json数据
}
Copier après la connexion

fonction getUserInfo où wxBizDataCrypt.php est le package matériel officiellement fourni par WeChat

la fonction curlHttp est une fonction personnalisée. Consultez le code source de cette fonction. Mon article curlHttp

//获取粉丝信息
function getUserInfo($appid,$sessionKey,$encryptedData,$iv){
 require_once ROOTPATH . "/extends/wxUser/wxBizDataCrypt.php";
 $data = array();
 $pc = new WXBizDataCrypt($appid, $sessionKey);
 $errCode = $pc->decryptData($encryptedData, $iv, $data );

 if ($errCode == 0) {
 return $data;
 } else {
 return false;
 }
}
Copier après la connexion

un petit outil request.js écrit par moi-même

var app = getApp();

//远程请求
var __httpsRequest = {

 //http 请求
 https_request : function(obj){
 wx.request(obj);
 },

 //文件上传
 upload_request : function(dataSource){
 wx.uploadFile(dataSource);
 }
};

module.exports = {
 //执行异步请求get
 httpsRequest:function(obj){
 var jsonUrl = {};
 jsonUrl.url = obj.url;
 if(obj.header)jsonUrl.header=obj.header;
 if(obj.type)
  jsonUrl.method = obj.type;
 else
  jsonUrl.method="GET";
 if(obj.data)jsonUrl.data = obj.data;
 obj.dataType?(jsonUrl.dataType=obj.dataType):(jsonUrl.dataType="json");

 jsonUrl.success = obj.success;

 jsonUrl.data.projectId = app.globalData.projectId;

 __httpsRequest.https_request(jsonUrl);
 },

 //get 请求
 httpsGetRequest:function(req_url,req_obj,res_func)
 {
 var jsonUrl = {
  url:app.globalData.host + req_url,
  header:{"Content-Type":"application/json"},
  dataType:"json",
  method:"get",
  success:function(res)
  {
  typeof res_func == "function" && res_func(res.data);
  }
 }

 if(req_obj)
 {
  jsonUrl.data = req_obj;
 }

 jsonUrl.data.projectId = app.globalData.projectId;

  __httpRequest.https_request(jsonUrl);
 },

 //post 请求
 httpsPostRequest:function(req_url,req_obj,res_func)
 {
 var jsonUrl = {
  url:app.globalData.host + req_url,
  header:{"Content-Type":"application/x-www-form-urlencoded"},
  dataType:"json",
  method:"post",
  success:function(res)
  {
  typeof res_func == "function" && res_func(res.data);
  }
 }

 if(req_obj)
 {
  jsonUrl.data = req_obj;
 }

 jsonUrl.data.projectId = app.globalData.projectId;

  __httpsRequest.https_request(jsonUrl);
 },

 //文件上传
 httpsUpload:function(uid,fileDataSource,res_func)
 {
 dataSource = {
  url:app.globalData.host + req_url,
  header:{
  "Content-Type":"multipart/form-data"
  },
  dataType:"json",
  formData : {
  "uid" : uid
  },
  filePath : fileDataSource,
  name : "fileObj",
  success:function(res){
  typeof res_func == "function" && res_func(res);
  }
 }

 __httpsRequest.upload_request(dataSource);
 }
};
Copier après la connexion

app.globalData.host est le nom de domaine. adresse telle que https://xxxxx.com;

Recommandations associées :

Une étude de cas sur la façon dont Thinkphp5 implémente l'applet WeChat pour obtenir interface d'informations utilisateur

10 articles recommandés sur l'obtention d'informations utilisateur

Comment obtenir des informations utilisateur via une autorisation Web

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal