file协议发送请求

来源：3-8 使用 WebpackDevServer 提升开发效率

慕莱坞7043791

2020-12-02

Dell老师好，想请教一个小问题：
老师课上说file协议不能发送ajax请求，需要开启一个服务器。
但我用file协议方式打开一个HTML，发送请求依旧可以成功，源代码如下：

	<button id="btn">按钮</button>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.7/jquery.min.js"></script>
    <script>
      const btn = $('#btn');
      btn.click(() => {
        $.ajax({
          url: 'https://jsonplaceholder.typicode.com/todos/1'
        })
        .done((data) => {
          console.log(data);
        })
      })
    </script>

浏览器截图
图片描述
这个怎么理解呢？

写回答

3回答

慕莱坞7043791

提问者

2020-12-03

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
    <script>
function reqListener() {
        console.log(this.responseText);
      }

var oReq = new XMLHttpRequest();
oReq.addEventListener('load', reqListener);
oReq.open('GET', 'https://jsonplaceholder.typicode.com/todos/1');
oReq.send();
</script>
</body>
</html>

Dell老师好，我上面使用xhr的方式，Chrome浏览器上依旧是可以打印出this.responseText，结果如下：

//img.mukewang.com/szimg/5fc8f33608411ec821320630.jpg