jQuery POST到GD图像创建页面

时间:2011-10-19 15:25:32

标签: php jquery gd

我有一个jquery表单发布到回调页面。回调页面使用PHP的GD库来创建图像。

PHP代码如下所示:

<?php
include 'inc/config.php';

$caseNum = $_POST['caseNum'];
$wish = $_POST['wish'];
$selectedWishes = join(", ", $wish);
$fname = $_POST['fname'];
$middlename = $_POST['middlei'];
$lname = $_POST['lname'];
$address1 = $_POST['adr1'];
$address2 = $_POST['adr2'];
$city = $_POST['city'];
$state = $_POST['state'];
$zip = $_POST['zip'];
$phone = $_POST['phone'];
$email = $_POST['email'];
$recipt = $_POST['recipt'];

$terms_accepted = $_POST['tou'];

if ($terms_accepted == 'accept') {

    mysql_connect($db_host, $db_user, $db_pass);
    mysql_select_db($db_database);

    $select = mysql_query('SELECT * FROM children WHERE caseNumber="'.$caseNum.'" LIMIT 1 ');
    $row = mysql_fetch_array($select);

    header('Content-type: image/png');
    $im = imagecreatefrompng ("images/card_bg.png");
    $color = imagecolorallocate($im, 0, 0, 0);
    $font = 'inc/fonts/MyriadPro-Regular.otf';
    $size = 14;
    imagettftext($im, $size, 0, 130, 18, $color, $font, $caseNum);
    imagettftext($im, $size, 0, 52, 105, $color, $font, $row['age']);
    imagettftext($im, $size, 0, 108, 167, $color, $font, $row['name']);

    // Print wishes and word wrap
    $lines = explode('|', wordwrap($selectedWishes, 30, '|'));
    $y = 238;
    foreach ($lines as $line) {
    imagettftext($im, $size, 0, 18, $y, $color, $font, $line);
    $y += 23;
    }

    imagettftext($im, $size, 0, 339, 151, $color, $font, $fname.' '.$middlename.' '.$lname);
    imagettftext($im, $size, 0, 351, 175, $color, $font, $address1);
    imagettftext($im, $size, 0, 365, 196, $color, $font, $address2);
    imagettftext($im, $size, 0, 326, 218, $color, $font, $city);
    imagettftext($im, $size, 0, 474, 218, $color, $font, $zip);
    imagettftext($im, $size, 0, 340, 242, $color, $font, $phone);
    imagettftext($im, 9, 0, 333, 268, $color, $font, $email);

    if ($row['gender'] == 'male') {
        $check = imagecreatefrompng('images/checkmark.png');
        imagealphablending($check, true);
        imagesavealpha($check, false);
        imagecopymerge($im, $check, 74, 3, 0, 0, 10, 15, 80);
    }
    else if ($row['gender'] == 'female') {
        $check = imagecreatefrompng('images/checkmark.png');
        imagealphablending($check, true);
        imagesavealpha($check, false);
        imagecopymerge($im, $check, 74, 38, 0, 0, 10, 15, 80);
    }

    if ($recipt == 'yes') {
        $check = imagecreatefrompng('images/checkmark.png');
        imagealphablending($check, true);
        imagesavealpha($check, false);
        imagecopymerge($im, $check, 324, 383, 0, 0, 10, 15, 80);
    }
    else if ($recipt == 'no') {
        $check = imagecreatefrompng('images/checkmark.png');
        imagealphablending($check, true);
        imagesavealpha($check, false);
        imagecopymerge($im, $check, 367, 383, 0, 0, 10, 15, 80);
    }


    $imageName = rand();
    $ourFileName = $imageName.'.png'; 
    $ourFilePath = 'images/created_tags/';

    imagepng ( $im, $ourFilePath.$ourFileName );

    imagepng($im);
    imagepng($check);
    imagedestroy($check);
    imagedestroy($im); 

    readfile ( $ourFileName );

print $ourFilePath.$ourFileName;

    exit ();  

}


?>

这里是jQuery:

$.post('selectChildCallback.php', $("#select_child_form").serialize(), function(data) {

                $("#post_image").append('<img src="'+ data.path +'" alt="card" />');

            }, 'json');

我无法弄清楚如何使回调页面不显示图像,而只显示路径。现在它打印图像数据而不是图像路径。

1 个答案:

答案 0 :(得分:2)

readfile ( $ourFileName );

这一行是问题所在。根据{{​​3}},它将文件的内容回显到屏幕上。所以PHP返回一个图像文件(二进制),其文件名连接到流的末尾,返回jQuery。

删除此行,这应该可以。

修改

imagepng ( $im, $ourFilePath.$ourFileName );

imagepng($im);
imagepng($check);

为什么要拨打docs 3次?如果您没有给它第二个参数,它会将图像回显到屏幕上。同时删除最后2 imagepng行。 PHP实际上返回了连接在一起的3个图像以及文件名。

它应该是这样的:

$imageName = rand();
$ourFileName = $imageName.'.png'; 
$ourFilePath = 'images/created_tags/';

imagepng($im, $ourFilePath.$ourFileName);

imagedestroy($check);
imagedestroy($im); 

echo $ourFilePath.$ourFileName;

exit();