Using this script "PHP and Jquery image upload and crop": http://www.webmotionuk.com/php-jquery-image-upload-and-crop/ I want to upload file not from local, but from URL. Any ideas how I must to do it?
I'm trying to do this like that
<form name="photo" action="test.php" method="post">
<input type="hidden" name="zdj_tmp" value="E:\WebServ3\httpd\telebim\zdjecia\<? echo $select_zdjecie_2["id_4"]; ?>.jpg"/>
<input type="hidden" name="zdj_name" value="<? echo $select_zdjecie_2["id_4"]; ?>.jpg"/>
<input type="hidden" name="zdj_size" value="7340043"/>
<input type="hidden" name="zdj_type" value="image/jpeg"/>
<input type="submit" name="upload" value="Upload" />
</form>
And than in php file
$userfile_name = $_POST['zdj_name'];
$userfile_tmp = $_POST['zdj_tmp'];
$userfile_size = $_POST['zdj_size'];
$userfile_type = $_POST['zdj_type'];
But it doesn't work.
Any ideas?
Try this.
<form action="test.php" method="POST">
<input type="text" name="fileURL" placeholder="URL to image">
<input type="submit" name="upload" value="Upload files"/>
</form>
Here is the PHP
//Get the file from the URL.
$content = file_get_contents($_POST['fileURL']);
//Open the file that exists in your root already
$fp = fopen("/location/to/save/image.jpg", "w");
//Copy the information into the existing image
fwrite($fp, $content);
fclose($fp);
This takes the information from the image, and copies (overwrites) it into your existing image, which is, well, just some useless image.
You can then load the image from your roots.
It's not the best way, since your original image will be messed up, and is only usable once, since other users will change it, and there are other better ways. But if your site is a very not-popular kind of site, and you just want to test some methods out, this is definitely one kind of way. Just not the best.
Related
I created a working clientside upload script for cloudinary. The important part of the upload:
<?php
$cloudName = "...";
$apiKey = "...";
$time = time();
$apiSecret = "...";
$fileName = "...";
?>
<form action="https://api.cloudinary.com/v1_1/<?php echo $cloudName;?>/image/upload" method="post" enctype="multipart/form-data">
<label for="file">Filename:</label>
<input type="file" name="file" id="file"><br>
<input type="hidden" name="signature" value="<?php echo sha1('public_id='.$fileName.'×tamp='.$time.$apiSecret);?>" />
<input type="hidden" name="api_key" value="<?php echo $apiKey; ?>"/>
<input type="hidden" name="timestamp" value="<?php echo $time; ?>" />
<input type="hidden" name="public_id" value="<?php echo $fileName; ?>" />
<input type="submit" name="submit" value="Submit">
</form>
Now I want to add a transformation to the upload, so the uploads are transformed before they are stored (to save storage space).
I tried adding the following code (where resize is a transformation I created in my cloudinary account).
<input type="hidden" name="transformation" value="resize" />
But a request with a transformation field results in a 401 unauthorized error. I suppose I have to do something with the signature, but what?
You can use the cl_form_tag from the cloudinary PHP client library to build the form with all the input tags. However, you might want to use the jQuery direct upload which gives you better control and is more customizable UI-wise. See here. If you can't use the PHP client library for some reason there are two issues in the code:
A named transformation can be used by prefixing it by t_. So the value of the transformation field should be t_resize.
The transformation parameter needs to be added to the signature. Note that the parameter names need to be in alphabetical order when signed.
I'm struggling on letting the user upload and image to an image field on the HTML doc. When i test it, i can select which image to upload and then click "UPLOAD" but it doesn't go anywhere or go to the field i want to designate it to.
<input name="imgfield" type="image" width="100" height="100">
<form action="" method="post" enctype="multipart/form-data" name="form1" id="form1">
<p>
<label for="file">Select Picture</label>
<input type="file" name="file" id="file" />
<input type="submit" name="btn_uploadpic" id="btn_uploadpic" value="UPLOAD"
<?php
if (isset($_POST['btn_uplaodpic']))
{
$id=$_POST['imgfield'];
}
?>/>
</p>
</form>
When uploading a file, you won't get the uploaded file in $_POST, but in $_FILES. Check here for a quite detailed example on how to upload files with PHP:
http://www.w3schools.com/php/php_file_upload.asp
You have to refer to a temporary filename, using files, you can do something like
$_FILES['imgfield']['tmp_name']; // temp_name can be anything
If referring to 'name' isn't enough then give the input an 'id' of value 'imgfield'
I succeeded in storing all the image information as a blob in MySQL via the form tag and php.
Now I'm trying to make an update form using PHP5. However, I'm not sure how to take all the information back from MySQL and show it to users that an image has been already posted.. like any other typical forum / blog pages that shows previously added files.
Any suggestions..? Thank you.
<form method="post" enctype="multipart/form-data" action="UpdateNewsPHP.php">
Title : <input name='TitleFieldToAdd' type='text' size='20' value='<?php echo $row["Title"] ?>'/> <br/>
Thread : <textarea name='ThreadFieldToAdd' cols="40" rows="10"><?php echo $row["Thread"] ?></textarea> <br/>
<!-- Here I have no clue how to deal with them... :( -->
Image : <input type="hidden" name="MAX_FILE_SIZE" value="10000000" />
<input type="file" id='ImageFieldToAdd' name="files[]" /> <br/>
<input id="submit" type="submit" name="submit" value="Upload me!">
and this is the information I store in MySQL
$title = $_REQUEST['TitleFieldToAdd'];
$thread = $_REQUEST['ThreadFieldToAdd'];
$file_content = file_get_contents($_FILES['files']['tmp_name'][0]);
$file_content = mysql_real_escape_string($file_content);
$file_name = $_FILES['files']['name'][0];
$file_size = $_FILES['files']['size'][0];
$file_type = $_FILES['files']['type'][0];
$datePosted = date("Y-m-d");*/
The proper way is to leave your file upload stuff asis. If a file has already been uploaded, you display it another section of the form. Imgs can be embedded with an <img> tag (pointing at another script which retrieves/serves up the raw image data from the database). Non-displayable fields (pdf, zip, etc..) you can just put in a direct download link.
Then your form will look something like
[input1]
[input2]
You previously uploaded: [link/image to uploaded data]
[input file] - would you like to replace this data?
As such, your form building script would not actually retrieve the uploaded file data. Just its metadata (type/size).
Post Updated: After commentors advice.
Index.php
<?php
$id = uniqid("");
?>
</head>
<body>
<form method="post" action="frame.php" target="upload_iframe" enctype="multipart/form-data">
<label for="file">Filename:</label>
<input type="file" name="file" id="file" />
<input type="hidden" name="APC_UPLOAD_PROGRESS" id="progress_key" value="<?php echo $id; ?>"/>
<br />
<input type="submit" name="submit" value="Submit" />
</form>
<iframe name="upload_iframe" style="width: 400px; height: 100px;">
</iframe>
frame.php
<?php
if(isset($_POST['progress_key'])) {
echo "hey1";
$status = apc_fetch('upload_'.$_POST['progress_key']);
echo $status['current']/$status['total']*100;
}
echo "hey2";
?>
Still doesnt work :(, I dont even get POST form data in frame. Where am i going so wrong?
Regards.
Whenever you use the APC file upload mechanism, you need to add an additional parameter to your form that identifies the file that's being uploaded, and is the key for your apc_fetch.
<?php $id = uniqid(time()); ?>
<input type="hidden" name="APC_UPLOAD_PROGRESS" id="myUniProgressKey" value="<?php echo $id; ?>"/>
As the file is uploaded the value in the key upload . $id will contain the info you need to display the progress bar. Easiest way to get to is to ajax poll the server, using the apc_fetch call you have. This dictates that your upload page needs to not refresh the current page the user is on. I've used an iframe in the past that kicks off an interval to poll the server. Once the upload is complete, you're able to show a nice complete message in the same iframe.
Well, I've got a page with HTML like this:
<form method="post" action="" enctype="multipart/form-data">
<!-- Some more markup -->
<form method="post" action="" enctype="multipart/form-data">
<input type="submit"name="reset_ph" value="<?php _e('Reset styles'); ?>" />
<input type="hidden" name="subaction" value="reset_ph" />
</form>
<p><input name="update" type="submit" value="<?php _e('Save changes'); ?>" style="padding:3px;" /></p>
<input type="hidden" name="action" value="update" />
</form>
Then PHP code:
//updating main form
if(isset($_FILES['phtfile']['name']) && $_REQUEST['action']=='update'){
$def_path = TEMPLATEPATH.'/img/author/';
$file_path = $def_path.basename($_FILES['phtfile']['name']);
$file_path = str_replace('\\','/',$file_path);
$file_css_path = get_bloginfo('template_url');
$file_css_path = $file_css_path.'/img/author/'.basename($_FILES['phtfile']['name']);
$isfile = move_uploaded_file($_FILES['phtfile']['tmp_name'],$file_path);
if ($isfile) { update_option('own_pht_url', $file_css_path);}
}
//update subform
if ($_POST['subaction']=='reset_ph'){
global $photo_path;
update_option('own_pht_url', $photo_path.'tmp.jpg');
}
Subform contains a button, that resets image shown to default one (via setting path to image to default). Main form contains the image upload dialog, and should change path to image to a new one, should the file be uploaded. But updating the main form, updates the subform, and path is set to default.
I've figured a workaround, by changing the button to a checkbox, but I'm still interested, does updating the master form always updates every sub-form inside it? No ways around it?
Thank you for your time.
Nested forms are known to cause problems. You can check out this thread:
Why WHATWG disallows nested forms in HTML 4 and HTML5?