必须用http服务（如npx http-server或live server）运行html，因file://协议触发跨域拦截致notfounderror；模型须转为tf.js格式（model.json+shard文件），loadlayersmodel()只认model.json；需await model.ready()再predict；输入tensor须严格匹配shape与dtype。
HTML里直接加载tf.js模型会报NotFoundError: Request failed
这是因为浏览器不允许跨域读取本地.json或.bin文件——你双击打开HTML，地址是file://协议，而TensorFlow.js默认用fetch()拉模型，现代浏览器直接拦截。
必须用HTTP服务起页面。最简单方法：
- 项目根目录下运行npx http-server（需先npm install -g http-server）
- 或用VS Code插件“Live Server”右键启动
- 别用open index.html或拖进浏览器
否则哪怕路径写对了，控制台也只显示NotFoundError: Request failed，根本不会提示“跨域”二字，非常误导。
tf.loadLayersModel()的URL必须指向model.json，不是.h5或.pb
TensorFlow.js不认Keras原生.h5或SavedModel的.pb——这些得先用Python转成tf.js格式：
- 用
tensorflowjs_converter --input_format=keras my_model.h5 web_model/ - 输出是
web_model/model.json+ 若干web_model/group1-shard*.bin -
tf.loadLayersModel()只接受model.json的URL，自动按JSON里描述的路径拉shard文件
常见错误：把my_model.h5直接丢进loadLayersModel()，报Unexpected token { in JSON at position 0——因为h5是二进制，开头不是JSON大括号。
推理前必须await model.ready()，否则model.predict()返回空tensor
模型加载是异步的，但loadLayersModel()返回的是一个Promise，很多人写成：
const model = await tf.loadLayersModel('web_model/model.json');
model.predict(...); // ❌ 这里model还没真正ready
正确做法：
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
const model = await tf.loadLayersModel('web_model/model.json');
await model.ready(); // ✅ 等权重实际加载完毕
const result = model.predict(inputTensor);
漏掉ready()会导致predict()静默失败，输出shape可能是[0]或null，debug时很难联想到是加载没完成。
输入tensor维度和dtype要严格匹配训练时的tf.inputShape
比如模型输入是[1, 224, 224, 3]（batch=1、RGB图），你就不能传[224, 224, 3]；如果训练时用了tf.float32，也不能传Uint8Array。
典型处理链：
- 用
tf.browser.fromPixels(img)读图像 → 得到uint8类型 - 立刻
.resizeNearestNeighbor([224, 224])+.expandDims(0)补batch维 - 再
.cast('float32')+.div(255.0)归一化
少一步就可能输出全零、NaN，或维度不匹配报错Input tensor should have rank 4 but has rank 3。
模型转换和加载那几步环环相扣，哪一环路径写错、协议用错、等待漏掉、张量搞错，都会让推理在静默中失败——而浏览器控制台往往只给个模糊错误，得靠检查每一步的输出shape和type来定位。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
