通过 AJAX 将 canvas.toDataUrl() 发送到 php答案

【问题标题】：Sending a canvas.toDataUrl() to php via AJAX通过 AJAX 将 canvas.toDataUrl() 发送到 php
【发布时间】：2014-05-10 10:57:43
【问题描述】：

我正在尝试通过 AJAX 将 canvas.toDataUrl() 发送到 php 页面。

这是我的尝试：

JavaScript 代码：

function showUser() {
str = "url="+canvas.toDataUrl();

     if (window.XMLHttpRequest) {
             // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
     } else { // code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
       }
    xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
        document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
   }
    xmlhttp.open("GET","file.php?"+str,true);
    xmlhttp.send();
}

php:

<?php
   $url = $_GET['url'];
   echo "$url";
?>

上面的代码似乎不起作用，虽然我做了完全相同的事情，但使用了一个字符串值，如下所示：

    function showUser() {
str = "url=12345";

     if (window.XMLHttpRequest) {
             // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
     } else { // code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
       }
    xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
        document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
   }
    xmlhttp.open("GET","file.php?"+str,true);
    xmlhttp.send();
}

这个很好用，但是当我使用 canvas.toDataUrl() 它不起作用！？为什么？

还有其他方法可以将 canvas.toDataUrl() 发送到 php 吗？

谢谢

【问题讨论】：

IE 8-不支持<canvas>，所以你可以从你的代码中删除旧的浏览器位，还有，你在哪里vard xmlhttp和str？
在同一文件夹中的 html 文件中（我不确定我是否理解了这个问题）谢谢

标签： javascript php ajax html canvas

【解决方案1】：

已解决

问题是我试图通过 GET 发送大数据，我通过 POST 发送相同的（大）数据来解决它 POST 比 GET 复杂一点

以下是如何使用 POST 通过 AJAX 发送数据：

http://www.javascriptkit.com/dhtmltutors/ajaxgetpost2.shtml

我使用了链接中的代码，它适用于我任何有同样问题的人请参考上面的链接并使用 POST 而不是 GET

谢谢大家

【讨论】：

【解决方案2】：

我建议尝试这样的 javascript encodeURIComponent() 函数：

str = "url="+encodeURIComponent(canvas.toDataUrl());

问题是，dataurl 包含像“/”这样的符号，所以它可能会被错误地解释。让我知道这是否有效。

【讨论】：

/ 不会在 ? 之后被错误解释，因为您现在在搜索
你能不能试试console.log(canvas.toDataUrl()); 只是为了检查是否有任何东西来自那里。如果不是，那么您的变量画布可能有问题，超出了此函数的范围。
我刚试过，但我不确定它的作用。 alert(canvas.toDataUrl()) 工作正常并输出带有 url 的警告框，但未发送到 php 文件！谢谢
我只是尝试选择另一个画布（即在画布中绘制另一个图像）并且效果很好！问题是它不想要某个图像。为什么！？真奇怪
这确实很奇怪。我想不出任何可能的理由。很高兴您至少可以为某些图像工作。