Vscode+Chrome调试直接读取本地文件解决方案

最新推荐文章于 2025-02-13 16:02:52 发布

原创最新推荐文章于 2025-02-13 16:02:52 发布 · 2.7k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#WebGL #Vscode #Chrome #HTML

本文介绍如何通过配置谷歌浏览器的运行参数--disable-web-security，实现WebGL项目中读取本地图片的需求，适用于使用VSCode进行Web开发的场景。

最近学WebGL需要读取本地图片，研究了一下Debbuger for chrome的拓展，发现可以传递执行参数

"runtimeArgs": [

" --disable-web-security"

]

来允许读取本地文件，以下是Json配置文件

{
    "version": "0.2.0",
    "configurations": [

        {
            "name": "谷歌浏览器", //运行html文件，用谷歌浏览器打开
            "type": "chrome",
            "request": "launch",
            "url": "${file}",
            "sourceMaps": true,
            "webRoot": "${workspaceRoot}",
            "runtimeArgs": [
                " --disable-web-security"
            ],
        },
        {
            "name": "nodeLauch", //单独调试js，即可以直接运行js
            "type": "node",
            "request": "launch",
            "program": "${file}", //这个配置成你要调试的文件、${file}当前打开的文件
            "stopOnEntry": false,
            "args": [],
            "cwd": "${workspaceRoot}",
            "runtimeExecutable": null,
            "runtimeArgs": [
                "--nolazy"
            ],
            "env": {
                "NODE_ENV": "development"
            },
            "console": "internalConsole",
            "preLaunchTask": "",
            "sourceMaps": false,
            "outDir": null
        }
    ]
}