2012-07-30 68 views
0

我知道這一種聽起來很愚蠢......它應該在那裏工作......但:新的XMLHttpRequest()在Chrome不起作用?

function fetch(id){ 
    var fetch = new XMLHttpRequest(); 
    fetch.open("GET", "/upload/status?X-Progress-ID=" + id); 
    fetch.onreadystatechange = function() { 
     console.log(fetch.readyState); 
    } 
    fetch.send(null); 
} 

此代碼在IE,Firefox中......我得到的所有4個狀態返回......但是當我嘗試在鉻我得到絕對沒有...我絕對不知道爲什麼...

我想你已經猜到了這個問題,爲什麼它不工作?

編輯

改變了代碼一點點......如你也許已經猜到了,我nginx的上傳進度模塊工作,並調用該函數everysecond獲得上傳的進度文件...

編輯1

嗯,我試圖重寫的東西$。阿賈克斯(),我基本上得到了相同的結果.. IE,火狐的作品,和鉻只是給我什麼。下面是頁面的全碼:

<!doctype html> 
<html lang="ru"> 
<head> 
    <meta charset="utf-8"> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> 
    <script src="static/js/jquery-ui-1.8.21.custom.min.js" type="text/javascript"></script> 
    <script> 
    function add() { 
     if (parseInt(document.getElementById('count').getAttribute('value')) < 8) { 
     var input = document.createElement('input'); 
     input.setAttribute('type','file'); 
     input.setAttribute('multiple',''); 
     input.setAttribute('name','file[]'); 
     document.getElementById('multiple').appendChild(input); 
     document.getElementById('multiple').appendChild(document.createElement('br')); 
     document.getElementById('count').setAttribute('value',parseInt(document.getElementById('count').getAttribute('value'))+1); 
     } 
     else { 
     alert('Можно загрузить не более 8 файлов за раз.'); 
     } 
    } 
    function progress() { 
     var ms = new Date().getTime()/1000; 
     rq = 0; 
     id = ""; 
     for (i = 0; i < 32; i++) { 
     id += Math.floor(Math.random() * 16).toString(16); 
     } 
     document.getElementById('upload').action = "/upload/share?X-Progress-ID=" + id; 
//  console.log("/upload/share?X-Progress-ID=" + id); 
     document.getElementById('status').style.display = 'block' 
     interval = window.setInterval(function() { fetch(id, ms); }, 1000); 
     return true; 
    } 
    function fetch(id, ms) { 
//  console.log("/upload/status?X-Progress-ID=" + id); 


     $.ajax({ 
     type: "GET", 
     url: "/upload/status?X-Progress-ID="+id, 
     dataType: 'text', 
     complete: function(upload) { 
      console.log('test'); 
      alert('test'); 
     } 
     }); 

//  var fetch = new XMLHttpRequest(); 
//  fetch.open("GET", "/upload/status", 1); 
//  fetch.setRequestHeader("X-Progress-ID", id); 
//  fetch.open("GET", "/upload/status?X-Progress-ID=" + id); 
//  fetch.setRequestHeader("X-Progress-ID", id); 

//  fetch.onreadystatechange = function() { 
//  console.log('rorororo'); 
//  console.log(fetch.readyState); 
//  if (fetch.readyState == 3) { 
//   console.log(fetch.responseText); 
// 
////   if (fetch.status == 200) { 
// 
//   var now = new Date().getTime()/1000; 
//   var upload = eval(fetch.responseText); 
// 
//   if (upload.state == 'uploading') { 
//    var diff = upload.size - upload.received; 
//    var rate = upload.received/upload.size; 
//    var elapsed = now - ms; 
//    var speed = upload.received - rq; rq = upload.received; 
//    var remaining = (upload.size - upload.received)/speed; 
//    var uReceived = parseInt(upload.received) + ' bytes'; 
//    var uDiff = parseInt(diff) + ' bytes'; 
//    var tTotal = parseInt(elapsed + remaining) + ' secs'; 
//    var tElapsed = parseInt(elapsed) + ' secs'; 
//    var tRemaining = parseInt(remaining) + ' secs'; 
//    var percent = Math.round(100*rate) + '%'; 
//    var uSpeed = speed + ' bytes/sec'; 
//    document.getElementById('length').firstChild.nodeValue = parseInt(upload.size) + ' bytes'; 
//    document.getElementById('sent').firstChild.nodeValue = uReceived; 
//    document.getElementById('offset').firstChild.nodeValue = uDiff; 
//    document.getElementById('total').firstChild.nodeValue = tTotal; 
//    document.getElementById('elapsed').firstChild.nodeValue = tElapsed; 
//    document.getElementById('remaining').firstChild.nodeValue = tRemaining; 
//    document.getElementById('speed').firstChild.nodeValue = uSpeed; 
//    document.getElementById('bar').firstChild.nodeValue = percent; 
//    document.getElementById('bar').style.width = percent 
//   } 
//   else { 
//    window.clearTimeout(interval); 
//   } 
////   } 
//  } 

//  } 
//  fetch.send(null); 
    } 
    </script> 
</head> 
<body> 
<form method="post" enctype="multipart/form-data" id="upload" onsubmit="progress();"> 
    <input type="hidden" id="count" value="1" /> 
    <input type="hidden" value="GOBLEBOELBOE" name="secret"> 
    <div id="multiple"> 
    <input type="file" name="file[]" multiple /><br> 
    </div> 
    <input type="submit"> 
    <a href="#" onclick="add();">add();</a> 
</form> 
<div id="status" style="display: none;"> 
    <table width="100%"> 
    <tr><th></th><th>загрузка</th><th>осталось</th><th>всего</th></tr> 
    <tr><td>время:</td><td id="elapsed">∞</td><td id="remaining">∞</td><td id="total">∞</td></tr> 
    <tr><td>размер:</td><td id="sent">0 b</td><td id="offset">0 b</td><td id="length">0 b</td></tr> 
    <tr><td>скорость:</td><td id="speed">n/a</td></tr> 
    </table> 
    <div style="border: 1px solid #c0c0c0;"> 
    <div style="background: #c0c0c0; width: 0%; text-align: right;" id="bar">0%</div> 
    </div> 
    <a href="#" onclick="if (confirm('Вы точно хотите отменить загрузку?')) window.location = '/'" id="cancel">cancel_upload();</a> 
</div> 
</body> 
</html> 

答:http://code.google.com/p/chromium/issues/detail?id=45196

回答

0

你應該添加此

fetch.send(null) 

的open()

初始化請求。這個方法是從JavaScript代碼中使用的;要從本地代碼初始化請求,請改爲使用openRequest()。

send()

發送請求。如果該請求是異步的(這是默認值),這種方法一旦請求被髮送返回。如果請求是同步的,那麼直到響應已到達,此方法纔會返回。

MDN

+0

它的存在......抱歉,沒有把我的代碼... – Viktor 2012-07-30 12:06:13

+0

是否有在控制檯的任何異常。 – xiaowl 2012-07-30 12:11:02

+0

看我編輯的代碼有點...不,絕對不會有例外......這是最主要的問題..它是不是在所有叫....因爲如果我在這裏CONSOLE.LOG一些隨機字符串'fetch.onreadystatechange = function(){}',它絕對沒有打印.... – Viktor 2012-07-30 12:12:20