Я делаю это как учебное упражнение, и я все еще новичок в PHP. Я знаю еще меньше о javascript:Обновить изображение без перезагрузки страницы?
Сценарий, который я пишу, должен позволять пользователю загружать изображение со своего жесткого диска, разрешать пользователю изменять его с помощью некоторых элементов управления на странице, а затем отображать измененные образ.
В настоящее время я использую PHP только для этого, и для этого требуется, чтобы пользователь установил параметры элементов управления, а затем POST (требуя полной перезагрузки страницы). Может ли кто-нибудь указать мне в сторону лучшего способа сделать это? Есть ли что-нибудь подобное, чтобы я мог взглянуть?
Было бы здорово, если бы я мог в конечном итоге обновить изображение в режиме реального времени, когда пользователь сместил элемент управления. Я ищу javascript? AJAX?
Вот базовая версия моего кода:
<?php session_start(); ?>
<html>
<head>
<script>
<?php
if(isset($_POST['upload_submit'])) { // PROCESS UPLOAD FORM//////////////////////////////////////////////////////
$tmp_file = $_FILES['file_upload']['tmp_name'];
$filename = basename($_FILES['file_upload']['name']);
$_SESSION['file_name'] = $filename; // load filename into SESSION so that it survives page reloads from POST
move_uploaded_file($tmp_file, $filename);
}
if(isset($_POST['process_submit'])){ // PROCESS CONTROL FORM//////////////////////////////////////////////////////
$im = imagecreatefromjpeg($_SESSION['file_name']);
imagefilter($im, IMG_FILTER_COLORIZE, $_POST['colred'], $_POST['colgreen'], $_POST['colblue'], $_POST['colalpha']);
imagejpeg($im, "newimage.jpg"); //output to file
imagedestroy($im); // free memory
$_SESSION['Modified'] = TRUE; // flag that the image has been modified so that the page will display newimage.jpg instead of original
}
?>
</script>
</head>
<body>
<?php
if(isset($_SESSION['Modified'])){ // Image has been modified at least once (display modified image. do not display upload form)
echo("<img src='newimage.jpg' width='400px'><br />");
}elseif(isset($_FILES['file_upload']['name'])) { // Image has been uploaded but not yet modified (do not display upload form)
echo("<img src=$filename . ' 'width=400px'><br />");
} else { // FIRST State that the form is in when the page is loaded. (No image uploaded so display upload form)
echo("<form action='index.php' enctype='multipart/form-data' method='POST'>
<input type='file' name='file_upload' />
<input type='submit' name='upload_submit' value='Upload' />
</form>");
}
echo("<form action='index.php' method='post'><br />"); // display form with 4 slider controls (Red, Green, Blue, Alpha) and a submit button
echo("<table>");
echo (isset($_POST['colred'])) ? "<tr><td>Red:</td><td> 0<input type='range' name='colred' min='0' max='255' value=" . $_POST['colred'] . ">255</td></tr>"
:"<tr><td>Red:</td><td> 0<input type='range' name='colred' min='0' max='255'>255</td></tr>";
echo (isset($_POST['colgreen'])) ? "<tr><td>Green:</td><td> 0<input type='range' name='colgreen' min='0' max='255' value=" . $_POST['colgreen'] . ">255</td></tr>"
: "<tr><td>Green:</td><td> 0<input type='range' name='colgreen' min='0' max='255'>255</td></tr>";
echo (isset($_POST['colblue'])) ? "<tr><td>Blue:</td><td> 0<input type='range' name='colblue' min='0' max='255' value=" . $_POST['colblue'] . ">255</td></tr>"
: "<tr><td>Blue:</td><td> 0<input type='range' name='colblue' min='0' max='255'>255</td></tr>";
echo (isset($_POST['colalpha'])) ? "<tr><td>Alpha:</td><td> 0<input type='range' name='colalpha' min='0' max='255' value=" . $_POST['colalpha'] . ">127</td></tr>"
: "<tr><td>Alpha:</td><td> 0<input type='range' name='colalpha' min='0' max='255' value='127'>255</td></tr>";
echo("</table>");
echo("<button name='process_submit'>Process</button>");
echo("</form>");
?>
</body>
</html>
Попробуйте загрузить изображение с помощью javascript. Вы даже можете сделать предварительную загрузку! – www139
PHP будет работать только один раз, прежде чем страница загрузится в браузере. после этого все, что вы можете сделать с php, - это запросить новую страницу (или, возможно, запросить страницу с ajax). в любом случае вы хотите использовать javascript для обработки страниц in situ. – Octopus