求教各位大佬,这个问题是咋回事,google 上找了一天,也没有找到好的办法。
1
apples01 28 天前
看不到图
|
2
Opportunity 28 天前
说明没获取到正确的 JSON 文件,看 Network
|
3
NessajCN 28 天前 via Android
你为啥会去用 HTTP GET 请求一个本地 json 文件?
你知道 fetch 是用来干嘛的吗 |
4
humbass 28 天前
直接在浏览器访问 http://your-hostname/constant/ceshi.json 有返回的话,fetch 也能得到数据,否则就不对
|
5
pcxys OP @Opportunity
网络里面有这个文件,状态是 200 |
8
lisongeee 28 天前
需要展示完整的 html 文件才知道,截图里不完整
比如控制台错误里的 15 行 30 列到底对应代码的哪位置? |
11
lisongeee 28 天前
测试了一下,确实出现了这个错误
因为你设置了 mode: 'no-cors', 导致拿到的 content 是 '' 空字符串,所以发生 json 解码错误 去掉上面的 mode 参数会报另外的错,意思是 fetch 只支持 chrome-extension, chrome-untrusted, data, edge, http, https, isolated-app. 这类协议 那你就别用 file 协议访问 |
12
NessajCN 27 天前 via Android
@pcxys fetch 不是用来读本地文件的,或者说浏览器就不支持读本地文件,不然网站上随便来个脚本就能读你电脑里的文件不是乱套了吗
你要读这个 json ,首先是把这个文件用 http server 开放出去,也就是能在浏览器里用 http://xxx/xxx.json 访问到,这样浏览器在从其他地方 fetch 这个文件就是合法的。具体到你这个例子,我假设你是用 nginx 当服务器,那你就把 json 文件放到 index.html 同目录,然后再在 index.html 里 fetch("xxx.json")应该就能获取到了 |
17
daozun 27 天前
使用 vscode 开发的话,下载一个 Live server 插件,它会在本地开启一个服务器,应该对你有帮助
|
18
bojackhorseman 27 天前 via iPhone
看下来应该是 response.json 方法报错了,响应结果无法 json 序列化,加个 try catch 就行了
|
20
markgor 27 天前
不知道你想幹什麼,這個 json 是發佈之後也是本地的,還是說發佈後是請求線上的。
如果是發佈後請求線上的,但是你現在想調試,你可以看看 mock 這方面得。 如果發佈後都是不需要請求後端的,直接 import |
21
DOLLOR 27 天前
请部署到 HTTP 服务器再打开,fetch 和 XHR 不支持本地( file://)调用,并且没有任何 workaround ,包括 mode: 'no-cors'也不会解决你的问题。
|
22
ziyanghua 27 天前
vs code 用 live server 插件模拟服务器,把那个 json 文件放在项目里面。这样你本地读取就没有问题了 初学者的话善用 ai 可能会比问大家更有帮助一些 加油哈
|
25
jinliming2 27 天前 via iPhone
@pcxys 如果是要调用本地的文件,不管啥类型,只有通过 input type="file" (可以用脚本)让用户选择对应的文件,然后你才能拿到用户选择的文件的只读访问权限。
或者通过 File System API https://developer.mozilla.org/en-US/docs/Web/API/File_System_API 要求用户授权这个文件或者文件夹的权限,然后就能读取或写入文件,但这个 API 仅限于安全上下文,比如 https 下。 |
26
jinliming2 27 天前 via iPhone
且是实验性的
|