ts 接口请求,如何去定义返回 data 的数据类型

2021-03-03 16:41:50 +08:00
 estarsyang1

重所周知,ts 不是运行时能够检查数据类型的,那么如何去检查接口返回的类型。

api.then(res: responseType =>{
    // 如何去定义这个 responseType
})

查阅了一些资料,目前业内有专门的库和用 JSON 来校验。两个都有一定的学习成本。有没有更好的方案。 Check API response data with interface in Typescript Angular
掌握甩锅技术: Typescript 运行时数据校验

2587 次点击
所在节点    问与答
19 条回复
cloudzqy
2021-03-03 16:53:56 +08:00
熟悉 react 的话,直接用 prop-types 来检验?这个学习成本最小了。
shelter07
2021-03-03 17:02:55 +08:00
直接让 java 老哥把他定义的类发给你一份,抄一下,可行否,目前项目里用的 swagger 跟 pont,
renmu123
2021-03-03 17:26:28 +08:00
你是要检查数据的合法性还是仅仅写代码的时候编辑器有个提示,这两种需求不一致
estarsyang1
2021-03-03 18:41:51 +08:00
@cloudzqy 对 react 不太熟。第一次项目在 vue 上跑的。有点痛苦
estarsyang1
2021-03-03 18:42:44 +08:00
@shelter07 没法检测类型是否正确....只是定义了
estarsyang1
2021-03-03 18:43:11 +08:00
@renmu123 检查数据结构是否符合要求。
lcwylxx921
2021-03-03 19:12:31 +08:00
可以看下 TS 对 Assertion Function 的支持
xarthur
2021-03-03 19:16:57 +08:00
我记得 TS 现在已经有了可以在运行时把 string 之类的东西转换成一个类型的功能,叫做 Template Literal Types,不知道能不能满足你的要求。
https://www.typescriptlang.org/docs/handbook/2/template-literal-types.html
我对 TS 也不是很熟(
momocraft
2021-03-03 19:21:55 +08:00
IIRC template literal 也是纯编译时的
momocraft
2021-03-03 19:23:19 +08:00
应该没有 0 成本的方法
至于谁出这个成本,你可以让上游提供 openapi spec 等能生成 TS 类型的东西
SilencerL
2021-03-03 19:50:52 +08:00
这个命题我个人感觉在开发中没有实际意义,你在 response 回调中定义了类型了,那么就是默认信任接口返回的就是你所定义的类型。
也就是说接口返回的类型结构你要提前知道并且定义相应的 ts 类型,如果有多种返回值类型那就用联合类型;甚至说如果你实在不知道用什么类型那就用 any 。
如果实在要判断返回值是否是给定的某个类型,可以试试 https://www.npmjs.com/package/typescript-is
ciaoly
2021-03-03 23:54:30 +08:00
在 resolve 的回调函数里直接指定参数类型不行吗?引用的时候再做数据完整性校验,或者 Object.assign,或者??=。
Sparetire
2021-03-04 08:42:24 +08:00
前后端都用 JSON Schema 滤一遍,但是没必要,特别是前端,通常一个检验 schema 的库增加打包体积也不少了

接口规范定好后,类型不对直接甩锅后端,最多自己再做点防御性处理

序列化后类型丢失这也不是 TS 的问题,虽说 TS 不检查运行时类型,但是即便检查了,序列化该丢还是得丢,这种事情你给 Java 错误的 JSON 他运行时也得错

唯一的区别是 TS/JS 他不会在接口返回处 crash,但是如果你不是写的 Anyscript,那只要出现运行时类型错了直接看接口返回就完事了,TS 已经帮你把错误范围限定在这了
estarsyang1
2021-03-11 11:39:08 +08:00
@lcwylxx921 最近一直子忙,都没时间看。谢谢大佬
estarsyang1
2021-03-11 11:39:20 +08:00
@xarthur 我去看看
estarsyang1
2021-03-11 11:39:47 +08:00
@momocraft 我去喵喵,有点头疼,准备上线
estarsyang1
2021-03-11 11:40:20 +08:00
@SilencerL 谢谢大佬。目前采取的是 any 了。吐了
estarsyang1
2021-03-11 11:41:22 +08:00
@ciaoly 好像也是一种思路。相当于使用时再去校验,貌似没啥问题。
estarsyang1
2021-03-11 11:42:48 +08:00
@Sparetire 谢谢大佬,之前想检验一下类型的返回,却忘记了体积的问题。总的来说,感觉是一个投入大,回报小的事情

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/758082

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX