AJAX问题之XMLHttpRequest status = 0

来源：互联网发布：输入数据自动生成图表编辑：程序博客网时间：2024/05/14 19:35

ajax.html

<!DOCTYPE html><html lang="en">    <head>        <meta charset="utf-8">    </head>    <body>        <div id="showInfo"></div>        <form id="form">            用户名：<input type="text" name="username" id="username"><br>            密码：<input type="password" name="password" id="password"><br>            <input type="button" value="登录" id="btn">        </form>        <script>            window.onload = function () {                var btn = document.getElementById('btn');                btn.onclick = function(){                    var username = document.getElementById("username").value;                    var password = document.getElementById("password").value;                    var xhr = null;                    if (window.XMLHttpRequest) {                        xhr = new XMLHttpRequest();                    }else {                        xhr = new ActiveXObject("Microsoft.XMLHTTP");                    }                    var url = './check.php?username='+username+'&password='+password;                    xhr.open('get',url,true);                    xhr.onreadystatechange = function(){                        if (xhr.readyState==4) {                            if (xhr.status==200) {                                var data = xhr.responseText;                                if (data==1) {                                    document.getElementById('showInfo').innerHTML='用户名或者密码错误';                                }else if(data==2){                                    document.getElementById("showInfo").innerHTML ='登录成功';                                }                            }                        }                    }                    xhr.send(null);                }            }        </script>    </body></html>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49

check.PHP

<?php    $username = $_GET['username'];    $password = $_GET['password'];    if ($username == '1' && $password == '1') {        echo 2;    }else {        echo 1;    }?>1
2
3
4
5
6
7
8
9
10
1
2
3
4
5
6
7
8
9
10

XMLHttpRequest status = 0 问题。
xmlhttp.readyState =4的时候，一直xmlhttp.status ！= 200。便随手输出，发现xmlhttp.status=0，http协议里可是没这个状态码的。最后翻啊翻啊，找啊找啊，最后找到一个XMLHttpRequest的说明：http://www.w3.org/TR/XMLHttpRequest/ 。
The status attribute must return the result of running these steps:
status的值一定会返回运行这些步骤的结果。

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状态码）

如果在HTTP返回之前就出现上面两种情况，就出现0了。
先说两个button，一个是url是：file:///E:/test2.html，另外一个是：http://www.baidu.com。

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

第二个button的url访问虽然是其他域名，抓包是有的，但是，这是跨域访问了，
If the cross-origin request status is network error

This is a network error.

虽然去访问了，应该是浏览器跨域的返回头没有允许，所以浏览器阻止，Access-Control-Allow-Origin这个属性。

真确的方法是在自己的服务器，访问自己域名内的url。

阅读全文

0 0