网站首页 > 技术文章 正文
回想当年刚接触前端,Ajax 真的碰一次就跪一次。当时不懂后端,不知道 api 是什么东东,也没有后端小伙伴写接口给我测试。
本文整理了我用过的几个 免费的在线api接口,而且不需要处理跨域等问题。
希望能给刚入门的前端小白在学习 Ajax 时提供一点帮助。
本文列举的在线接口包括:文本 和 图片。
本文案例都是使用 postman 进行测试的,因为我懒得自己写 Ajax 代码。
如果你想在本地 30秒搭建一套模拟接口,如果你 不懂后端,如果你需要 自定义 接口地址和数据格式。那可以试试跟着这篇文章去实现:
《『前端必备』本地数据接口 —— json-server 从入门到膨胀》
https://juejin.cn/post/7043424909472563208
如果本文对您有帮助,请帮我点个赞呗
一、{JSON} Placeholder
『JSONPlaceholder』 提供用于测试的免费API。
JSONPlaceholder 使用方式非常简单,提供了 GET、POST、PUT、PATCH、DELETE 几个请求方法。
还提供分页查询、具体id查询等功能。
例:获取100篇文章数据(GET)
返回100条数据,每条内容都有帖子 ID、发贴人 ID、标题、以及简介。
http://jsonplaceholder.typicode.com/posts
例:根据文章ID获取文章数据(GET)
根据文章 ID 获取指定文章的数据。
返回:文章 ID、发贴人 ID、标题、以及内容。
http://jsonplaceholder.typicode.com/posts/2
本例传入的 ID 为2,返回 ID 为2的数据。
例:添加文章(POST)
使用 POST 发送一篇文章,发送成功会返回一个文章 ID 回来。
http://jsonplaceholder.typicode.com/posts
其他接口(自己试试吧)
帖子接口:
- 获取帖子列表:jsonplaceholder.typicode.com/posts
- 根据帖子ID获取详情:jsonplaceholder.typicode.com/posts/1
- 获取某个用户所有的帖子:jsonplaceholder.typicode.com/posts?userI…
- 获取帖子所有的评论:jsonplaceholder.typicode.com/posts/1/com…
评论接口
- 获取评论列表:jsonplaceholder.typicode.com/comments
- 获取某个帖子的所有评论:jsonplaceholder.typicode.com/comments?po…
专辑接口:
- 获取专辑列表:jsonplaceholder.typicode.com/albums
- 根据专辑ID获取详情:jsonplaceholder.typicode.com/albums/6
- 获取某个用户所有专辑:jsonplaceholder.typicode.com/albums?user…
待办事宜接口:
- 获取待办事宜列表:jsonplaceholder.typicode.com/todos
- 根据待办ID获取详情:jsonplaceholder.typicode.com/todos/6
- 获取某个用户所有待办事宜:jsonplaceholder.typicode.com/todos?userI…
用户接口:
- 获取用户列表:jsonplaceholder.typicode.com/users
- 根据用户ID获取详情:jsonplaceholder.typicode.com/users/5
照片接口:
- 获取照片列表:jsonplaceholder.typicode.com/photos
- 根据照片ID获取详情:jsonplaceholder.typicode.com/photos/8
二、猫奴福利接口
『The Cat API - Cats as a Service.』 会返回猫的图片,绝对是福利。
使用方法可以看 『文档』 ,里面包括猫的 “按品种搜索”、“按类别搜索”、“分页搜索”、“图片上传”、“图像分析”等接口,可以对照文档使用。
例:随机获取1张猫图(GET)
每次请求都会随机返回一张猫的图片。
https://api.thecatapi.com/v1/images/search?limit=1
其他接口的使用都比较简单,『官方文档』 都讲得很明白的,可以自己用 postman 测一下。
三、狗子接口
『Dog API』 提供了狗子的图片,官网的首页第一眼看到的 api 就可以随机获得一张狗子照片,非常有趣。
例:随机返回一张狗子照片(GET)
https://dog.ceo/api/breeds/image/random
其他接口的用法也好简单,详情可看 『狗子官方文档』
四、随机图片接口
『Lorem Picsum』 可以随机返回一张照片,还可以指定照片的尺寸。
Lorem Picsum 提供的接口返回的是一个图片资源,而且是随机返回的。
可以直接放在 <img> 标签的 src 属性内使用。
例:返回 宽和高都是200px 的图片(GET)
https://picsum.photos/200
例:比如想要获取 宽200,高300 的图片(GET)
如果宽高尺寸不同,可以自己设置。
https://picsum.photos/200/300
复制代码
五、其他接口
前面4个是我用得最多的测试平台,接下来这些是我用得比较少,但知道有这回事。有需要的话可以自己测测。
爱奇艺接口
https://cache.video.iqiyi.com/jp/avlist/{片源id}/{页码}/
例:用海贼王的片源id(GET)
https://cache.video.iqiyi.com/jp/avlist/202861101/1/
可以猜到:
- vpic:每集的封面
- shortTitle:集数
- vt:本集的名称
- vid:视频id
- vur:视频播放地址
其他字段自己猜吧,我懒~
物流接口
http://www.kuaidi100.com/query?type=快递公司代号&postid=快递单号
快递公司编码:
- 申通:shentong
- EMS:ems
- 顺丰:shunfeng
- 圆通:yuantong
- 中通:zhongtong
- 韵达:yunda
- 天天:tiantian
- 汇通:huitongkuaidi
- 全峰:quanfengkuaidi
- 德邦:debangwuliu
- 宅急送:zhaijisong
淘宝商品接口
http://suggest.taobao.com/sug?code=utf-8&q=商品关键字&callback=cb
callback 是回调函数设定
猜你喜欢
- 2025-07-08 如何优雅地校验后端接口数据,不做前端背锅侠
- 2025-07-08 Protobuf-net:C#高效序列化工具,助力接口传输与前端解析
- 2025-07-08 结合k8s和pipeline流水线,并通过k8s接口镜像升级
- 2025-07-08 前端开发如何用Mock.js进行数据接口模拟
- 2024-10-12 php 给app 或前端封装api 接口——json格式
- 2024-10-12 前端基础:vue中Axios的封装和API接口的管理
- 2024-10-12 Vue项目中实现用户登录及token验证
- 2024-10-12 前端开发:TypeScript 接口与泛型 接口使用泛型
- 2024-10-12 Java实战系列-前端VUE代码开发及接口流程设计(1)
- 2024-10-12 你还不了解typescript中接口和类型别名的用法区别?本文帮你总结
你 发表评论:
欢迎- 07-08记oracle日志挖掘实操&查询归档不正常增长情况(一)
- 07-08Oracle 伪列!这些隐藏用法你都知道吗?
- 07-08orcl数据库查询重复数据及删除重复数据方法
- 07-08重大故障!业务核心表被truncate删除,准备跑路……
- 07-08oracle数据恢复—oracle执行truncate命令误删除数据的数据恢复
- 07-08Oracle-rac 修改scanip(oracle 修改sequence cache)
- 07-08ORACLE RAC CDB和PDB切换(oracle数据库rac切换)
- 07-08Oracle rac haip作用(oracle rac的典型特征)
- 596℃几个Oracle空值处理函数 oracle处理null值的函数
- 590℃Oracle分析函数之Lag和Lead()使用
- 577℃0497-如何将Kerberos的CDH6.1从Oracle JDK 1.8迁移至OpenJDK 1.8
- 573℃Oracle数据库的单、多行函数 oracle执行多个sql语句
- 569℃Oracle 12c PDB迁移(一) oracle迁移到oceanbase
- 562℃【数据统计分析】详解Oracle分组函数之CUBE
- 549℃最佳实践 | 提效 47 倍,制造业生产 Oracle 迁移替换
- 542℃Oracle有哪些常见的函数? oracle中常用的函数
- 最近发表
-
- 记oracle日志挖掘实操&查询归档不正常增长情况(一)
- Oracle 伪列!这些隐藏用法你都知道吗?
- orcl数据库查询重复数据及删除重复数据方法
- 重大故障!业务核心表被truncate删除,准备跑路……
- oracle数据恢复—oracle执行truncate命令误删除数据的数据恢复
- Oracle-rac 修改scanip(oracle 修改sequence cache)
- ORACLE RAC CDB和PDB切换(oracle数据库rac切换)
- Oracle rac haip作用(oracle rac的典型特征)
- 新手小白怎么学UI设计 推荐学习路线是什么
- 超实用!0基础UI设计自学指南(0基础学ui设计好就业吗)
- 标签列表
-
- 前端设计模式 (75)
- 前端性能优化 (51)
- 前端模板 (66)
- 前端跨域 (52)
- 前端缓存 (63)
- 前端aes加密 (58)
- 前端脚手架 (56)
- 前端md5加密 (54)
- 前端路由 (61)
- 前端数组 (73)
- 前端js面试题 (50)
- 前端定时器 (59)
- 前端懒加载 (49)
- 前端获取当前时间 (50)
- 前端接口 (50)
- Oracle RAC (76)
- oracle恢复 (77)
- oracle 删除表 (52)
- oracle 用户名 (74)
- oracle 工具 (55)
- oracle 内存 (50)
- oracle 导出表 (57)
- oracle 中文 (51)
- oracle的函数 (57)
- 前端调试 (52)
本文暂时没有评论,来添加一个吧(●'◡'●)