巧妙处理Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-ext

VScode Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-ext报错巧妙处理

描述:之前没怎么用过vscode,如下情况:
准备:

1.html文件

<!DOCTYPE html>
<html lang="en">
<!-- npm /yarm     node  -->
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>demo001-202008061215</title>
</head>

<body>
    <div id="myDiv">
        <h2>通过 AJAX 改变文本</h2>
    </div>
    <button id="b01" type="button">改变内容</button>
    <script src="../node_modules/jquery/dist/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            $("#b01").click(function () {
                var newData = "";
                //当使用ajax访问本地文件时候
                $.ajax({
                    url: "t01.json",
                    dataType: "json",
                    type: "get",
                    success: function (data) {
                        console.log(data);
                        for (var i = 0; i < data.length; i++) {
                            //JSON.stringify(data[i])
                            newData = newData + JSON.stringify(data[i]) + "</br>";
                        }
                        $("#myDiv").html(newData);
                    }
                });
            });
        });
    </script>
</body>

</html>

在代码上右键,点击“open in default browser”,或者“Open in other browser” 就可以在我们 喜欢的浏览器里面打开(提前装了live server插件),但是在执行ajax的时候,访问本地的文件,出现报错,百度了一下,说是跨域问题,可以通过修改浏览器的相关属性来解决,但是,感觉有点麻烦(不太会操作)。
error
解决:

我们右键先用它默认的浏览器打开(就是vscode默认的),选择“Open with Live Server”,我的电脑win10,默认打开edge浏览器,先暂时顺从一下😄。emmm…看到他的网址栏,我比较欣慰😄
☺
然后么,就把这个顶部网址链接放到自己喜欢的浏览器里面去,回车,啊,这座城,又多了个开心的人
在这里插入图片描述

在这里插入图片描述
谢谢阅读
欢迎常来😁

©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页