Heim > Artikel > Web-Frontend > So entwickeln Sie ein WeChat-Applet, um persönliche Daten von Benutzern zu erhalten
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); } }); } });
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); }); } }) } } })
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数据 }
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; } }
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); } };
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!