ในการพัฒนา WeChat มักจะมีความต้องการเช่นนี้: รับอวตารของผู้ใช้, ผูกบัญชี WeChat เพื่อส่งข้อความไปยังผู้ใช้ ... จากนั้นข้อกำหนดเบื้องต้นสำหรับการบรรลุสิ่งเหล่านี้คือการอนุญาต!
1. กำหนดค่าชื่อโดเมนการโทรกลับที่ปลอดภัย:
ก่อนที่จะขอการอนุญาตจากหน้าเว็บผู้ใช้โดยบัญชีสาธารณะ WeChat นักพัฒนาจำเป็นต้องไปที่ตัวเลือกการกำหนดค่าของ "การพัฒนา - สิทธิ์การเชื่อมต่อ - บริการเว็บ - บัญชีเว็บ - การอนุญาตเว็บเพื่อรับข้อมูลพื้นฐานของผู้ใช้" ในเว็บไซต์ทางการของแพลตฟอร์มสาธารณะเพื่อแก้ไขชื่อโดเมนการเรียกคืนการอนุญาต เป็นที่น่าสังเกตว่านี่คือการเขียนชื่อโดเมนทั้งหมดโดยตรงเช่น: www.liliangel.cn อย่างไรก็ตามในการพัฒนา H5 ของเราโดยทั่วไปเราใช้ชื่อโดเมนรองเช่น: h5.liliangel.cn ซึ่งอยู่ในชื่อโดเมนการโทรกลับที่ปลอดภัย
2. การอนุญาตระดับผู้ใช้และการอนุญาตอย่างเงียบ ๆ
1. การอนุญาตเว็บเพจที่ริเริ่มโดย SNSAPI_BASE ใช้เพื่อรับ OpenID ของผู้ใช้ที่เข้าสู่หน้าและได้รับอนุญาตอย่างเงียบ ๆ และกระโดดไปยังหน้าโทรกลับโดยอัตโนมัติ สิ่งที่ผู้ใช้รับรู้คือเขาเข้าสู่หน้าโทรกลับโดยตรง
2. การอนุญาตเว็บเพจที่ริเริ่มโดย SNSAPI_USERINFO เนื่องจากขอบเขตใช้เพื่อรับข้อมูลผู้ใช้พื้นฐาน อย่างไรก็ตามการอนุญาตนี้ต้องได้รับความยินยอมจากคู่มือผู้ใช้และเนื่องจากผู้ใช้ได้ตกลงกันจึงไม่จำเป็นต้องให้ความสนใจกับมันและข้อมูลพื้นฐานของผู้ใช้สามารถรับได้หลังจากได้รับอนุญาต
3. ความแตกต่างระหว่างการอนุญาตเว็บ access_token และ access_token ทั่วไป
1. การอนุญาตเว็บเพจ WeChat ถูกนำไปใช้ผ่านกลไก OAuth2.0 หลังจากผู้ใช้อนุญาตให้บัญชีอย่างเป็นทางการบัญชีอย่างเป็นทางการสามารถรับข้อมูลรับรองการโทรแบบอินเทอร์เฟซ การเรียกอินเทอร์เฟซการอนุญาตสามารถทำได้ผ่านการอนุญาตให้ใช้งานหน้าเว็บ access_token เช่นการได้รับข้อมูลพื้นฐานของผู้ใช้
2. สำหรับอินเทอร์เฟซ WeChat อื่น ๆ จำเป็นต้องใช้การโทร access_token ทั่วไปผ่านอินเตอร์เฟส "Get Access_Token" ในการสนับสนุนขั้นพื้นฐาน
4. แนะนำผู้ใช้ไปยังหน้าการอนุญาตเพื่อยอมรับการอนุญาตและรับรหัส
หลังจากอัปเดต WeChat หน้าการอนุญาตก็เปลี่ยนไปเช่นกัน จริงๆแล้วฉันคุ้นเคยกับหน้าสีเขียวคลาสสิก ...
JS:
var center = {init: function () {....... }, enterwxauthor: function () {var wxuserinfo = localstorage.getItem ("wxuserinfo"); if (! wxUserInfo) {var code = common.geturlparameter ('รหัส'); if (รหัส) {Common.getWxuserInfo (); center.init (); } else {// ไม่มีข้อมูลผู้ใช้ weChat ไม่ต้องได้รับอนุญาต ->> จำเป็นต้องได้รับอนุญาตข้ามไปที่หน้าการอนุญาต window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' +'& response_type = code & scope = snsapi_userinfo#wechat_redirect'; }} else {center.init (); }}} $ (เอกสาร) .ready (function () {center.enterwxauthor ();}ใช้ขอบเขต = snsapi_userinfo เป็นตัวอย่าง เมื่อโหลดหน้าเว็บให้ป้อนวิธีการอนุญาต ก่อนอื่นรับวัตถุ WxUserInfo จากแคช หากมีคำอธิบายใด ๆ ให้ป้อนวิธีการเริ่มต้นโดยตรง ถ้าไม่พิจารณาว่า URL มีรหัสหรือไม่ หากมีรหัสนั่นหมายความว่าเป็นหน้าเว็บหลังจากเข้าสู่การเรียกกลับหน้าการอนุญาต จากนั้นแลกเปลี่ยนข้อมูลผู้ใช้ผ่านรหัส ไม่มีรหัสนั่นคือผู้ใช้จะเข้าสู่หน้าเป็นครั้งแรกและนำทางไปยังหน้าการอนุญาต Redirect_uri เป็นที่อยู่หน้าปัจจุบัน
วิธี getwxuserinfo:
/ *** รับข้อมูลพื้นฐานของผู้ใช้หลังจากการอนุญาต*/ getWxUserInfo: ฟังก์ชั่น (par) {var code = common.geturlparameter ("รหัส"); if (par) code = par; $ .ajax ({async: false, data: {code: code}, type: "get", url: wx_root + "wechat/การอนุญาต", ความสำเร็จ: ฟังก์ชั่น (json) {ถ้า (json) {ลอง {// localstorage.setItem ('wxUserInfo', json); // เขียนแคช-ข้อมูลผู้ใช้ weChat}} catch (e) {// todo: จัดการข้อยกเว้น}}}}}); -5. Backend restful- /weChat /การอนุญาต, แลกเปลี่ยนข้อมูลผู้ใช้ตามรหัส
/*** การอนุญาต wechat* รหัส @param หมดอายุหลังจากใช้** @return ข้อมูลพื้นฐานของผู้ใช้* @throws ioexception*/@requestmapping (value = "/การอนุญาต", method = requestmethod.get) การอนุญาตให้ใช้ Void request.Setcharacterencoding ("UTF-8"); Response.Setcharacterencoding ("UTF-8"); PrintWriter out = response.getWriter (); logger.info ("RESTFUL ของพารามิเตอร์การอนุญาตรหัส: {}", รหัส); ลอง {string rs = wechatservice.getoauthaccessToken (รหัส); out.write (rs); logger.info ("การอนุญาตให้ได้รับอนุญาตประสบความสำเร็จ", RS); } catch (exception e) {logger.error ("การอนุญาตให้ได้รับอนุญาตเป็นข้อผิดพลาด", e); } ในที่สุด {out.close (); -มี access_token ที่ได้รับอนุญาตที่นี่ ข้อควรจำ: Access_token ที่ได้รับอนุญาตไม่ใช่ Global Access_token และต้องใช้แคช ฉันใช้ Redis ที่นี่ ฉันจะไม่พูดมากเกี่ยวกับการกำหนดค่าเฉพาะและเขียนโพสต์บล็อกการกำหนดค่าที่เกี่ยวข้องในภายหลัง แน่นอนคุณสามารถใช้ ehcache มีการแนะนำรายละเอียดเกี่ยวกับการกำหนดค่า Ehcahe ในบล็อกแรกของฉัน
/ ** * รับโทเค็นที่ได้รับอนุญาตตามรหัสจะใช้ได้เฉพาะเมื่อได้รับอนุญาตแตกต่างจาก global access_tokens * @param code * @return * @throws ioexception * @throws clientprotocolexception */ สตริงสาธารณะ getoauthaccessToken String rs_access_token = null; สตริง rs_openid = null; string url = wx_oauth_access_token_url+"? appid ="+wx_appid+"& secret ="+wx_appsecret+"& code ="+code+"& grant_type = Authorization_Code"; if (stringUtils.isEmpty (data)) {ซิงโครไนซ์ (นี่) {// หมดอายุสตริง hs = apiservice.doget (url); jsonObject json = jsonObject.parseObject (HS); string refresh_token = json.getString ("refresh_token"); string refresh_url = "https://api.weixin.qq.com/sns/oauth2/refresh_token?appid="+wx_appid+"&grant_type=refresh_token&refresh_token="+refresh_token; String r_hs = apiservice.doget (refresh_url); jsonObject r_json = jsonObject.parseObject (r_hs); String r_access_token = r_json.getString ("access_token"); String r_expires_in = r_json.getString ("expires_in"); rs_openid = r_json.getString ("openId"); rs_access_token = r_access_token; REDISSERVICE.SET ("WEIXIN_SQ_ACCESS_TOKEN", R_ACCESS_TOKEN, Integer.ParseInt (R_EXPIRES_IN) - 3600); logger.info ("SET SQ Access_Token to Redis ประสบความสำเร็จเวลาพารามิเตอร์: {}, เรียลไทม์", Integer.parseint (r_expires_in), Integer.parseint (r_expires_in) - 3600); }} else {// ไม่ใช่สตริงที่หมดอายุ hs = apiservice.doget (url); jsonObject json = jsonObject.parseObject (HS); rs_access_token = json.getString ("access_token"); rs_openid = json.getString ("openId"); logger.info ("รับ sq access_token จาก redis ประสบความสำเร็จ rs_access_token: {}, rs_openid: {}", rs_access_token, rs_openid); } return getoauthuserinfo (rs_access_token, rs_openid); }/** * รับข้อมูลผู้ใช้ตามโทเค็นที่ได้รับอนุญาต * @param access_token * @param OpenId * @return */สตริงสาธารณะ getoauthuserinfo (สตริง access_token, สตริง openId) {string url = "https://api.weixin.qq.com/sns/userinfo +"& lang = zh_cn"; ลอง {string hs = apiservice.doget (url); // บันทึกข้อมูลผู้ใช้ saveWeixinuser (HS); กลับ HS; } catch (ioexception e) {logger.error ("การอนุญาตให้ได้รับอนุญาตเป็นข้อผิดพลาด", e); } return null; -ฉันรีบและการตั้งชื่อรหัสก็ยุ่ง อย่างที่คุณเห็นฉันใช้วิธีการซิงโครไนซ์เพื่อรับคีย์จากแคชเป็น weixin_sq_access_token หากมีการเรียกคืนคำแนะนำฉันจะเรียกอินเทอร์เฟซโดยตรงโดย WeChat ผ่าน HTTPClient และส่งคืนสตริงของข้อมูลผู้ใช้ไปยังส่วนหน้า หากไม่ได้รับการเรียกคืนก็หมายความว่ามันไม่ได้หรือหมดอายุ จากนั้นรีเฟรช access_token ตาม refresh_token และเขียนแคช เนื่องจาก access_token มีระยะเวลาที่ถูกต้องสั้น ๆ ฉันตั้งเวลาการหมดอายุแคชที่นี่เพื่อลดเวลาที่ได้รับจาก WeChat อีกหนึ่งชั่วโมง เมื่อมองย้อนกลับไปที่รหัสฉันพบว่าตรรกะข้างต้นเป็นปัญหาเล็กน้อย การเขียนเช่นนี้จะทำให้การได้มาครั้งแรกหรือแคชล้มเหลวในการรีเฟรช Access_Token สำหรับการได้มาครั้งแรกซึ่งจะไม่ส่งผลกระทบต่อการใช้งานในขณะนี้ ฉันจะทำการเพิ่มประสิทธิภาพและแก้ไขสิ่งที่ต้องทำในภายหลัง
6: บันทึกข้อมูลผู้ใช้
โดยปกติหลังจากการอนุญาตเราจะบันทึกข้อมูลผู้ใช้ไปยังตารางฐานข้อมูลโดยมี OpenID เป็นคีย์หลักเดียวและคีย์ต่างประเทศที่เกี่ยวข้องกับตารางผู้ใช้ของเราเอง ด้วยวิธีนี้ไม่ว่าธุรกิจใดที่เราต้องการดำเนินการในอนาคตหรือทำสถิติข้อมูลการดำเนินงานเรามีความสัมพันธ์กับบัญชีสาธารณะ WeChat เป็นที่น่าสังเกตว่า headimgurl ที่เราได้รับคือที่อยู่ URL ที่จัดทำโดย WeChat เมื่อผู้ใช้แก้ไขอวตารที่อยู่เดิมอาจไม่ถูกต้องดังนั้นจึงเป็นการดีที่สุดที่จะบันทึกภาพไปยังเซิร์ฟเวอร์ท้องถิ่นจากนั้นบันทึก URL ที่อยู่ท้องถิ่น!
ค่าที่ส่งคืนโดย WeChat:
ลิงค์อ้างอิง:
เอกสารอย่างเป็นทางการของแพลตฟอร์มสาธารณะ WeChat: https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421140842&token=&lang=zh_cn
เครื่องมือการดีบักอินเทอร์เฟซออนไลน์: http://mp.weixin.qq.com/debug
ไม่มีผลประโยชน์บัญชีอย่างเป็นทางการ: แอปพลิเคชันบัญชีทดสอบ http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login
ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้ ฉันหวังว่าเนื้อหาของบทความนี้จะช่วยในการศึกษาหรือทำงานของทุกคน ฉันหวังว่าจะสนับสนุน Wulin.com เพิ่มเติม!