2024年4月28日
Screen Wake Lock API
摘要： Screen Wake Lock API 防止设备因为闲置而自动调低亮度或锁定屏幕，确保屏幕始终保持开启状态 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content= 阅读全文
posted @ 2024-04-28 16:38 _clai 阅读(3) 评论(0) 推荐(0) 编辑
canvas圆形裁切
摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1. 阅读全文
posted @ 2024-04-28 16:21 _clai 阅读(28) 评论(0) 推荐(0) 编辑
2024年4月27日
js+canvas图片裁剪
摘要： canvas 裁剪图片功能实现 选择图片文件，预览原图 裁剪图片 显示裁剪后的图片 调整裁剪区域大小 获取裁剪后的图片 图片裁剪功能优化 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="view 阅读全文
posted @ 2024-04-27 22:44 _clai 阅读(9) 评论(0) 推荐(0) 编辑
2024年4月24日
canvas 压缩图片
摘要： 拖动 range, 查看压缩效果 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0 阅读全文
posted @ 2024-04-24 00:02 _clai 阅读(16) 评论(0) 推荐(0) 编辑
2024年4月19日
大文件上传
摘要： 大文件多线程切片并发上传 技术使用： File.slice FileReader spark-md5 web worker <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" c 阅读全文
posted @ 2024-04-19 23:06 _clai 阅读(3) 评论(0) 推荐(0) 编辑
2024年4月16日
canvas 捕获视频帧
摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>捕获视频帧 阅读全文
posted @ 2024-04-16 19:09 _clai 阅读(14) 评论(0) 推荐(0) 编辑
m3u8tomp4
摘要： 下载m3u8分片 合并分片 使用 ffmpeg 转为 mp4 文件 技术使用: Bun + ffmpeg 使用 fetch 请求 .m3u8 分片文件 使用 Bun.write 保存每个分片 使用 Bun.file().writer 创建增量写入 writer: FileSink 循环读取 Bun. 阅读全文
posted @ 2024-04-16 10:54 _clai 阅读(58) 评论(0) 推荐(0) 编辑
2024年4月14日
(MSE) video 分片加载
摘要： API使用: MediaSource + SourceBuffer http Range seek进度跳转 client.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewpor 阅读全文
posted @ 2024-04-14 23:34 _clai 阅读(48) 评论(0) 推荐(0) 编辑
2024年4月13日
http Range
摘要： Range Range 范围请求，允许服务器只发送 HTTP 消息的一部分到客户端。Range 可以一次性请求多个部分，请求范围用一个逗号分隔开，服务器会以 multipart/byteranges 文件的形式将其返回。如果服务器返回的是范围响应，需要使用 206 Partial Content 状 阅读全文
posted @ 2024-04-13 23:46 _clai 阅读(116) 评论(0) 推荐(0) 编辑
2024年4月12日
前端录屏并保存视频到本地
摘要： API、第三方库使用 getDisplayMedia + MediaRecorder + @ozean/set-webm-duration <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="vie 阅读全文
posted @ 2024-04-12 22:56 _clai 阅读(52) 评论(0) 推荐(0) 编辑