Php+js IFRAME Implementation upload Avatar Interface no jump _php tutorial

Source: Internet
Author: User
Tags imagejpeg
Upload Avatar, interface no jump way a lot, I used to add an iframe that kind. Directly below the code.

Html:
Copy CodeThe code is as follows:
The route is the back-end interface
Upload/avatar the saved address for the uploaded avatar
imgurl=/upload/avatar/ Here's the last is to use JS in the back of the real-time display of the latest replacement of the Avatar, referring to the following JS part of the code
Avatar save name is Uid.type, such as 1.jpg,2.png, etc.
$user [' Avatar '] if the user uploads an avatar, the Avatar field in the user's database will be given a timestamp, otherwise it is empty



Php:
Copy CodeThe code is as follows:
$token = param (' token ');
$user = User_from_token ($token);
! $user and Exit ("

$lang [User_not_exists]

");
File storage Path
$file _path= "./upload/avatar/";
664 permissions are file owners and group users can read and write, other users are read-only.
if (Is_dir ($file _path)! = TRUE) mkdir ($file _path, 0664);
Define the file extensions that are allowed to be uploaded
$ext _arr = Array ("GIF", "JPG", "JPEG", "PNG", "BMP");

if (empty ($_files) = = = False) {
Judgment check
$photo _up_size > 2097152 and Exit ("

Sorry, you have uploaded more than 2M photos

");
$_files["File" ["error"] > 0 and exit ("

File Upload error: ". $_files[" "File" ["Error"]. "

");
Get file name extension
$temp _arr = Explode (".", $_files["file" ["name"]);
$file _ext = Array_pop ($temp _arr);
$file _ext = Trim ($file _ext);
$file _ext = strtolower ($file _ext);
Check extension
if (In_array ($file _ext, $ext _arr) = = = = False) {
Exit ("

Upload file name extension is not allowed

");
}
Delete files with the same prefix in the directory
if ($dh = Opendir ($file _path)) {
while (($file = Readdir ($DH))!== false) {
$file _arr = $file. Split ('. ');
if ($file _arr[0] = = $user [' uid ']) unlink ($file _path. $file);
}
}
Rename file with UID
$new _name = $user [' uid ']. ".". $file _ext;
Move files to the storage directory
Move_uploaded_file ($_files["file"] ["Tmp_name"], $file _path. $new _name);
Crop compressed pictures
Clip ($file _path $new _name, $file _path. $new _name, 0, 0, 100, 100);
Clip_thumb ($file _path. $new _name, $file _path. $new _name, 100, 100);
Write file storage information to a data table to manage
User_update ($user [' uid '], array (' Avatar ' =>time ()));
Exit ("

File Upload Successful

");
} else {
Exit ("

No file upload is correct

");
}


function ext ($filename) {
Return Strtolower (substr (STRRCHR ($filename, '. '), 1));
}

/*
Instance:
Thumb (App_path ' xxx.jpg ', App_path ' xxx_thumb.jpg ', 200, 200);

Return:
Array (' FileSize ' =>0, ' width ' =>0, ' height ' =>0)
*/
function Thumb ($sourcefile, $destfile, $forcedwidth = up, $forcedheight = 80) {
$return = Array (' filesize ' =>0, ' width ' =>0, ' height ' =>0);
$imgcomp = 10;
$destext = ext ($destfile);
if (!in_array ($destext, Array (' gif ', ' jpg ', ' bmp ', ' png '))) {
return $return;
}

$imgcomp = 100-$imgcomp;
$imginfo = getimagesize ($sourcefile);
$SRC _width = $imginfo [0];
$SRC _height = $imginfo [1];
if ($src _width = = 0 | | $src _height = = 0) {
return $return;
}
$src _scale = $src _width/$src _height;
$des _scale = $forcedwidth/$forcedheight;

if (!function_exists (' imagecreatefromjpeg ')) {
Copy ($sourcefile, $destfile);
$return = Array (' FileSize ' =>filesize ($destfile), ' width ' = $src _width, ' height ' = $src _height);
return $return;
}

Abbreviated by the prescribed ratio
if ($src _width <= $forcedwidth && $src _height <= $forcedheight) {
$des _width = $src _width;
$des _height = $src _height;
} elseif ($src _scale >= $des _scale) {
$des _width = ($src _width >= $forcedwidth)? $forcedwidth: $src _width;
$des _height = $des _width/$src _scale;
$des _height = ($des _height >= $forcedheight)? $forcedheight: $des _height;
} else {
$des _height = ($src _height >= $forcedheight)? $forcedheight: $src _height;
$des _width = $des _height * $SRC _scale;
$des _width = ($des _width >= $forcedwidth)? $forcedwidth: $des _width;
}

Switch ($imginfo [' MIME ']) {
Case ' Image/jpeg ':
$img _src = Imagecreatefromjpeg ($sourcefile);
! $img _src && $img _src = imagecreatefromgif ($sourcefile);
Break
Case ' image/gif ':
$img _src = imagecreatefromgif ($sourcefile);
! $img _src && $img _src = Imagecreatefromjpeg ($sourcefile);
Break
Case ' image/png ':
$img _src = imagecreatefrompng ($sourcefile);
Break
Case ' image/wbmp ':
$img _src = imagecreatefromwbmp ($sourcefile);
Break
Default:
return $return;
}

$img _DST = Imagecreatetruecolor ($des _width, $des _height);
$img _color = imagecolorallocate ($img _dst, 255, 255, 255);
Imagefill ($img _dst, 0, 0, $img _color);
Imagecopyresampled ($img _dst, $img _src, 0, 0, 0, 0, $des _width, $des _height, $src _width, $src _height);
$tmpfile = $temp _path.md5 ($destfile);
$tmpfile = $destfile;
Switch ($destext) {
Case ' jpg ': imagejpeg ($img _dst, $tmpfile, $imgcomp); Break
Case ' gif ': imagegif ($img _dst, $tmpfile, $imgcomp); Break
Case ' png ': imagepng ($img _dst, $tmpfile, Version_compare (php_version, ' 5.1.2 ') = = 1? 7:70); Break
}
$r = Array (' FileSize ' =>filesize ($tmpfile), ' width ' = $des _width, ' height ' = $des _height);;
Copy ($tmpfile, $destfile);
Unlink ($tmpfile);
Imagedestroy ($img _dst);
return $r;
}
/*
* Picture Cutting
*
* @param string $srcname original picture path (absolute path/*.jpg)
* A new name is generated @param string $forcedheight trimmed (absolute path/rename.jpg)
* @param int $sourcefile The x-coordinate of the cropped picture
* @param int $destfile The y-coordinate of the cropped picture
* @param int $destext The width of the cropped area
* @param int $imgcomp The height of the cropped area
Clip (' xxx/x.jpg ', ' xxx/newx.jpg ', 10, 40, 150, 150)
*/
function clip ($sourcefile, $destfile, $clipx, $clipy, $clipwidth, $clipheight) {
$getimgsize = getimagesize ($sourcefile);
if (empty ($getimgsize)) {
return 0;
} else {
$imgwidth = $getimgsize [0];
$imgheight = $getimgsize [1];
if ($imgwidth = = 0 | | $imgheight = = 0) {
return 0;
}
}

if (!function_exists (' imagecreatefromjpeg ')) {
Copy ($sourcefile, $destfile);
return FileSize ($destfile);
}
Switch ($getimgsize [2]) {
Case 1:
$imgcolor = Imagecreatefromgif ($sourcefile);
Break
Case 2:
$imgcolor = Imagecreatefromjpeg ($sourcefile);
Break
Case 3:
$imgcolor = Imagecreatefrompng ($sourcefile);
Break
}
$imgcolor = Imagecreatefromjpeg ($sourcefile);
$img _DST = Imagecreatetruecolor ($clipwidth, $clipheight);
$img _color = imagecolorallocate ($img _dst, 255, 255, 255);
Imagefill ($img _dst, 0, 0, $img _color);
Imagecopyresampled ($img _dst, $imgcolor, 0, 0, $clipx, $clipy, $imgwidth, $imgheight, $imgwidth, $imgheight);
$tmpfile = $destfile;
Imagejpeg ($img _dst, $tmpfile, 100);
$n = FileSize ($tmpfile);
Copy ($tmpfile, $destfile);
return $n;
}

First cut after the abbreviation, because determined, width, height, do not need to return the width of the high.
function Clip_thumb ($sourcefile, $destfile, $forcedwidth = up, $forcedheight = 80) {
Get the original picture width height
$getimgsize = getimagesize ($sourcefile);
if (empty ($getimgsize)) {
return 0;
} else {
$SRC _width = $getimgsize [0];
$SRC _height = $getimgsize [1];
if ($src _width = = 0 | | $src _height = = 0) {
return 0;
}
}

$src _scale = $src _width/$src _height;
$des _scale = $forcedwidth/$forcedheight;

if ($src _width <= $forcedwidth && $src _height <= $forcedheight) {
$des _width = $src _width;
$des _height = $src _height;
$n = Clip ($sourcefile, $destfile, 0, 0, $des _width, $des _height);
return FileSize ($destfile);
The original is a horizontal rectangle.
} elseif ($src _scale >= $des _scale) {
With the height of the original image as the standard, the thumbnail
$des _height = $src _height;
$des _width = $src _height/$des _scale;
$n = Clip ($sourcefile, $destfile, 0, 0, $des _width, $des _height);
if ($n <= 0) return 0;
$r = Thumb ($destfile, $destfile, $forcedwidth, $forcedheight);
return $r [' filesize '];
The original is a vertical rectangle.
} else {
With the width of the original image as the standard, the thumbnail
$des _width = $src _width;
$des _height = $src _width/$des _scale;
$n = Clip ($sourcefile, $destfile, 0, 0, $des _width, $des _height);
if ($n <= 0) return 0;
$r = Thumb ($destfile, $destfile, $forcedwidth, $forcedheight);
return $r [' filesize '];
}
}

?>

We set the return content in PHP, we will find that after the corresponding situation, the return content appears in the iframe of the page, so we set the corresponding class, so that the front-end to get back content, to do the appropriate processing. Clip (), Clip_thumb () to crop the image function, you can compress the image size, crop the picture to the upper left corner as the starting point, the width is 100 square.

Js:
Copy CodeThe code is as follows:
var jsubmit_file = Jinput.filter (' [name= ' submit_file '] ');
var jfile = Jinput.filter (' [name= ' file '] ');
var jiframe = $ (' #iframe ');
var jthumb = $ ('. Thumb ');
var type = ';
Jfile.on (' Change ', function () {
var path = Jfile.val ();
var File_arr = Path.split ('. ');
Type = File_arr[file_arr.length-1];
Jsubmit_file.trigger (' click ');
});
Jiframe.on (' Load ', function () {
var jiframe_message = $ (window.frames[' iframe '].document). Find ('. Iframe_message ');
if (jiframe_message.attr (' status ')! = 0) {
var url = this.contentWindow.location.href;
var Url_arr = url.split (' = ');
Jthumb.attr (' src ', url_arr[1] + '. ' + type);
}
Alert (Jiframe_message.text ());
});

This basic implementation of the image upload, upload the results of the prompt, real-time display upload the latest avatar these features, the Internet has a variety of plug-ins, although rich in functionality, is the volume is too large, this look at our choice.

http://www.bkjia.com/PHPjc/762610.html www.bkjia.com true http://www.bkjia.com/PHPjc/762610.html techarticle upload Avatar, interface no jump way a lot, I used to add an iframe that kind. Directly below the code. HTML: Copy code code as follows://route for back-end interface//upload/avatar ...

  • Contact Us

    The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

    If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.