H5W3
当前位置:H5W3 > JavaScript > React > 正文

【React】API 接口鉴权设计

已经开发好了一套 RESTful API 接口,方便PC端和APP端调用,只进行了 session 认证,每次调用 API 都会检查当前 session 中是否存在 uid,也就是判断是否已经有用户登录了,这样可以防止未登录的用户调用API接口,但这样设计肯定有问题,所以我想用 token 方式认证,类似于 github 的 token 认证,在调用 API 时携带 token 进行认证,这样不需要用户登录也可以对用户进行鉴权认证。

想法虽然很好,但遇到了一个问题,我的这套 API 接口不仅提供给其他开发者使用,我自己网站也在使用,比如主页显示所有用户,api 为 http://api.example.com/users, 我会在前端用 fetch 请求 http://api.example.com/users,得到返回值后在主页显示所有用户信息。如果我使用 token 认证,那 http://api.example.com/users 这个 API 地址也要加上 token,但这又是网站使用,并非第三方开发者使用,那这个 token 用谁的呢,肯定不能用某个开发者的,那就只能用一个公共的 token,但一旦在PC端API请求时加上了这个公共 token,只要打开开发者工具这个 token 就人尽皆知了,也就失去了认证的意义了。

我看了 github 的做法,他的前台页面数据读取都没有使用 api 接口获取数据,而是直接返回一个页面的,包含html和css,比如读取我的 star 项目,github 请求的 url 是 https://github.com/joyran?pag…,而如果用 api 获取数据则为 https://api.github.com/users/…,api 只返回数据,而上面那个地址返回完整页面。这样用户即使知道了这个地址 https://github.com/joyran?pag…,但苦于返回的是完整页面,只能通过正则表达式或者其它方法提取出自己想要的数据,增加了难度。这种方法对于我而已一个不好的地方是要写两套接口,一个是API只返回数据,另外一个返回完整页面,但是我的前台是React + Redux 开发的,所有的数据请求都是 fetch API接口,然后更新 store 从而更新页面视图,如果fetch返回的数据是一个完整页面,我无法更新 store。

还看了下知乎的设计,改版后的知乎也是基于React + Redux开发的,前台数据的获取也是通过请求API然后更新store的,知乎的API在请求时没有认证,可以任意使用,比如 https://www.zhihu.com/api/v4/… 读取前端话题下的讨论,这种方式API就没有认证了,所有人都可以使用。

所以问题来了,知乎那样设计是不是因为你本来就可以在PC端任意浏览话题下的讨论,我没有必要限制你API访问,毕竟你不用API不用鉴权也可以看到话题下的讨论,但是知乎用这种方式很容易让它的API,而且由于API没有认证和访问限制,第三方开发者可以利用这个API开发一些知乎第三方应用了。

我的需求是自己和第三方开发者以及移动APP或者微信小程序等公用一套API接口,第三方开发者在PC端使用开发者工具分析出API接口后想要调用必须申请token才能访问,应该怎么设计,谢谢。

回答

看了你的需求,目前我们app就是这么干的,所有api必须申请token之后才能访问。对单个客户端来说,token 20分钟换一次,每一个设备对应一个token。如果是app,那么直接用设备号,如果是web,那么直接生成随机数存放localstorage当成设备号来用。这样的话设备和token就一一对应了。token放在memcache,顺便隐射一些常用用户数据,比如id、账号等,超时机制使用memache自带的。20分钟后,客户端必须使用refreshToken再次刷新token。目前我们app近100万用户,单台服务器token管理毫无压力。

既然网页都可以公开访问的数据,第三方就没有必要加鉴权了吧

为啥不加一个服务层,你pc h5 第三方相当于客户端

本文地址:H5W3 » 【React】API 接口鉴权设计

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址