Maison > interface Web > js tutoriel > Comment développer une applet WeChat pour obtenir les informations personnelles des utilisateurs

Comment développer une applet WeChat pour obtenir les informations personnelles des utilisateurs

php中世界最好的语言
Libérer: 2018-03-23 10:13:45
original
6070 Les gens l'ont consulté

Cette fois, je vais vous montrer comment développer une applet WeChat pour obtenir les informations personnelles des utilisateurs. Quelles sont les précautions lors du développement d'une applet WeChat pour obtenir les informations personnelles des utilisateurs. Voici des cas pratiques, voyons. jetez un oeil.

Récemment, j'étudie comment jouer aux mini-programmes WeChat. Après l'avoir contacté, j'ai découvert de nombreux pièges.

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 à l'œil nu. êtes-vous sûr de xxxxx ? Autorisez cette information.
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 complet (y compris openId).

1. Appelez l'interface wx.login() pour autorisation. Le paramètre de la fonction success contient du code.
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 le suivant
2. 🎜>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 de fond

/**
 * 获取粉丝信息
 * 其中的参数就是前端传递过来的
 */
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 Parmi eux, wxBizDataCrypt.php est le package matériel officiellement fourni par WeChat

la fonction curlHttp est une fonction personnalisée Pour le code source de cette fonction, consultez mon code source ici Cet 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

Écrivez votre propre petit outil request.js

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

Je crois que vous maîtrisez. la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention à d'autres sujets connexes sur l'article du site Web PHP chinois !

Lecture recommandée :

Comment gérer l'affichage incomplet des pages en mode de compatibilité du navigateur 360

CSS3 pour implémenter l'inclinaison et Effet d'animation de rotation

L'espacement par défaut des éléments de bloc en ligne est effacé

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