安裝及設(shè)置

Hoppscotch的安裝是非常簡(jiǎn)單的,我們可以去它的官網(wǎng)下載,它支持主流操作系統(tǒng)和CLI使用,下載地址:https://hoppscotch.com/download

image

Hoppscotch是一款國際化的工具,我們可以在

設(shè)置->語言

中將其設(shè)置為中文;

image

設(shè)置->主題

中我們可以設(shè)置背景和強(qiáng)調(diào)色,個(gè)人比較喜歡暗色的主題。

image

使用

接下來我們將通過Hoppscotch來調(diào)試下電商實(shí)戰(zhàn)項(xiàng)目mall中的接口

,這里還是簡(jiǎn)單介紹下mall項(xiàng)目吧,mall項(xiàng)目是一套基于?SpringBoot3?+ Vue 的電商系統(tǒng)(Github標(biāo)星60K),后端支持多模塊和?2024最新微服務(wù)架構(gòu)?,采用Docker和K8S部署。包括前臺(tái)商城項(xiàng)目和后臺(tái)管理系統(tǒng),能支持完整的訂單流程!涵蓋商品、訂單、購物車、權(quán)限、優(yōu)惠券、會(huì)員、支付等功能!

Boot項(xiàng)目:https://github.com/macrozheng/mall

Cloud項(xiàng)目:https://github.com/macrozheng/mall-swarm

視頻教程:https://www.macrozheng.com/video/

項(xiàng)目演示:

image

首先我們需要先啟動(dòng)mall項(xiàng)目,打開mall項(xiàng)目的Swagger API文檔頁面,我們將會(huì)直接把項(xiàng)目中的接口導(dǎo)入到Hoppscotch里,地址:http://localhost:8080/swagger-ui/

image

之后我們選擇

REST

面板右側(cè)的導(dǎo)入按鈕,選擇

從OpenAPI導(dǎo)入->從URL導(dǎo)入

image

然后輸入對(duì)應(yīng)的URL即可完成導(dǎo)入,導(dǎo)入成功后在右側(cè)的

集合

中會(huì)看到對(duì)應(yīng)的接口;

image

這里我們先訪問下mall項(xiàng)目的登錄接口測(cè)試下,把返回的token保存下來;

image

當(dāng)我們不帶token訪問需要登錄認(rèn)證的接口,例如獲取商品品牌列表的接口時(shí),會(huì)返回

暫未登錄

的結(jié)果;

image

此時(shí)我們?cè)诃h(huán)境變量里添加一個(gè)token的變量;

image

然后在請(qǐng)求的

授權(quán)

里引用這個(gè)token就可以正常訪問需要登錄認(rèn)證的接口了!

image

總結(jié)

Hoppscotch確實(shí)是一款非常不錯(cuò)的API工具,它功能簡(jiǎn)潔易用,而且它也不會(huì)像Postman一樣每次使用都會(huì)提示你去登錄,感興趣的小伙伴可以嘗試下它!項(xiàng)目地址https://github.com/hoppscotch/hoppscotch

原文轉(zhuǎn)載自:https://mp.weixin.qq.com/s/l_wiLkXylLz_MWFsPTFRdA

上一篇:

DeepSeek推薦AI生圖API,用Windsurf接入API,完善AI生圖功能

下一篇:

Apifox MCP Server :1分鐘上手,高效API管理神器!
#你可能也喜歡這些API文章!

我們有何不同?

API服務(wù)商零注冊(cè)

多API并行試用

數(shù)據(jù)驅(qū)動(dòng)選型,提升決策效率

查看全部API→
??

熱門場(chǎng)景實(shí)測(cè),選對(duì)API

#AI文本生成大模型API

對(duì)比大模型API的內(nèi)容創(chuàng)意新穎性、情感共鳴力、商業(yè)轉(zhuǎn)化潛力

25個(gè)渠道
一鍵對(duì)比試用API 限時(shí)免費(fèi)

#AI深度推理大模型API

對(duì)比大模型API的邏輯推理準(zhǔn)確性、分析深度、可視化建議合理性

10個(gè)渠道
一鍵對(duì)比試用API 限時(shí)免費(fèi)