一键生成请求方法的工具 —— OpenAPI Typescript Codegen

news2025/1/13 13:53:37

文章目录

  • 用法
  • 自定义请求参数的方法
      • 1)使用代码生成器提供的全局参数修改对象
      • 2)直接定义 axios 请求库的全局参数,比如:全局请求响应拦截器
  • 报错解决

用法

首先下载axios

npm install axios

官网:https://github.com/ferdikoomen/openapi-typescript-codegen

首先安装:

npm install openapi-typescript-codegen --save-dev

–input:指定接口文档的路径、url 或字符串内容(必填)

–output:代码生成的目录

–client:生成的代码所需要使用的请求库

openapi --input ./spec.json --output ./generated --client xhr

image-20240225133608737
首先复制接口文档的路径

image-20240225133912618

完整路径:http://localhost:8121/api/v2/api-docs

实例代码

openapi --input http://localhost:8121/api//v2/api-docs --output ./generated --client axios

执行完成后,在项目根目录中会出现下图目录,可以看见,它直接给我们生成了向后端发请求的函数,当需要使用时,只需要直接调用就好了。
后端把代码写到哪个文件里,生成的请求方法也就会生成到哪个文件里。
在这里插入图片描述

如果接口文档发生了变化,只需要再次执行一次上述指令,就可以重新生成了,非常的方便!


自定义请求参数的方法

1)使用代码生成器提供的全局参数修改对象

https://github.com/ferdikoomen/openapi-typescript-codegen/wiki/OpenAPI-object

按如下图寻找

image-20240225160144294

image-20240225160309555

image-20240225160327610

这个配置对象在generated/core里。其中BASE可以修改请求地址

image-20240225160623676

2)直接定义 axios 请求库的全局参数,比如:全局请求响应拦截器

https://www.axios-http.cn/docs/interceptors

src/plugins/axios.ts

import axios from 'axios'

// 添加请求拦截器
axios.interceptors.request.use(
  function (config) {
    // 在发送请求之前做些什么
    return config
  },
  function (error) {
    // 对请求错误做些什么
    return Promise.reject(error)
  }
)

// 添加响应拦截器
axios.interceptors.response.use(
  function (response) {
    console.log('响应', responses)

    // 2xx 范围内的状态码都会触发该函数。
    // 对响应数据做点什么
    return response
  },
  function (error) {
    // 超出 2xx 范围的状态码都会触发该函数。
    // 对响应错误做点什么
    return Promise.reject(error)
  }
)

在main.ts中引入

import '@/plugins/axios'


报错解决

明明已经执行了安装命令,却还是报错

image-20240225143742140

解决办法

法1:执行以下命令

npx 是一个 Node.js 工具,用于执行安装在项目依赖中的可执行文件。它的作用是在不全局安装的情况下,临时运行项目依赖中的命令。

使用 npx 命令可以避免在全局安装可执行文件时可能出现的版本冲突问题,并且可以确保项目依赖的命令始终是最新版本。

npx openapi-typescript-codegen --input http://localhost:8121/api/v2/api-docs --output ./generated --client axios

法2:全局安装

npm install openapi-typescript-codegen -g

法3:将目录中的 node_modules/.bin 配置到环境变量中去

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1471040.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

数字人的未来:数字人对话系统 Linly-Talker + 克隆语音 GPT-SoVITS

🚀数字人的未来:数字人对话系统 Linly-Talker 克隆语音 GPT-SoVITS https://github.com/Kedreamix/Linly-Talker 2023.12 更新 📆 用户可以上传任意图片进行对话 2024.01 更新 📆 令人兴奋的消息!我现在已经将强…

乡村研学|乡村研学小程序|基于微信小程序的乡村研学平台设计与实现(源码+数据库+文档)

乡村研学小程序目录 目录 基于微信小程序的乡村研学平台设计与实现 一、前言 二、系统功能设计 三、系统实现 1、微信小程序前台 2、管理员后台 (1)乡村研学管理 (2)商品信息管理 (3)商品类型管理 …

全网公开的大模型评测数据集整理

全网公开的大模型评测数据集整理。 开源大模型评测排行榜 https://huggingface.co/spaces/HuggingFaceH4/open_llm_leaderboard 其数据是由其后端lm-evaluation-harness平台提供。 数据集 英文测试 MMLU https://paperswithcode.com/dataset/mmlu MMLU(大规模多…

【力扣 - 有效的括号】

题目描述 给定一个只包括 (,),{,},[,] 的字符串 s ,判断字符串是否有效。 有效字符串需满足: 左括号必须用相同类型的右括号闭合。左括号必须以正确的顺序闭合。每个右括号都有一个对应的相同…

AIGC实战——扩散模型(Diffusion Model)

AIGC实战——扩散模型 0. 前言1. 去噪扩散概率模型1.1 Flowers 数据集1.2 正向扩散过程1.3 重参数化技巧1.4 扩散规划1.5 逆向扩散过程 2. U-Net 去噪模型2.1 U-Net 架构2.2 正弦嵌入2.3 ResidualBlock2.4 DownBlocks 和 UpBlocks 3. 训练扩散模型4. 去噪扩散概率模型的采样5. …

项目实战:Qt监测操作系统cpu温度v1.1.0(支持windows、linux、国产麒麟系统)

若该文为原创文章,转载请注明出处 本文章博客地址:https://hpzwl.blog.csdn.net/article/details/136277231 红胖子(红模仿)的博文大全:开发技术集合(包含Qt实用技术、树莓派、三维、OpenCV、OpenGL、ffmpeg、OSG、单片机、软硬结…

第三节:kafka sarama 遇到Bug?

文章目录 前言一、先上结果二、刨根问底总结 前言 前面两节,我们已经简单应用了sarama的两个类型Client和ClusterAdmin,其中有一个案例是获取集群的ControllerId,但是在后面的测试过程过程中,发现一个问题,返回的Cont…

锂电池SOC估计 | PyTorch实现基于Basisformer模型的锂电池SOC估计

目录 预测效果基本介绍程序设计参考资料 预测效果 基本介绍 PyTorch实现基于Basisformer模型的锂电池SOC估计 锂电池SOC估计,全新【Basisformer】时间序列预测 1.采用自适应监督自监督对比学习方法学习时序特征; 2.通过双向交叉注意力机制计算历史序列和…

Windows系统搭建Elasticsearch引擎结合内网穿透实现远程连接查询数据

文章目录 系统环境1. Windows 安装Elasticsearch2. 本地访问Elasticsearch3. Windows 安装 Cpolar4. 创建Elasticsearch公网访问地址5. 远程访问Elasticsearch6. 设置固定二级子域名 Elasticsearch是一个基于Lucene库的分布式搜索和分析引擎,它提供了一个分布式、多…

国漫年番成趋势?但只有这5部最值得看

自从《斗罗大陆》动画爆火之后,越来越多国漫都开始以年番形式播出,每周都能追自己喜欢的动画也是观众们所期待的。但其实年番对制作公司的要求很高,如果技术跟不上难免出现质量下滑的问题。今天就带大家盘点一下目前在播的最值得看的5部国漫年…

【LeetCode周赛】第 386 场周赛

目录 3046. 分割数组 简单3047. 求交集区域内的最大正方形面积 中等3048. 标记所有下标的最早秒数 I 中等 3046. 分割数组 简单 3046. 分割数组 分析: 查看数组内有没有重复超过2次的数即可。 代码: class Solution { public:bool isPossibleToSplit…

【GPTs分享】GPTs分享之Write For Me

Write For Me 是一个专门定制的GPT版本,旨在为用户提供高质量的文本内容创作服务。它适用于各种写作需求,从商业计划、学术文章到创意故事等。下面是从简介、主要功能、使用案例、优点和局限性几个方面对Write For Me 的详细介绍。 简介 Write For Me …

WPF 开发调试比较:Visual Studio 原生和Snoop调试控制台

文章目录 前言运行环境简单的WPF代码实现一个简单的ListBoxVisual Studio自带代码调试热重置功能测试实时可视化树查找窗口元素显示属性 Snoop调试使用Snoop简单使用调试控制台元素追踪结构树Visual/可视化结构树Logical/本地代码可视化树AutoMation/自动识别结构树 WPF元素控制…

统计学基础不强?参加六西格玛培训班提升学习效果

六西格玛培训是一种在管理学上非常重要的方法论和系统体系,它指导企业进行管理,并代表一种逻辑的、统计的和科学的思维方式。在许多企业中,如GE和霍尼韦尔,六西格玛培训已经成为企业发展战略的重要组成部分,并融入到企…

震惊!事业型男主竟徒手扳断月老搭的三条钢筋!

“月老,看看我啊” “月老我都27了,也帮帮我” 弹幕上满屏飘过“向月老求姻缘”的调侃,而动画里的男主李长寿却视而不见,一心埋头干事业。 自动画《师兄啊师兄》(以下简称“师兄”)第一季开播霸榜优酷多个…

NotePad2轻便够用的文本编辑器

下载方式: 360软件管家里就可以安装,非常的方便。 打开后,界面如下: 可以拖拽打开文本,和notepad的功能差不多,可以平行替代。

Linux之vim的使用详细解析

个人主页:点我进入主页 专栏分类:C语言初阶 C语言进阶 数据结构初阶 Linux C初阶 算法 欢迎大家点赞,评论,收藏。 一起努力,一起奔赴大厂 目录 一.vim简介 二.vim的基本概念 三.vim的基本操作 3.1准备 …

深入探索 JS 的提升机制、函数与块作用域以及函数表达式和声明(上)

🤍 前端开发工程师、技术日更博主、已过CET6 🍨 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 🕠 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 🍚 蓝桥云课签约作者、上架课程《Vue.js 和 E…

SpringBoot和ApiFox整合快速上手

前置:IDEA版本IntelliJ IDEA 2023.2.4,Apifox 2.5.6 安装插件:Apifox Helper1.2.1 目录 1.文档生成 2.提取登录接口token 1.文档生成 把密钥配置到 修改日志编码: 导入成功:文档就会出现 2.提取登录接口token 之后我们再使用的…

综合服务 IntServ

目录 综合服务 IntServ IntServ 定义的两类服务 IntServ 的四个组成部分 流 (flow) 资源预留协议 RSVP RSVP 协议的工作原理 IntServ 体系结构在路由器中的实现 综合服务 IntServ 体系结构存在的主要问题 综合服务 IntServ 综合服务 IntServ (Integrated Services) 可…