前端：遇到的问题-CSDN博客

本文链接：https://blog.csdn.net/MosBest/article/details/52873090

AJAX与主机交互中用xmlhttpopenGETtrue提取本地主机文件遇到的问题
- 总结对AJAX与主机交互的理解
- 问题过程
  - 点击页面没反应输出XMLHttpRequest status发现XMLHttpRequest status 404
  - XMLHttpRequest status 0
上面的问题如果还没解决

AJAX与主机交互中，用xmlhttp.open(“GET”,”“,true)提取本地主机文件遇到的问题


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script>
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
                  document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
        }
      else
        {
            var a=1;
            a=xmlhttp.status;
            document.getElementById("myDiv").innerHTML=a;
        }
  }
 //xmlhttp.open("GET","/var/www/html/ding.txt",true);这次XMLHttpRequest status 返回的是４０４，表示完全没有找到文件/var/www/html/dinglei.txt.既然要通过浏览器访问主机的服务器，那用这样的路径，服务器怎么可能找得到呢？

//xmlhttp.open("GET","http://www.baidu.com",true);跨域访问他人的服务器，他人的服务器怎么会让你去随便读取他里面的文件呢？所以会被阻止．使得XMLHttpRequest status = 0

//xmlhttp.open("GET","file:///var/www/html/ding.txt",true);会导致错误．因为这里访问的只是在本地打开，并没有通过服务器，则如果readyState(存着XMLHttpRequest的状态)状态是UNSENT或者OPENED,XMLHttpRequest status 会访问 0

xmlhttp.open("GET","http://10.245.20.19//ding.txt",true);//正确
xmlhttp.send();

}
</script>
</head>
<body>

<div id="myDiv"><h2>使用 AJAX 修改该文本内容</h2></div>
<button type="button" onclick="loadXMLDoc()">修改内容</button>

</body>
</html>

总结：对AJAX与主机交互的理解

在上面的代码中

xmlhttp.onreadystatechange=function()
  {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
        document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
        }
      else
        {
            var a=1;
            a=xmlhttp.status;
            document.getElementById("myDiv").innerHTML=a;
        }
 }

一开始很疑惑，为什么这段代码明明是在xmlhttp.open(“GET”,”http://10.245.20.19//ding.txt“,true);前面，怎么可以调用xmlhttp.open(“GET”,”http://10.245.20.19//ding.txt“,true);里面的参数”http://10.245.20.19//ding.txt“呢？
　原因是，这段代码其实是要建立一个函数，然后把整个函数交个xmlhttp.onreadystatechange，而不是把函数的结果交给xmlhttp.onreadystatechange．也就是说xmlhttp.onreadystatechange是一个函数名．这段代码仅仅是用于声明一个函数．

onreadystatechange是一个事件句柄，同样功能的还有onclick这些，就是有点击事件的时候会进行特定处理，具体看你的函数怎么写了。
而onreadystatechange是由readyState触发，readyState存着XMLHttpRequest的状态，
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪

xmlhttp = new XMLHttpRequest();即xmlhttp是建立的XMLHttpRequest()的对象．
也就是说，当我们执行到代码xmlhttp.open("GET","http://10.245.20.19//ding.txt",true); 时候，则这个代码就会向apache服务器发起请求，xmlhttp状态发生变化，即xmlhttp.readyState改变，调用xmlhttp.onreadystatechange这个函数，注意，是这个函数，而不是某个函数的返回值．
　注意：以上xmlhttp.readyState的５种状态（０～４）都要经历一遍的．即在一次请求中，xmlhttp.onreadystatechange这个函数要被调用５次．该函数的if语句直接把前面４次略过了，因为我们仅仅只想知道最后一种情况．等到了第５次xmlhttp.readyState==4,说明请求已完成，且响应已就绪．那么就等服务器的响应了．等到xmlhttp.status==200，则表示交易成功．

问题过程

点击页面没反应，输出XMLHttpRequest status，发现XMLHttpRequest status = 404

说明路径有问题，apache　服务器　没有找到内容．
因为我们是写出xmlhttp.open("GET","/var/www/html/ding.txt",true)．我们可以双击打开服务器中任意一个网页（即/var/www/html/里面的内容），你会发现，在浏览器上面显示路径是，这里写图片描述，是file:///…的形式，不是/var/www/…的形式．

XMLHttpRequest status == 0

那我们把路径改为file:///…的形式好不好呢？？
答案是，错误的．
XMLHttpRequest status 的值一定会返回运行这些步骤的结果.
XMLHttpRequest status == 0有三中情况

1、If the state is UNSENT or OPENED, return 0.（如果状态是UNSENT或者OPENED，返回0）
2、If the error flag is set, return 0.（如果错误标签被设置，返回0）
3、Return the HTTP status code.（返回HTTP状态码）
　以下为本文最上面原句

　
file:///...访问的只是本地打开没有通过服务器，自己可以用Wireshark捉包（感谢某位高人指点）。
这里面还有一个问题，就是xmlhttp.readyState一直会变，
1: 服务器连接已建立
2: 请求已接收  
3: 请求处理中  
4: 请求已完成，且响应已就绪。
以这种情况看的话，应该是xmlhttp自己在模拟，因为根本就没通过服务器。本地直接打开而已。OPENED了，所以status为0。

再之后，不要去对别人服务器发送请求，会被阻止的

正确的方法是在自己的服务器，访问自己域名内的url．
即　http://localhost:80(应该是端口号，我的是 80)/…/…　．或者http://自己电脑的ip:80(应该是端口号，我的是 80)/…/…

上面的问题如果还没解决

在操作过程中，通过bluefish修改代码，然后直接通过bluefish来运行代码．结果返回的是０，但是以前是正确的．还来仔细观察发现，其实，如果用bluefish运行程序时，浏览器网址是file:///var/www/html/ding.html，而不是http://localhost/ding.html．所以，如果用bluefish软件运行的话，他是直接运行本地的，而不通过服务器．所以，此时写出xmlhttp.open("GET","http://10.245.20.19//ding.txt",true);会报错，而写出file:///…/…就是对的．但是这样不好，还是用http://…/比较好，因为这样既可以在本地电脑运行，也可以在其他的电脑运行．而用file:///…/…就只能用软件运行了．