0

我正在使用 kineticjs 库,并且我有一个脚本,它使用该toDataURL方法将舞台保存为图像,并使用XMLHttpReuest. 在将图像保存到服务器上时,所有工作都按预期工作,但一旦完成,我无法让页面重定向或更改。

我用于生成图像的 javascript/kineticjs 代码是:

function save() {
    stage.toDataURL({
        callback: function(dataUrl) {
            var ajax = new XMLHttpRequest();
            ajax.open("POST",'upload_screenshot.php?newname=<?php echo $newname;?>',false);
            ajax.setRequestHeader('Content-Type', 'application/upload');
            ajax.send(dataUrl);
        }
    });
}

我的 upload_screenshot.php 代码是:

<?php
if (isset($GLOBALS["HTTP_RAW_POST_DATA"])){

    $imageData=$GLOBALS['HTTP_RAW_POST_DATA'];
    $newname = $_GET['newname'];
    $imagefile = 'final_images/'.$newname.'.png';

    $filteredData=substr($imageData, strpos($imageData, ",")+1);
    $unencodedData=base64_decode($filteredData);

    $fp = fopen($imagefile, 'wb');
    fwrite($fp, $unencodedData);
    fclose($fp);

    header('Location: http://www.example.com');
}
?>

所以图像保存在服务器上,但我在 chrome javascript 控制台中收到以下错误:

Uncaught Error: NetworkError: DOM Exception 19 

这是什么意思?

如果我将 open 调用从 false(同步)更改:

ajax.open("POST",'upload_screenshot.php?newname=<?php echo $newname;?>',false);

为真(异步):

ajax.open("POST",'upload_screenshot.php?newname=<?php echo $newname;?>',true);

我现在将文件保存到服务器上而没有错误,但再次没有重定向到 example.com

4

2 回答 2

0

您的 php 脚本中的 header() 调用不会通过 ajax 请求重定向您的页面。您需要检查 ajax 请求的响应并使用 document.location = " http://example.com " 在 javascript 中执行重定向。

下面是一个如何对 ajax 响应执行回调函数的示例。

另外,我不确定您如何或在何处执行此 javascript,但如果它在外部 js 文件中,您<?php echo $newname; ?>将不会被执行。您需要找到一种更巧妙的方式将此信息传递给您的 javascript 函数。

于 2013-08-09T12:46:39.123 回答
-1

您不能在 POST 请求中指定查询字符串,这必须更改为下面的代码

            ajax.open("POST",'upload_screenshot.php',true);
            ajax.setRequestHeader('Content-Type', 'application/upload');
            ajax.send("newname='<?php echo $newname;?>'");
于 2013-08-09T12:42:57.737 回答