php post 请求字节,javascript – 使用PHP5获取发送POST请求的字节

注意我是

PHP,Apache和服务器编程的新手,所以更多的解释将不胜感激.

上下文

我在javascript中创建了一个进度条,以便在文件上传时显示.当前我已经按照设定的帧速率更新进度条(查看是否有效).

显然,为了使其成为一个准确的进度条,一切都应该与传输的字节数相比,总字节数.

使用PHP5如何获取关于文件总字节数传输的字节数的信息,以便我可以将其传递给JS函数updateProgress(bytesSoFar,totalBytes)来更新我的进度条?请详细地介绍下面的代码所需的修改,以使其正常工作.我已经看到了xhr的例子,但是它们并不是完全可以访问的.

我刚刚设置了LocalHost,并使用W3Schools的PHP File Upload教程.为了让模拟的“上传”工作,我改变了本S.O.中建议的本地权限. post.我不一定需要读取文件,我只想知道很多字节已被转移.

目前我有两个文件:

> index.php

> upload.php

的index.php

Select image to upload:

upload.php的

$target_dir = "uploads/";

$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);

$uploadOk = 1;

$imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);

// Check if image file is a actual image or fake image

if(isset($_POST["submit"])) {

$check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);

if($check !== false) {

echo "File is an image - " . $check["mime"] . ".";

$uploadOk = 1;

} else {

echo "File is not an image.";

$uploadOk = 0;

}

}

// Check if file already exists

if (file_exists($target_file)) {

echo "Sorry, file already exists.";

$uploadOk = 0;

}

// Check file size

if ($_FILES["fileToUpload"]["size"] > 500000) {

echo "Sorry, your file is too large.";

$uploadOk = 0;

}

// Allow certain file formats

if($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg"

&& $imageFileType != "gif" ) {

echo "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";

$uploadOk = 0;

}

// Check if $uploadOk is set to 0 by an error

if ($uploadOk == 0) {

echo "Sorry, your file was not uploaded.";

// if everything is ok, try to upload file

} else {

if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {

echo "The file ". basename( $_FILES["fileToUpload"]["name"]). " has been uploaded.";

} else {

echo "Sorry, there was an error uploading your file.";

}

}

?>

更新

我找到这个代码:

test.php的

if ($_SERVER["REQUEST_METHOD"] == "POST" && !empty($_FILES["userfile"])) {

// move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)

move_uploaded_file($_FILES["userfile"]["tmp_name"], "uploads/" . $_FILES["userfile"]["name"]);

}

?>

File Upload Progress Bar

#bar_blank {

border: solid 1px #000;

height: 20px;

width: 300px;

}

#bar_color {

background-color: #006666;

height: 20px;

width: 0px;

}

#bar_blank, #hidden_iframe {

display: none;

}

" method="POST" id="myForm" enctype="multipart/form-data" target="hidden_iframe">

">

function toggleBarVisibility() {

var e = document.getElementById("bar_blank");

e.style.display = (e.style.display == "block") ? "none" : "block";

}

function createRequestObject() {

var http;

if (navigator.appName == "Microsoft Internet Explorer") {

http = new ActiveXObject("Microsoft.XMLHTTP");

}

else {

http = new XMLHttpRequest();

}

return http;

}

function sendRequest() {

var http = createRequestObject();

http.open("GET", "progress.php");

http.onreadystatechange = function () { handleResponse(http); };

http.send(null);

}

function handleResponse(http) {

var response;

if (http.readyState == 4) {

response = http.responseText;

document.getElementById("bar_color").style.width = response + "%";

document.getElementById("status").innerHTML = response + "%";

if (response < 100) {

setTimeout("sendRequest()", 1000);

}

else {

toggleBarVisibility();

document.getElementById("status").innerHTML = "Done.";

}

}

}

function startUpload() {

toggleBarVisibility();

setTimeout("sendRequest()", 1000);

}

(function () {

document.getElementById("myForm").onsubmit = startUpload;

})();

progress.php

session_start();

$key = ini_get("session.upload_progress.prefix") . "myForm";

if (!empty($_SESSION[$key])) {

$current = $_SESSION[$key]["bytes_processed"];

$total = $_SESSION[$key]["content_length"];

echo $current < $total ? ceil($current / $total * 100) : 100;

$message = ceil($current / $total * 100) : 100;

$message = "$message"

echo "";

}

else {

echo 100;

}

?>

其中,像我之前的代码一样,传输文件.但是,直到结束为止,这并不显示字节(尽管应该提醒它),它也会打开一个带有“完成”的新窗口.声明在前一窗口.

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
前端可以通过浏览器提供的 `XMLHttpRequest` 对象或者 `Fetch API` 发送请求,并在请求完成后获取响应。然后通过以下代码可以获取响应体的大小: 使用 `XMLHttpRequest` 对象: ```javascript const xhr = new XMLHttpRequest(); xhr.open('GET', '/api/data'); xhr.onload = function() { const size = xhr.responseText.length; console.log('响应体大小为:', size, '字节'); }; xhr.send(); ``` 使用 `Fetch API`: ```javascript fetch('/api/data').then(response => { response.text().then(text => { const size = text.length; console.log('响应体大小为:', size, '字节'); }); }); ``` 注意:以上代码获取的是响应体的大小,如果需要获取请求参数的大小,则需要在发送请求时将参数转换为字符串并获取其长度。例如: 使用 `XMLHttpRequest` 对象: ```javascript const data = { name: 'example', age: 18 }; const str = JSON.stringify(data); const size = str.length; const xhr = new XMLHttpRequest(); xhr.open('POST', '/api/data'); xhr.setRequestHeader('Content-Type', 'application/json'); xhr.onload = function() { console.log('请求参数大小为:', size, '字节'); }; xhr.send(str); ``` 使用 `Fetch API`: ```javascript const data = { name: 'example', age: 18 }; const str = JSON.stringify(data); const size = str.length; fetch('/api/data', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: str }).then(response => { console.log('请求参数大小为:', size, '字节'); }); ```

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值