Heim > Web-Frontend > js-Tutorial > So entwickeln Sie ein WeChat-Applet, um persönliche Daten von Benutzern zu erhalten

So entwickeln Sie ein WeChat-Applet, um persönliche Daten von Benutzern zu erhalten

php中世界最好的语言
Freigeben: 2018-03-23 10:13:45
Original
6071 Leute haben es durchsucht

Dieses Mal zeige ich Ihnen, wie Sie ein WeChat-Applet entwickeln, um die persönlichen Daten der Benutzer zu erhalten. Was sind die Vorsichtsmaßnahmen bei der Entwicklung eines WeChat-Applets, um die persönlichen Informationen der Benutzer zu erhalten? Schauen Sie mal rein.

Vor kurzem lerne ich, wie man WeChat-Miniprogramme spielt. Nachdem ich Kontakt aufgenommen hatte, entdeckte ich viele Fallstricke.

Zum Beispiel können wir in einem Browser das DOM-Objekt der Seite über document.getElementById abrufen. Das DOM-Objekt kann jedoch nicht im WeChat-Applet abgerufen werden. document.getElementById() meldet direkt einen Fehler, getElementById funktioniert nicht. Ich bin auch betrunken. Ohne diese Unterstützung sind viele interessante Features nicht umsetzbar.
Zurück zum Geschäftlichen: Lassen Sie mich über meine Gedanken zum Erhalt von Benutzerinformationen sprechen.

Es gibt zwei Möglichkeiten, Benutzerinformationen zu erhalten.
1. Ein JSON-Objekt, das keine vertraulichen Informationen openId enthält (einschließlich grundlegender Informationen wie Spitzname, Avatar-Url usw.)
2. Enthält grundlegende Informationen wie vertrauliche Informationen openId.

Die erste Erfassungslösung

1. Rufen Sie zuerst die Schnittstelle wx.login() auf, um die Überprüfung der Benutzerberechtigung zu ermöglichen Sind Sie sich bei xxxxx sicher? Autorisieren Sie diese Informationen.
2. Rufen Sie nach erfolgreicher Autorisierung des Benutzers die Schnittstelle wx.getUserInfo() auf, um Benutzerinformationen abzurufen.

Der vollständige Code lautet wie folgt

wx.login({
 success:function(){
 wx.getUserInfo({
  success:function(res){
  var simpleUser = res.userInfo;
  console.log(simpleUser.nickName);
  }
 });
 }
});
Nach dem Login kopieren

Die zweite Art ist komplizierter und erfordert eine Interaktion mit dem Hintergrund, um Benutzerinformationen zu erhalten, aber die durch diese Lösung erhaltenen Daten ist vollständig (einschließlich openId).

1. Rufen Sie die wx.login()-Schnittstelle zur Autorisierung auf. Der Parameter der Erfolgsfunktion enthält Code.
2. Rufen Sie die Erfolgsfunktion wx.getUserInfo() auf, die verschlüsselte Daten und iv enthält.
3. Übergeben Sie die oben genannten Parameter zur Analyse an den Hintergrund und generieren Sie userInfo

Der Code lautet wie folgt
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);
   });
   }
  })
  }
 }
 })
Nach dem Login kopieren

Hintergrundanalyse

/**
 * 获取粉丝信息
 * 其中的参数就是前端传递过来的
 */
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数据
}
Nach dem Login kopieren

getUserInfo-Funktion Unter diesen ist wxBizDataCrypt.php das offiziell von WeChat bereitgestellte Materialpaket

curlHttp-Funktion ist eine benutzerdefinierte Funktion Den Quellcode dieser Funktion finden Sie in meinem Quellcode hier. Dieser Artikel: 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;
 }
}
Nach dem Login kopieren

Schreiben Sie Ihr eigenes kleines Tool 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);
 }
};
Nach dem Login kopieren

Ich glaube, Sie haben es gemeistert Die Methode nach dem Lesen des Falles in diesem Artikel finden Sie in anderen verwandten Themen im Artikel zur chinesischen PHP-Website.

Empfohlene Lektüre:

Wie man mit unvollständiger Seitenanzeige im 360-Browser-Kompatibilitätsmodus umgeht

CSS3 zur Implementierung von Tilt und Rotationsanimationseffekt

Standardabstand des Inline-Block-Elements wird gelöscht

Das obige ist der detaillierte Inhalt vonSo entwickeln Sie ein WeChat-Applet, um persönliche Daten von Benutzern zu erhalten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage