微信小程序真机调试无法读取 JSON 文件

161 天前
 luxi78

我在微信小程序中尝试读取项目中的 JSON 文件,代码如下:

      const path = "assets/animations/main_ani.json";
      const fs = wx.getFileSystemManager();
      try {
        // 读取本地 JSON 文件
        const fileContent = fs.readFileSync(path, "utf-8");
        let animData;
        try {
          animData = JSON.parse(fileContent);
          console.log(animData);
        } catch (e) {
          console.error("JSON 解析失败", e);
        }
      } catch (err) {
        console.error("读取文件失败", err);
      }

这段代码在 微信开发者工具模拟器 中可以正常运行,但在 真机远程调试 时出现如下错误:

index.ts:69 读取文件失败 Error: readFileSync:fail no such file "assets/animations/main_ani.json"
    at W_ (WAServiceMainContext.js:1)
    at Object.<anonymous> (WAServiceMainContext.js:1)
    at I (WAServiceMainContext.js:1)
    at Object.p (WAServiceMainContext.js:1)
    at li.onTest (index.ts:60)
    at o.safeCallback (WASubContext.js:1)
    at WASubContext.js:1
    at wn (WASubContext.js:1)
    at WASubContext.js:1
    at pe (WASubContext.js:1)

尝试将 path 改为 "/assets/animations/main_ani.json" 之后,问题依旧。

疑问: 小程序的 JSON 文件应该如何正确读取?

开发者工具和真机调试的文件路径是否有差异?

是否需要特殊配置,或使用其他方式加载 JSON 文件?

希望有经验的朋友能帮忙解答,感谢!

1262 次点击
所在节点    微信
17 条回复
qhd1988
161 天前
考虑改成 js 文件,export 出来吧
luxi78
161 天前
@qhd1988 这样做确实可以,但还是希望能找到最佳实践的方式,而不是用 trick 了。毕竟读取作为项目资源存在的 json 文件还是很常规的操作了,难倒大家都没有遇到过这样的需求吗?
qhd1988
161 天前
@luxi78 #2 看起来你是想加载 lottie 动画?我们的动画都丢腾讯的 cos 上了,直接用 lottie.loadAnimation 加载出来
gadfly3173
161 天前
看你代码好像没什么问题,真机调试不成功的话你得观察一下上传代码包时那个 popup 的内容,可能你这个 json 被忽略了,没有上传
junan
161 天前
json 文件放在 static 目录下试试?
duanxianze
161 天前
4#说的对,没有显式引用,可能上传的时候被忽略了
wjfz
161 天前
我理解微信小程序的 FileSystemManager 读取的是手机系统的文件,不是代码包目录内的文件,所以这种使用姿势不对。
miku999
161 天前
真机调试后可以去 devtools 的 source 面板里看看文件在不在
harlen
161 天前
不能读项目内的 json 文件吧,上次写背单词小程序,为了省服务端,把字典放代码里面,最后只有 export 能正常读取到, 放项目内还有个大小限制开发工具好好的,上传上去就超大
luxi78
159 天前
@qhd1988 是的,是 lottie 动画。之所以不放网上是想尽量减少对外部的依赖。
luxi78
159 天前
@gadfly3173 嗯,确实 json 文件被忽略了
luxi78
159 天前
@junan 好像 static 目录在小程序里面也没有什么特殊性吧?
luxi78
159 天前
@wjfz 但诡异的是微信开发者工具里面的模拟器是可以正常运行的,放真机上就不行了。
luxi78
159 天前
@miku999 devtools 的 source 里看到的内容极为少,明确有的东西也未必能显示出来。感觉微信开发者工具就是一个草台班子做出来的
luxi78
159 天前
@harlen 也就是说也是和一楼兄弟建议的方法一样了,改成 js 或 ts 文件,在 export 出来,对吧。
junan
159 天前
@luxi78 #12 我记得 static 目录下的文件不会被编译,记不太清,你试试?
luxi78
159 天前
@junan 试过了,不行的。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/1121103

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX