php - XMLHttpRequest POST 到 PHP 删除加号

Question

我使用 HTML5 canvas 元素将 JPEG 文件作为字符串发送到 PHP:

function createJPG() {
    var dataUrl = document.getElementById('canvas').childNodes[4].toDataURL("image/jpeg");
    console.log(dataUrl);
    var params = "theimage=" + dataUrl;
    var http = new XMLHttpRequest();
    http.open("POST", "/avatar/php/save-avatar.php", true);
    http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    http.send(params);
}

一切正常，dataUrl 正确(在控制台中)并且包含有效的 JPEG 文件。但是当我用 PHP 检索它时，所有加号都被空格替换了吗？

PHP 代码:

$name = "image.jpg";
$data=$_POST['theimage'];

file_put_contents($name, base64_decode(substr($data, strpos($data, ",")+1)));
file_put_contents("../images/avatars/uploads/generated" . rand(0,200) . ".txt", $data);

我使用文本文件来查看数据的样子，因为我懒得弄清楚如何回显给 JS :)。文本文件包含与 JS 控制台日志完全相同的数据，但没有 +'es 而用空格代替，这会导致 JPEG 文件损坏。

我该怎么办？

Answer 1

它不会删除它们。 + 表示 application/x-www-form-urlencoded 数据中的“空格”。因此，当 URI 在服务器上解码时，它们会转换为空格。

总是获取一些数据并将其放入 URL 中，您需要 encode它:

var params = "theimage=" + encodeURIComponent(dataUrl);