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>
check.php
<?php $username = $_GET['username']; $password = $_GET['password']; if ($username == '1' && $password == '1') { echo 2; }else { echo 1; }?>
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。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
