HTML&JS实现kNN图像分类能否直接使用现有图像文件夹作为数据集

完全可行，不存在技术层面的阻碍。你能搜到的公开方案大多采用实时拍照采集的交互，只是因为这类教程偏向演示实时交互效果，不是说预存文件夹导入的方案做不了。

具体实现逻辑 #

纯前端环境下受浏览器安全策略限制，页面不能无授权直接读取本地磁盘任意路径的文件，但只要走以下两种常规路径就能实现批量导入，完全不需要做逐张点击拍摄的冗余交互：

• 静态资源预加载方案（数据集固定时首选）
  把你整理好的「健康姿态」「不健康姿态」两个图片文件夹放到项目的静态资源目录下，比如在项目根目录新建dataset文件夹，下分healthy、unhealthy两个子目录存放对应分类的图片。
  你可以按统一规则给图片命名（比如健康类命名为h_1.jpg、h_2.jpg……不健康类命名为uh_1.jpg、uh_2.jpg……），页面初始化时直接循环生成图片路径，创建Image对象加载所有图片，逐张送入姿态检测模型提取特征向量，之后调用k-NN分类器的添加样本接口绑定对应类别标签即可——这一步的逻辑和实时采集摄像头帧加样本的逻辑完全一致，只是输入源从实时视频流换成了预存的静态图片。
  如果不想手动维护图片路径列表，可以写个简单的本地脚本扫描两个文件夹下的所有文件名，自动生成一份存着所有图片路径的JSON清单，前端初始化时直接读取这份清单就行，后续新增、删除图片不用改前端代码。
• 运行时文件夹选择方案（需要频繁更换数据集时用）
  在页面上加两个文件夹选择按钮，分别对应健康、不健康两类数据集，给input标签加上webkitdirectory属性，支持用户直接选中本地对应的整文件夹，授权后浏览器就能读取文件夹下的所有图片文件。拿到文件列表后，逐张用FileReader读取图片内容转为模型可识别的图像输入，提取特征后批量加入k-NN分类器的对应类别即可，选完文件夹等待批量处理完成就能直接用。

实用优化提示 #

批量导入完所有样本后，可以直接把k-NN分类器的参数序列化为JSON文件存在本地，下次页面加载时直接读取这个参数文件初始化分类器，不用每次打开页面都重新逐张处理图片、提取特征，初始化速度会提升非常多。

内容的提问来源于stack exchange，提问作者CarsonC