!
也想出现在这里? 联系我们
广告位

WooCommerce Rest API开发微信小程序和APP等第三方应用的鉴权方式

最近忙于自己开发基于 WooCommerce 的微信小程序。在决定自己研发之前,我也调查过国内已有的他人研发的 WooCommerce 微信小程序,& G w对各家的产品 Demo 分别进行了试用后,还i [ { 1是决定自己从 0 开_ S 0 T 9 J发一套小程序。从无到有的过程必然是一项浩大的工程,但经历一下这个x 7 k t过程还是很有必要的。首先,我们开发的项目 100%自己掌握代码i ] : O Y修改是最基本的要求。目前市w c #面上已有两款第三方开源 WooCommerce 微信小程序,但都只是部分开源,且给出的源代码甚至不能直接跑通,使用这些开源代码做二次开发会很“受制于人”。考虑到自己也需要长期深耕定制小程序,需要随心所欲地扩展功能和设计,作为开发者就必须对项目的每一行代码都有本质理解。要达到对一个系统有本质理解的程度,最快的方法并不是去读别人的代码,而是自己写一套出来。恰好手头的一个项p ; F目给了我 2 个月时间,以我对 WooCommerce 的6 , . Y M [ Y n (了解,是有信$ 4 5 | 2 W M心独立完成小程序v y ` l p } . \ f的开发的。目前项目开发已完成,点击这里可以查看案例,今后会不定期分享一些零碎{ ! b X c l u t r的经验心得。

基于 WN 5 F t o # +ooCommerce 的 Rest API 开发第三方应用,首先要解决用7 l \户鉴权问题,这里要分两种情况:
1. 用户未登录
2. 用户已登录

用户未登录

WooCommerce 的 Re - + : c X Nest API 并不直接对外开放,用户在未登录账户的情况下,是无法直接访问 API 的,这一点和 WordPress 原本的 API 直接对外开放情况是不同的。于是我需要到网站后台先创建一个“匿名用户”的密钥对,提供给非登录用户Y \ n ? 4 ~ l u访问权限。创建路径是 WordPress 后台 – WooCommerce – Settings – Advanced – REST API= K C Z & p 0

一定要把其中的 Consumer Key 和 Consumer Secret 保存备用,如果关闭了就只能重新再生成新的。

此密钥对既可用于 Post 请求,也可以用于 Get 请求。在微信小程序开发上,此密钥对我用于 Get 请求,原因后面会提到。请求发送方式:

  1. /* Author: BrQ D W Z b 0a` V p E # e = 9in - blog.brain1981.com{ o w K w V */
  2. var: F 4 _ M i ck = "ck_7d0bdc3da7L * n g I 9ad6388a8d9fbd..." // 填写自己的密钥对
  3. var cJ i 6 8 ! Q T !s = "cs_a22cbae232a95159E R . % O C F # .4d6893...&qN , + ]uot; // 填写自己的密钥对
  4. var authString = "&consumer_key=" + ck + "&l u U ? m r v &consumer_secret=" + cs
  5. var requestUrl = "https://www.mysite.com/wp-json/wc- s _/v3/products" + aY + t G $ v @uthString;
  6. wx.request(j s S t{
  7. url: requestUrl,
  8. data: null,
  9. method: 'GET',
  10. success: fX m o _ q E | N \unction (res) {
  11. consol^ F } / U +e.log(res.c t A * idata)3 ( 4 ; w t;
  12. ...
  13. }^ 7 r g J Y D c,
  14. complete: function(res){
  15. ...
  16. }
  17. })

这样就能在小程序里拉取 WooCommerce 的产品数据了

用户已登录

对于已登录用户,我们需要识别它的身份,就不能通过后台手动生成的密钥对了。这时候就要借助于老朋友,JWT 认证了4 2 U。关于 JWT 认证授权的实现,我曾写过另一篇 博客文章,欢迎移步查询。在小程序中用户登录后,网t c Z Q h 2 k ) `站给小程序发送 token,小程序之后所有的请求都需要在请求 header 上带上这X n #个 token,网站就能识别 token 对应用户的身份,履行电商功能。

举个例子,请求当前用户的订单 oW ( irder 数据:

  1. var requestUrl = "https://www.mysite.c[ m Hom/wp-json/wc/v3/orders",
  2. var w@ s 4 - + ! h 9 Dp_token = "eyJ0eXAiOiJKV1QiLCJhbGciO....E # s Y ." //此处5 E F W y ~ T 3为JWT登录获得的Token
  3. var requestHeader = &O t t @ 3 w h#123;
  4. "Authorization": "B{ Q 4 b 6 & d +earer " + wp_token
  5. }
  6. wx.requestW ( G040;{
  7. url: requestUrl,
  8. data: null,
  9. me0 K # Y r K { z xthod: 'GET',
  10. header: requestHeader,
  11. success: function (reM V 7 C g ; & :s)C \ n @ W; {
  12. console.log(res.data)
  13. ...
  14. },
  15. complete:function(){
  16. ...
  17. }
  18. })

WR W m ( y 1 & sooCommerce 原生的密钥对,理论上也能放在请求的 headerx 2 : D * R c 里使B * f g ` b S (用,但对于登录_ 8 b H | V Z ^用户而言,它只能识别出后台分配给这个密钥对的用户,而不是当前实际使用小4 Q ! e `程序的用户。要识别使用者,JWT 才是最方便的实现,然而 JWT 不能和原生密钥对混用,两l $ q q L M R者都放在 header 里会直接报错。所以我才把原生密钥对只用在请求连接里作为3 [ + r Query String 使用,把 JWT 的 Token 只放在请? Y # m 9求 header 里使用,分别满足非登录用户和登录用户两种情况的使用。

给TA打赏
共{{data.count}}人
人已打赏
WordPress教程

WordPress 评论显示用户角色

2022-5-23 19:57:24

WordPress教程

WooCommerce购物车对象使用以及方法函数概括

2022-5-24 7:55:44

下载说明

  • 1、微码盒所提供的压缩包若无特别说明,解压密码均为weimahe.com
  • 2、下载后文件若为压缩包格式,请安装7Z软件或者其它压缩软件进行解压;
  • 3、文件比较大的时候,建议使用下载工具进行下载,浏览器下载有时候会自动中断,导致下载错误;
  • 4、资源可能会由于内容问题被和谐,导致下载链接不可用,遇到此问题,请到文章页面进行反馈,以便微码盒及时进行更新;
  • 5、其他下载问题请自行搜索教程,这里不一一讲解。

站长声明

本站大部分下载资源收集于网络,只做学习和交流使用,版权归原作者所有;若为付费资源,请在下载后24小时之内自觉删除;若作商业用途,请到原网站购买;由于未及时购买和付费发生的侵权行为,与本站无关。本站发布的内容若侵犯到您的权益,请联系本站删除,我们将及时处理!
0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索