图片卡片上线

举报
知学题库 发表于 2026/09/22 20:02:44 2026/09/22
【摘要】 积压了几天的图片卡片需求,今天终于做完了。实现方式很简单: 卡片编辑时多了一个图片上传区域,支持点击上传和粘贴图片。图片上传到对象存储,返回URL存在卡片的image_url字段。正面和背面可以各放一张图,卡片翻转时图片跟着一起翻。顺手做了两个优化:图片自动压缩:上传的图片先在前端压缩到最大宽度800px,减少存储和加载时间。测试了一张3MB的截图,压到200KB左右,清晰度肉眼基本看不出差...

积压了几天的图片卡片需求,今天终于做完了。

实现方式很简单: 卡片编辑时多了一个图片上传区域,支持点击上传和粘贴图片。图片上传到对象存储,返回URL存在卡片的image_url字段。正面和背面可以各放一张图,卡片翻转时图片跟着一起翻。

顺手做了两个优化:

  • 图片自动压缩:上传的图片先在前端压缩到最大宽度800px,减少存储和加载时间。测试了一张3MB的截图,压到200KB左右,清晰度肉眼基本看不出差别。

  • 点击放大:卡片上的图片点击后弹出全屏预览,支持双指缩放。背解剖图、化学结构式这类细节多的内容时很实用。

测试了一轮: 传了几张解剖图和代码截图,翻卡正常,图片加载速度可以接受。手机端也测了,粘贴图片的功能在微信浏览器里不太稳定,后面再想办法兼容。

明天计划: 把FSRS的切换再往前推一步——整理够1000条复习记录后,跑一次完整的算法对比测试。

【声明】本内容来自华为云开发者社区博主,不代表华为云及华为云开发者社区的观点和立场。转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息,否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0)

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。