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

文章目录

  • 用法
  • 自定义请求参数的方法
      • 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 配置到环境变量中去

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Centos中安装Docker及Docker的使用

在centos7系统中安装指定版本的docker,并通过docker使用安装mysql为例,阐述docker的使用。 2.1、Docker卸载及安装yum依赖 【卸载Docker,如果安装的Docker的版本不合适】 yum remove docker \docker-client \docker-client-latest \docker-common \docker-latest \docker-…

Kafka之Producer源码

Producer源码解读 在 Kafka 中, 我们把产生消息的一方称为 Producer 即 生产者, 它是 Kafka 的核心组件之一, 也是消息的来源所在。它的主要功能是将客户端的请求打包封装发送到 kafka 集群的某个 Topic 的某个分区上。那么这些生产者产生的消息是怎么传到 Kafka 服务端的呢&a…

常用路径规划算法简介及python程序

目录 1、前言2、D*算法2.1简介2.2优缺点2.2.1 优点2.2.2 缺点 2.3 python程序 3、A*算法3.1 优缺点:3.1.1 优点:3.1.2 缺点: 3.2 python程序 4、人工势场算法4.1优缺点4.1.1优点:4.1.2缺点: 4.2 python程序 5、Dijkstr…

BeautifulSoup+xpath+re+css简单复习+新的scrapy的学习

1.BeautifulSoupsoup BeautifulSoup(html,html.parser)all_icosoup.find(class_"DivTable") 2.xpath trs resp.xpath("//tbody[idcpdata]/tr") hong tr.xpath("./td[classchartball01 or classchartball20]/text()").extract() 这个意思是找…

今日早报 每日精选15条新闻简报 每天一分钟 知晓天下事 2月26日,星期一

每天一分钟,知晓天下事! 2024年2月26日 星期一 农历正月十七 1、 气象台:3月初之前南方大部将维持阴雨雪天气。 2、 据海关统计,京津冀协同发展十年成效显著,外贸总量跨两个万亿台阶。 3、 2024年研考初试成绩今天起…

【数据库】MySQL视图 | 用户管理

文章目录 1 :peach:视图:peach:1.1 :apple:基本使用:apple:1.1.1 :lemon:创建视图:lemon:1.1.2 :lemon:案例:lemon:1.1.3 :lemon:删除视图:lemon: 1.2 :apple:视图规则和限制:apple: 2 :peach:用户管理:peach:2.1 :apple:用户信息:apple:2.2 :apple:创建用户:apple:2.3 :apple:…

国企行政题库--校园招聘

国企行政题库是为准备参加国有企业行政类岗位校园招聘的应聘者提供的一套专门准备的试题资料。国有企业在中国经济中扮演着重要的角色,其行政类岗位需求量大,竞争激烈。通过系统学习和准备国企行政题库,将有助于应聘者更好地了解国企行政类岗…

解析OOM的三大场景,原因及实战解决方案

目录 一、什么是OOM 二、堆内存溢出(Heap OOM) 三、方法区内存溢出(Metaspace OOM) 四、栈内存溢出(Stack OOM) 一、什么是OOM OOM 是 Out Of Memory 的缩写,意思是内存耗尽。在计算机领域…

Centos服务器部署前后端项目

目录 准备工作1. 准备传输软件2. 连接服务器 部署Mysql1.下载Mysql(Linux版本)2. 解压3. 修改配置4. 启动服务另一种方法Docker 部署后端1. 在项目根目录中创建Dockerfile文件写入2. 启动 部署前端1. 在项目根目录中创建Dockerfile文件写入2. 启动 准备工作 1. 准备传输软件 …

QEMU源码全解析 —— virtio(24)

接前一篇文章: 上回书讲解了virtioballoon_probe函数及其中的两个重要函数init_vqs()和virtio_device_ready(),解析了init_vqs函数的前两步,本回继续解析该函数, (3)init_vqs函数在经过了对于各feature的初…

【电机仿真】HFI算法脉振高频电压信号注入观测器-PMSM无感FOC控制

【电机仿真】HFI算法脉振高频电压信号注入观测器-PMSM无感FOC控制 文章目录 前言一、脉振高频电压注入法简介(注入在旋转坐标系的d轴)1.旋转高频电压(电流)注入法2.脉振高频电压注入法 二、高频注入理论1.永磁同步电机的高频模型2…

EasyRecovery2024个人免费版本电脑手机数据恢复软件下载

EasyRecovery是一款功能强大的数据恢复软件,能够帮助用户恢复丢失、删除、格式化或损坏的数据。无论是由于误操作、病毒攻击、硬盘故障还是其他原因导致的数据丢失,EasyRecovery都能提供有效的解决方案。 该软件支持从各种存储介质恢复数据,…

springboot215基于springboot技术的美食烹饪互动平台的设计与实现

美食烹饪互动平台的设计与实现 摘 要 如今社会上各行各业,都喜欢用自己行业的专属软件工作,互联网发展到这个时候,人们已经发现离不开了互联网。新技术的产生,往往能解决一些老技术的弊端问题。因为传统美食信息管理难度大&…

密码安全+破解+防御

一步一脚印! 目录 密码安全简介 密码猜解思路 字典生成 crunch工具(kali自带) 社工生成字典(safe6pwd): python代码实现暴力破解 burpsuite爆破 验证码自动识别 hydra爆破ssh密码 hydra工具 medusa爆破ssh密码 medusa工具 msf爆破ssh密码 …

基于YOLOv8深度学习+Pyqt5的电动车头盔佩戴检测系统

wx供重浩:创享日记 对话框发送:225头盔 获取完整源码源文件已标注的数据集(1463张)源码各文件说明配置跑通说明文档 若需要一对一远程操作在你电脑跑通,有偿89yuan 效果展示 基于YOLOv8深度学习PyQT5的电动车头盔佩戴检…

Open3D 基于最小生成树的法线定向 (27)

Open3D 基于最小生成树的法线定向 (27) 一、算法介绍二、算法实现一、算法介绍 法线计算的方向通常都存在方向问题,用Open3D估计的点云法线,是在每个点的局部进行拟合,估计的法线方向并不一致,Open3D提供了使用最小生成树调整法线到统一方向的方法,下面是具体的实现代码…

微服务-微服务Spring Security OAuth 2实战

1. Spring Authorization Server 是什么 Spring Authorization Server 是一个框架,它提供了 OAuth 2.1 和 OpenID Connect 1.0 规范以及其他相关规范的实现。它建立在 Spring Security 之上,为构建 OpenID Connect 1.0 身份提供者和 OAuth2 授权服务器产…

【机器人学导论笔记】三、操作臂正运动学

3.1 概述 操作臂正运动学研究操作臂的运动特性,主要涉及与运动有关的几何参数和时间参数。本章中,只研究静止状态下操作臂连杆的位置和姿态。 处理这些复杂的几何参数需要一些步骤:首先需要在操作臂的每个连杆上分别固接一个连杆坐标系&…

卷积神经网络 CNN

目录 卷积网络与传统网络的区别 参数共享 卷积神经网络整体架构 卷积操作的作用 卷积核的定义 卷积特征值计算方法 卷积层涉及的参数 边缘填充 ​编辑 卷积结果计算 池化层 整体网格架构 VGG网络架构 残差网络Resnet 卷积网络与传统网络的区别 卷积神经网络&#x…

面向面试的机器学习知识点(4)——分类模型

省流版: 本文介绍机器学习中的回归算法:逻辑回归、KNN、SVM、随机森林和XGBoost。作为机器学习的有监督学习方法,分类模型是最重要也是最常见的一类算法,在数据分析等岗位的笔试面试中都是常客,非常值得深入研究&…