Go+gRPC-Gateway(V2) 微服务实战,小程序登录鉴权服务(六):客户端基础库 TS 实战

本文涉及的产品
注册配置 MSE Nacos/ZooKeeper,118元/月
服务治理 MSE Sentinel/OpenSergo,Agent数量 不受限
云原生网关 MSE Higress,422元/月
简介: Go+gRPC-Gateway(V2) 微服务实战,小程序登录鉴权服务(六):客户端基础库 TS 实战

前端底层初步搭建(SDK)



新建 client/miniprogram/service/sdk.ts 文件,来初步搭建一下我们前端的底层公共设施。

定义一个 SDK na

mespace


export namespace SDK {
}


定义相关常量 & Interface


const serverAddr = 'http://localhost:8080'
const AUTH_ERR= 'AUTH_ERR'
const authData = {
    token: '',
    expiryMs: 0
}
interface RequestOption<REQ, RES> {
    method: 'GET'|'PUT'|'POST'|'DELETE'
    path: string
    data: REQ
    respMarshaller: (r: object)=>RES
}
interface AuthOption {
    attachAuthHeader: boolean
    retryOnAuthError: boolean
}


这里主要根据当前需求,做了如下事情:


  • 抽出服务器地址 serverAddr
  • 定义一个授权失败 401 ❌常量
  • token 相关暂时存到内存中
  • 定义客户端 wx.request 所必须的参数类型
  • 控制授权请求相关逻辑(是否附加 Auth Header & 重试等)


wx.login 改写成 Promise 形式


export function wxLogin(): Promise<WechatMiniprogram.LoginSuccessCallbackResult> {
        return new Promise((resolve, reject) => {
            wx.login({
                success: resolve,
                fail: reject,
            })
        })
    }


请求公共逻辑 wx.request 编写


export function sendRequest<REQ, RES>(o: RequestOption<REQ, RES>, a: AuthOption): Promise<RES> {
        const authOpt = a || {
            attachAuthHeader: true,
        }
        return new Promise((resolve, reject) => {
            const header: Record<string, any> = {}
            if (authOpt.attachAuthHeader) {
                if (authData.token && authData.expiryMs >= Date.now()) {
                    header.authorization = 'Bearer '+ authData.token
                } else {
                    reject(AUTH_ERR)
                    return
                }
            }
            wx.request({
                url: serverAddr + o.path,
                method: o.method,
                data: o.data,
                header,
                success: res => {
                    if(res.statusCode === 401) {
                        reject(AUTH_ERR)
                    } else if (res.statusCode >= 400) {
                        reject(res)
                    } else {
                        resolve(
                            o.respMarshaller(
                                camelcaseKeys(res.data as object, { deep: true }),
                            )
                        )
                    }
                },
                fail: reject
            })
        })
    }


登录模块(login)编写


export async function login() {
    if (authData.token && authData.expiryMs >= Date.now()) {
        return 
    }
    const wxResp = await wxLogin()
    const reqTimeMs = Date.now()
    const resp = await sendRequest<auth.v1.ILoginRequest, auth.v1.ILoginResponse>({
        method: "POST",
        path: "/v1/auth/login",
        data: {
            code: wxResp.code,
        },
        respMarshaller: auth.v1.LoginResponse.fromObject
    }, {
        attachAuthHeader: false, 
        retryOnAuthError: false,
    })
    authData.token = resp.accessToken!
    authData.expiryMs = reqTimeMs + resp.expiresIn! * 1000
}


业务请求自动重试模块编写


export async function sendRequestWithAuthRetry<REQ, RES>(o: RequestOption<REQ, RES>, a?: AuthOption): Promise<RES> {
    const authOpt = a || {
        attachAuthHeader: true,
        retryOnAuthError: true,
    }
    try {
        await login()
        return sendRequest(o, authOpt)
    } catch(err) {
        if(err === AUTH_ERR && authOpt.retryOnAuthError) {
            authData.token = ''
            authData.expiryMs = 0
            return sendRequestWithAuthRetry(o, {
                attachAuthHeader: authOpt.attachAuthHeader,
                retryOnAuthError: false
            })
        } else {
            throw err
        }
    }
}


Todo Service



客户端具体服务层,这里是 Todo 这个服务。

我们新建一个文件控制客户端相关逻辑:client/miniprogram/service/todo.ts


创建一个 Todo


export namespace TodoService {
    export function CreateTodo(req: todo.v1.ICreateTodoRequest): Promise<todo.v1.ICreateTodoResponse>{
        return SDK.sendRequestWithAuthRetry({
            method: "POST",
            path: "/v1/todo",
            data: req,
            respMarshaller: todo.v1.CreateTodoResponse.fromObject
        })
    }
}


相关文章
|
22天前
|
Shell Go API
Go语言grequests库并发请求的实战案例
Go语言grequests库并发请求的实战案例
|
2月前
|
Rust 安全 算法
Go标准库的新 math/rand
Go标准库的新 math/rand
|
2月前
|
JSON 中间件 Go
go语言后端开发学习(四) —— 在go项目中使用Zap日志库
本文详细介绍了如何在Go项目中集成并配置Zap日志库。首先通过`go get -u go.uber.org/zap`命令安装Zap,接着展示了`Logger`与`Sugared Logger`两种日志记录器的基本用法。随后深入探讨了Zap的高级配置,包括如何将日志输出至文件、调整时间格式、记录调用者信息以及日志分割等。最后,文章演示了如何在gin框架中集成Zap,通过自定义中间件实现了日志记录和异常恢复功能。通过这些步骤,读者可以掌握Zap在实际项目中的应用与定制方法
go语言后端开发学习(四) —— 在go项目中使用Zap日志库
|
2月前
|
Java API 微服务
服务网关Gateway
该博客文章详细介绍了Spring Cloud Gateway的使用方法和概念。文章首先阐述了API网关在微服务架构中的重要性,解释了客户端直接与微服务通信可能带来的问题。接着,文章通过具体的示例代码,展示了如何在Spring Cloud Gateway中添加依赖、编写路由规则,并对路由规则中的基本概念如Route、Predicate和Filter进行了详细解释。最后,文章还提供了路由规则的测试方法。
服务网关Gateway
|
2月前
|
存储 JSON 前端开发
一文搞懂 Go 1.21 的日志标准库 - slog
一文搞懂 Go 1.21 的日志标准库 - slog
64 2
|
2月前
|
小程序 安全 Java
|
2月前
|
存储 小程序 JavaScript
|
2月前
|
Prometheus Cloud Native Go
Go 1.22 标准库 slices 新增函数和一些旧函数增加新特性
Go 1.22 标准库 slices 新增函数和一些旧函数增加新特性
|
2月前
|
测试技术 编译器 Go
依赖注入与控制反转:优化Go语言REST API客户端
依赖注入与控制反转:优化Go语言REST API客户端