前言一个真实的场景我有个朋友在做一个传统文化主题的博客网站希望首页能随机展示一句古诗词来提升页面文化氛围。他试了几个免费诗词API要么需要付费要么返回格式不统一要么跨域直接报错折腾了一个下午没搞定。最后他找到我我帮他快速接入了ApiZero极数本源平台的随机诗词API前后花了不到半小时。后来我把这个过程整理成了这篇文章希望能帮你少走弯路。本文会涵盖从注册、获取API Key到前后端完整集成代码还有5个你大概率会遇到的坑及应对方案。适合读者前端/全栈开发者、对API集成感兴趣的技术爱好者、想在个人项目里加入古诗词功能的同学。第一步了解随机诗词APIApiZero极数本源是一个聚合API平台提供了包括天气、翻译、AI、诗词等数百个高质量接口。其中的随机诗词API使用起来非常简单特性说明接口类型RESTful GET是否需要API Key是免费注册后获取免费额度每天1000次一般个人项目足够返回格式JSON数据内容诗词正文、作者、出处、作品名接口示例假设GET https://api.apizero.cn/poetry/poetry.php?appkeyyour_keytyperandom返回JSON结构{ code: 200, msg: success, data: { title: 静夜思, author: 李白, source: 全唐诗, content: 床前明月光疑是地上霜。举头望明月低头思故乡。 } }注意实际字段名请以官方文档为准但结构大同小异。第二步获取API Key打开 ApiZero 官网https://apizero.cn注册账号 → 进入控制台 → 创建应用 → 选择“随机诗词”接口 → 获取 AppKey。整个过程不超过2分钟。拿到 Key 之后建议先通过浏览器直接访问接口测试一下确认返回正常。第三步前端直接调用附完整代码如果你只是想在纯前端页面比如个人博客、静态站点中展示可以直接用fetch调用。但注意跨域问题——如果接口服务端没有设置Access-Control-Allow-Origin浏览器会阻止请求。方案一使用支持CORS的API若官方已开启!DOCTYPE html html headmeta charsetUTF-8title随机诗词展示/title/head body div idpoem h3 idtitle/h3 p idauthor/p p idcontent/p /div button onclickfetchPoem()再来一句/button script const url https://api.apizero.cn/poetry/poetry.php?appkeyYOUR_APP_KEYtyperandom; async function fetchPoem() { try { const res await fetch(url); const json await res.json(); if (json.code ! 200) throw new Error(json.msg); document.getElementById(title).innerText json.data.title; document.getElementById(author).innerText —— ${json.data.author}; document.getElementById(content).innerText json.data.content; } catch (err) { console.error(诗词API调用失败:, err); // 可以显示默认诗词 } } fetchPoem(); /script /body /html方案二跨域被拦截时改用后端代理推荐实际生产中大多数收费/免费API都没有开放CORS或者限制Referer所以纯前端调用不可靠。最佳实践是用自己的后端做一个代理把API Key放在服务端也给前端带来了更好的安全性和缓存控制。第四步后端代理Python Flask实现这里以 Python Flask 为例提供一套可运行的后端代理代码。# app.py import requests from flask import Flask, jsonify from flask_cors import CORS app Flask(__name__) CORS(app) # 允许前端跨域访问后端 API_KEY YOUR_APP_KEY # 请替换为自己的Key POETRY_URL https://api.apizero.cn/poetry/poetry.php app.route(/api/poetry) def get_random_poetry(): params {appkey: API_KEY, type: random} try: resp requests.get(POETRY_URL, paramsparams, timeout5) resp.raise_for_status() data resp.json() return jsonify(data) except Exception as e: return jsonify({code: 500, msg: str(e)}), 500 if __name__ __main__: app.run(debugTrue, host0.0.0.0, port5000)前端调用改为请求自己的后端fetch(http://localhost:5000/api/poetry) .then(res res.json()) .then(json { if (json.code 200) { // 渲染诗词 } });这样既解决了跨域又保护了API Key不被泄露。还可以在后端添加缓存比如使用Redis或内存缓存每5分钟刷新一次减少对API的频繁请求。第五步实战中的踩坑记录下面5个坑是我在集成过程中真实遇到过的分享给大家坑点问题描述解决方案跨域CORS浏览器报错“No Access-Control-Allow-Origin”后端代理推荐或确认API方是否支持JSONP请求频率限制短时间内大量调用被返回429状态码加本地缓存比如5分钟更新一次或购买更高额度API Key泄露前端代码直接暴露Key被他人盗用务必放在后端代理中通过环境变量管理数据异常接口偶尔返回空数据或错误字段前端做容错处理判断json.code并显示备用诗词编码问题古诗词中的生僻字或繁体字显示乱码确保页面meta charsetUTF-8后端请求时设置encoding参数额外提醒诗词API的数据来自网络可能存在少量错误比如作者、出处不准确建议在展示时声明“内容来自网络仅供参考”或接入多个数据源交叉验证。总结与下一步通过本文你应该可以快速在自己的项目中接入随机诗词API。核心收获了解ApiZero平台及其诗词接口的基本用法。掌握前后端两种调用方式并知道为什么推荐后端代理。通过表格清晰记住5个常见坑避免重复踩雷。如果你在集成过程中遇到其他奇葩报错欢迎把错误信息贴在评论区我会按场景补充排查思路。也欢迎收藏这篇文章下次做诗词相关功能时可以快速查阅。扩展思考除了单句随机还可以利用这个API做飞花令关键字查询、诗词日历等更复杂的功能我之后可能会写一个系列感兴趣的同学点个关注不迷路。
集成随机诗词API到项目？附完整前后端代码与挖坑指南
发布时间：2026/7/7 4:42:24
前言一个真实的场景我有个朋友在做一个传统文化主题的博客网站希望首页能随机展示一句古诗词来提升页面文化氛围。他试了几个免费诗词API要么需要付费要么返回格式不统一要么跨域直接报错折腾了一个下午没搞定。最后他找到我我帮他快速接入了ApiZero极数本源平台的随机诗词API前后花了不到半小时。后来我把这个过程整理成了这篇文章希望能帮你少走弯路。本文会涵盖从注册、获取API Key到前后端完整集成代码还有5个你大概率会遇到的坑及应对方案。适合读者前端/全栈开发者、对API集成感兴趣的技术爱好者、想在个人项目里加入古诗词功能的同学。第一步了解随机诗词APIApiZero极数本源是一个聚合API平台提供了包括天气、翻译、AI、诗词等数百个高质量接口。其中的随机诗词API使用起来非常简单特性说明接口类型RESTful GET是否需要API Key是免费注册后获取免费额度每天1000次一般个人项目足够返回格式JSON数据内容诗词正文、作者、出处、作品名接口示例假设GET https://api.apizero.cn/poetry/poetry.php?appkeyyour_keytyperandom返回JSON结构{ code: 200, msg: success, data: { title: 静夜思, author: 李白, source: 全唐诗, content: 床前明月光疑是地上霜。举头望明月低头思故乡。 } }注意实际字段名请以官方文档为准但结构大同小异。第二步获取API Key打开 ApiZero 官网https://apizero.cn注册账号 → 进入控制台 → 创建应用 → 选择“随机诗词”接口 → 获取 AppKey。整个过程不超过2分钟。拿到 Key 之后建议先通过浏览器直接访问接口测试一下确认返回正常。第三步前端直接调用附完整代码如果你只是想在纯前端页面比如个人博客、静态站点中展示可以直接用fetch调用。但注意跨域问题——如果接口服务端没有设置Access-Control-Allow-Origin浏览器会阻止请求。方案一使用支持CORS的API若官方已开启!DOCTYPE html html headmeta charsetUTF-8title随机诗词展示/title/head body div idpoem h3 idtitle/h3 p idauthor/p p idcontent/p /div button onclickfetchPoem()再来一句/button script const url https://api.apizero.cn/poetry/poetry.php?appkeyYOUR_APP_KEYtyperandom; async function fetchPoem() { try { const res await fetch(url); const json await res.json(); if (json.code ! 200) throw new Error(json.msg); document.getElementById(title).innerText json.data.title; document.getElementById(author).innerText —— ${json.data.author}; document.getElementById(content).innerText json.data.content; } catch (err) { console.error(诗词API调用失败:, err); // 可以显示默认诗词 } } fetchPoem(); /script /body /html方案二跨域被拦截时改用后端代理推荐实际生产中大多数收费/免费API都没有开放CORS或者限制Referer所以纯前端调用不可靠。最佳实践是用自己的后端做一个代理把API Key放在服务端也给前端带来了更好的安全性和缓存控制。第四步后端代理Python Flask实现这里以 Python Flask 为例提供一套可运行的后端代理代码。# app.py import requests from flask import Flask, jsonify from flask_cors import CORS app Flask(__name__) CORS(app) # 允许前端跨域访问后端 API_KEY YOUR_APP_KEY # 请替换为自己的Key POETRY_URL https://api.apizero.cn/poetry/poetry.php app.route(/api/poetry) def get_random_poetry(): params {appkey: API_KEY, type: random} try: resp requests.get(POETRY_URL, paramsparams, timeout5) resp.raise_for_status() data resp.json() return jsonify(data) except Exception as e: return jsonify({code: 500, msg: str(e)}), 500 if __name__ __main__: app.run(debugTrue, host0.0.0.0, port5000)前端调用改为请求自己的后端fetch(http://localhost:5000/api/poetry) .then(res res.json()) .then(json { if (json.code 200) { // 渲染诗词 } });这样既解决了跨域又保护了API Key不被泄露。还可以在后端添加缓存比如使用Redis或内存缓存每5分钟刷新一次减少对API的频繁请求。第五步实战中的踩坑记录下面5个坑是我在集成过程中真实遇到过的分享给大家坑点问题描述解决方案跨域CORS浏览器报错“No Access-Control-Allow-Origin”后端代理推荐或确认API方是否支持JSONP请求频率限制短时间内大量调用被返回429状态码加本地缓存比如5分钟更新一次或购买更高额度API Key泄露前端代码直接暴露Key被他人盗用务必放在后端代理中通过环境变量管理数据异常接口偶尔返回空数据或错误字段前端做容错处理判断json.code并显示备用诗词编码问题古诗词中的生僻字或繁体字显示乱码确保页面meta charsetUTF-8后端请求时设置encoding参数额外提醒诗词API的数据来自网络可能存在少量错误比如作者、出处不准确建议在展示时声明“内容来自网络仅供参考”或接入多个数据源交叉验证。总结与下一步通过本文你应该可以快速在自己的项目中接入随机诗词API。核心收获了解ApiZero平台及其诗词接口的基本用法。掌握前后端两种调用方式并知道为什么推荐后端代理。通过表格清晰记住5个常见坑避免重复踩雷。如果你在集成过程中遇到其他奇葩报错欢迎把错误信息贴在评论区我会按场景补充排查思路。也欢迎收藏这篇文章下次做诗词相关功能时可以快速查阅。扩展思考除了单句随机还可以利用这个API做飞花令关键字查询、诗词日历等更复杂的功能我之后可能会写一个系列感兴趣的同学点个关注不迷路。
 获取与实战)
