2
나는 파일을 가져 와서 처리하고 업로드 한 업로드 스크립트를 작성하고 있습니다. 처리에는 몇 분이 걸릴 수 있습니다. 사용자 피드백을 제공하기 위해 현재 수행중인 작업은 실제 업로드 중에 업로드 막대를 표시하는 것입니다. 업로드가 끝나면 "처리 중"메시지로 바꾸십시오. 파일 처리가 끝나면 메시지는 새 파일에 대한 링크로 바뀝니다. 이것은 크롬에서 잘 작동하지만 파이어 폭스에서는 99.9 %까지만 진행률 막대를 얻을 수 있습니다. 연결을 닫기 전에 업로드가 완료되었는지 확인할 수있는 방법이 있습니까? 여기 AJAX가있는 Firefox에서 진행 이벤트가 100 %에 도달하지 않습니다.
내가 현재outter = $(".item_box")[0];//content wrapper
inner = outter.children[0];//content viewer, will be replaced with messages and content
var p = document.createElement("progress");
p.className = "uploadprogress";
p.value = "0";
p.max = "100";
inner.textContent = "";
inner.appendChild(p);//replace initial "click here" message with progress bar
var formData new FormData();
for (var i = 0; i < files.length; i++)//files is defined elsewhere and contains form data
{
formData.append('userfile', files[i]);
}
// now post a new XHR request
var xhr = new XMLHttpRequest();
xhr.open('POST', base_url+'upload/upload_media');//url of php script
xhr.responseType = "json";
xhr.onreadystatechange = function() {
if (xhr.readyState == 4)//ajax request complete
{
p.value = p.innerHTML = 100;//set progress bar to 100%
var data = JSON.parse(xhr.responseText);//my returned json object
outter.removeChild(inner);
var v = document.createElement("video");
v.controls = "controls";
v.innerHtml = data.msg;
outter.appendChild(v);
}
}
xhr.upload.onprogress = function (e)//handles progress bar value
{
if (e.lengthComputable)
{
var done = e.position || e.loaded, total = e.totalSize || e.total;
p.value = p.innerHTML = (Math.floor(done/total*1000)/10);
if (done == 100)//this never happens in firefox
{
inner.removeChild(p);
inner.textContent = "processing... please wait";
}
}
}
xhr.send(formData);