How can PHP be used in conjunction with JavaScript to achieve the desired image resizing functionality in a web application?

To achieve image resizing functionality in a web application, PHP can be used to handle the server-side processing of the images, while JavaScript can be used to interact with the user interface and trigger the image resizing functionality. PHP can receive the uploaded image file, resize it using a library like GD or Imagick, and then send the resized image back to the client-side for display. 

<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_FILES['image'])) {
    $target_dir = "uploads/";
    $target_file = $target_dir . basename($_FILES["image"]["name"]);
    $imageFileType = strtolower(pathinfo($target_file, PATHINFO_EXTENSION));

    if ($imageFileType == "jpg" || $imageFileType == "png" || $imageFileType == "jpeg") {
        $temp_file = $_FILES["image"]["tmp_name"];
        $resized_file = "resized_" . $_FILES["image"]["name"];
        $resized_image = imagecreatefromjpeg($temp_file);

        $new_width = 200; // Set desired width
        $new_height = 200; // Set desired height
        $resized_image = imagescale($resized_image, $new_width, $new_height);

        imagejpeg($resized_image, $target_dir . $resized_file);

        echo json_encode(array('success' => true, 'resized_image' => $resized_file));
    } else {
        echo json_encode(array('success' => false, 'message' => 'Invalid file type. Only JPG, JPEG, and PNG files are allowed.'));
    }
}
?>

Keywords

PHP JavaScript image resizing web application functionality

Related Questions