使用PHP&;jQuery并将其保存到目标文件夹


Rotate an image using PHP & jQuery and save it to target folder

这不是一个问题,它将与数百万像我这样的兄弟分享知识。我已经工作了几个小时,使用PHP和jquery旋转图像并动态替换图像。这个例子将为您提供更多的说明。

此示例基于Cakephp2.5。所以不要惊慌。我的Dom看起来像

<div class="review-col campaign_image_upload_section">
    <?php
     echo $this->Campaign->image($campaign, 200, 200, true);
    ?>
</div>

在Html中,它像一样返回

<img alt="" src="http://192.168.100.96/XXX/XXX/XXX/files/timthumb.php?src=http://192.168.100.96/XXX/XXX/XXX/app/webroot/files/campaign/image/14/lost_home.jpg&amp;q=95&amp;w=200">

我在rotate链接上绑定了一个jQuery事件。您可以使用带有roate_right类名的简单html链接。事件绑定在"rotate_right"类上。我的AJAX请求看起来像

$(".rotate_right").click(function (event) {
            event.preventDefault();
            $(".campaign_image_upload_section").html(loading());
            $.ajax({
                url: $(this).attr('href'),
                type: "POST",
                dataType: 'json',
                success: function (res) {
                    if (res.status) {
                        //You only could replace image src too
                        $(".campaign_image_upload_section").html("<img src='"+decodeURIComponent(res.src)+"' width=200 height=200>");
                    }
                    else {
                        alert("error in rotating");
                    }
                }
            });
            return false;
        })

在jQuery的加载函数中,我只向特定的div显示一个加载图像。我被调用的PHP函数看起来像

public function rotate_image_right() {
        // File and rotation
        //You could use $_GET or pass parameters to this function
        $filename = $this->params->query('image');
        //PHP's imagerotate function will rotate counter clock wise. If you give 90 degree it will rotate left. use 270 to rotate on time    
        $degrees = 270;
// Content type - (uncomment below line to show out put in the browser)
//        header('Content-type: image/jpeg');
// Load
        $source = imagecreatefromjpeg($filename);
// Rotate
        $rotate = imagerotate($source, $degrees, 0);

        //I am fetching my campaign because to set directory path.
        $campaign = $this->Campaign->getData($this->params->query('id'));
// Output
        //Set current file name
        $cur_file = $this->params->query('image_name');
        $path_info = pathinfo($cur_file);
        strtolower($path_info['extension']);
        try{
        if ($path_info['extension'] == 'jpg' || $path_info['extension'] == 'jpeg') {
            $function = 'imagejpeg';
        } else {
            $function = 'image' . $path_info['extension'];
        }
        {catch (Exception $e) {
         // Handle invalid file
        }
        //My output directory - You change according to your uses
        $output_dir = WWW_ROOT . "files/campaign/image/" . $campaign["Campaign"]["id"] . "/";
        $function($rotate, $output_dir . $cur_file);
        imagedestroy($rotate);
        $response["status"] = true;
        $response["src"] = urlencode(Router::url("/", true) . 'files/campaign/image/' . $campaign["Campaign"]["id"] . '/' . $cur_file);
        //We must encode first to send back data to AJAX
        echo json_encode($response);
        exit;
    }

最后,我对这个代码的调用在下面

<?php echo $this->Html->link("Rotate", array("controller" => "campaigns", "action" => "rotate_image_right?image=" . WWW_ROOT . "files/campaign/image/" . $campaign["Campaign"]["id"] . "/" . $campaign["Campaign"]["image"] . "&id=" . $campaign["Campaign"]["id"] . "&image_name=" . $campaign["Campaign"]["image"]), array("class" => "rotate_right")); ?>

只是猜测(那里有很多代码,通常我们喜欢询问者将问题代码隔离到+-10行),但我认为您缺少

// Output
imagejpeg($rotate);

如CCD_ 1的PHP文档中所建议的。

以及imagejpeg上的文档来解释该函数的工作原理(我相信您会将文件名作为第二个参数传递)。