js无刷新上传图片,服务端有生成缩略图,剪切图片,iphone图片旋转判断功能
html:
<form action="<{:AppLink('circle/uploadimg')}>" id="imageform" method="post" enctype="multipart/form-data">
<input name="photoimg" type="file" id="xwzx_f" style="display: none;" />
</form>
js:
<script src = "__TMPL__statics/js/jquery-1.7.1.min.js?v=20161123" ></script>
<script src="__TMPL__statics/js/layer/layer.js?v=20161123"></script>
<script src = "__TMPL__statics/js/jquery.form.js?v=1"></script>
$("#xwzx_f").change(function(){
$(".loading-gif").show();
var img_name=this["files"][0]["name"];
var temparr=img_name.split('.');
var ext=temparr.pop().toLowerCase();
temparr=null;
if(ext!="jpg"&&ext!="png"&&ext!="gif"&&ext!="bmp"&&ext!="jpeg"&&ext!="jepg"){
layer.msg('上传的格式不正确');
$(".loading-gif").hide();
return false;
}
var src = window.URL.createObjectURL(this["files"][0]);//如果预览可用此代码
$('#imageform').ajaxSubmit({
beforeSend: function() {
$(".loading-gif").html( '0%');
},
uploadProgress: function(event, position, total, percentComplete) {
$(".loading-gif").html(percentComplete + '%');
},
success: function() {
$(".loading-gif").hide();
},
complete: function(xhr) {
var result=JSON.parse(xhr.responseText);
if(result.status=="success"){
var htmlstr="";
htmlstr='<li class="l_up_img"><div class="f-img-box">';
htmlstr+='<a href="javascript:;"><img src="__ROOT__/attachs/qz/'+result.imgpath+'"></a>';
htmlstr+='<input class="up_img" type="hidden" value="'+result.imgpath+'" bmw="'+result.bm_w+'" bmh="'+result.bm_h+'"/>';
htmlstr+='</div></li>';
$(".f-s-img").find("li").last().before(htmlstr);
}else{
layer.msg(result.msg);
}
}
});
php代码(携带生成大中小缩略图,剪切功能,iphone图片旋转,iphone旋转需要php.ini开启php_exif)
function imgturn($src, $direction = 1,$ext) {
switch ($ext) {
case 'gif' :
$img = imagecreatefromgif ( $src );
break;
case 'jepg':
case 'jpg' :
case 'jpeg' :
$img = imagecreatefromjpeg ( $src );
break;
case 'png' :
$img = imagecreatefrompng ( $src );
break;
default :
die ( '图片格式错误!' );
break;
}
$width = imagesx ( $img );
$height = imagesy ( $img );
$img2 = imagecreatetruecolor ( $height, $width );
// 顺时针旋转90度
if ($direction == 1) {
for($x = 0; $x < $width; $x ++) {
for($y = 0; $y < $height; $y ++) {
imagecopy ( $img2, $img, $height - 1 - $y, $x, $x, $y, 1, 1 );
}
}
} else if ($direction == 2) {
// 逆时针旋转90度
for($x = 0; $x < $height; $x ++) {
for($y = 0; $y < $width; $y ++) {
imagecopy ( $img2, $img, $x, $y, $width - 1 - $y, $x, 1, 1 );
}
}
}
switch ($ext) {
case 'jepg':
case 'jpg' :
case "jpeg" :
imagejpeg ( $img2, $src, 100 );
break;
case "gif" :
imagegif ( $img2, $src, 100 );
break;
case "png" :
imagepng ( $img2, $src, 100 );
break;
default :
die ( '图片格式错误!' );
break;
}
imagedestroy ( $img );
imagedestroy ( $img2 );
}
/**
* 上传图片
*/
public function uploadimg(){
if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST"){
$name = $_FILES['photoimg']['name'];
$size = $_FILES['photoimg']['size'];
try {
$filetemp=date('Ymd',time());
$path = BASE_PATH."/attachs/qz/{$filetemp}/";//需要上传的路径
if(!is_dir($path)){
mkdir($path,0777,true);
}
} catch (Exception $e) {
die(json_encode(array('status'=>'error','msg'=>'文件路径创建失败')));
}
if(empty($name)){
die(json_encode(array('status'=>'error','msg'=>'请选择要上传的图片')));
}
if($size>(1024*1024*10)){
die(json_encode(array('status'=>'error','msg'=>'图片大小不能超过10M')));
}
$extend = pathinfo($name);
$ext = strtolower($extend["extension"]);
if(!in_array($ext, array('jpg','png','gif','bmp','jpeg','jepg'))){
die(json_encode(array('status'=>'error','msg'=>'图片格式不正确'.$ext)));
}
$image_name = time().rand(100,999).".".$ext;
$tmp = $_FILES['photoimg']['tmp_name'];
/**
*iphone判断图片方向,是否需要旋转图片
*/
if(strpos($_SERVER['HTTP_USER_AGENT'], 'iPhone')&&in_array($ext, array('jpg','png','gif','jpeg','jepg'))){
$exif =exif_read_data($tmp);
switch ($exif['Orientation']){
case 6:
self::imgturn($tmp,1,$ext);
break;
case 3:
self::imgturn($tmp,1,$ext);
self::imgturn($tmp,1,$ext);
break;
case 8:
self::imgturn($tmp,2,$ext);
break;
}
}
self::imagecropper($tmp, $path,$image_name, 'sm_', 150, 150);//小图,如果图片尺寸不合适就裁剪
self::imagecropper($tmp,$path,$image_name,'mm_',256,256);//中图,如果图片尺寸不合适就裁剪
if($result=move_uploaded_file($tmp, $path.$image_name)){
/**
* 修改,大图
*/
$imagesize=getimagesize($path.$image_name);//高,宽,格式,高宽字符串
if($imagesize[1]>700){//宽度大于720
self::thumb($path,$image_name,'bm_',700,700*$imagesize[1]/$imagesize[0]);//高度等比
}else{
self::thumb($path,$image_name,'bm_',$imagesize[0],$imagesize[1]);
}
/**
* 修改end
*/
/**
*生成缩略图
*小图 92*92
*中图 256*256
*大图 暂时不生成但预留
*/
/* self::thumb( $path,$image_name,'sm_',92,92);
self::thumb( $path,$image_name,'mm_',256,256);
$imagesize=getimagesize($path.$image_name);//高,宽,格式,高宽字符串
if($imagesize[1]>720){//宽度大于720
self::thumb( $path,$image_name,'bm_',720,720*$imagesize[1]/$imagesize[0]);//高度等比
}else{
self::thumb( $path,$image_name,'bm_',$imagesize[0],$imagesize[1]);
} */
unlink($path.$image_name);
$filetemp=date('Ymd',time());
$r_data=array(
//'oror'=>$exif['Orientation'],
'status'=>'success',
'msg'=>'上传成功',
'imgpath'=>$filetemp.'/sm_'.$image_name,
'bm_w'=>$imagesize[0], //大图宽
'bm_h'=>$imagesize[1] //大图高
);
/* $myfile = fopen("C:/Users/sss/Desktop/ss/testfile.txt", "w+");
fwrite($myfile, json_encode($r_data));
fclose($myfile); */
echo json_encode($r_data);
}else{
echo json_encode(array('status'=>'error','msg'=>'上传失败','oror'=>$result));
}
}else{
die(json_encode(array('status'=>'error','msg'=>'请求方式不正确')));
}
}
/**
* 创建图片缩略图
* @param string $directroy 上传至目录,
* @param string $doUpFile 上传的文件名,
* @param string $dscChar 前缀,小图 sm,中图 mm ,大图 bm
* @param number $width
* @param number $height
* @return string|boolean
*/
function thumb( $Directroy,$doUpFile,$dscChar = 'sm_',$width = 92, $height = 92){
if ($doUpFile != '') {
$srcFile = $doUpFile;
$dscFile = $Directroy . $dscChar . $srcFile;
$data = getimagesize($Directroy . $srcFile); // 文件格式,其值 1 为 GIF 格式、 2 为 JPEG/JPG 格式、3 为 PNG 格式。
switch ($data[2]) {
case 1:
$im = @imagecreatefromgif($Directroy . $srcFile);
break;
case 2:
$im = @imagecreatefromjpeg($Directroy . $srcFile);
break;
case 3:
$im = @imagecreatefrompng($Directroy . $srcFile);
break;
}
$srcW = imagesx($im);
$srcH = imagesy($im);
$ni = imagecreatetruecolor($width, $height);
//imagecopyresized($ni, $im, 0, 0, 0, 0, $width, $height, $srcW, $srcH);
imagecopyresampled($ni, $im, 0, 0, 0, 0, $width, $height, $srcW, $srcH);
$cr = imagejpeg($ni, $dscFile);
chmod($dscFile, 0777);
if ($cr) {
return $dscFile;
} else {
return false;
}
}
}
/**
*
* @param unknown $source_path 源图路径
* $Directroy,
* $doUpFile,
* $dscChar = 'sm_',
* @param unknown $target_width 目标图宽度
* @param unknown $target_height 目标图高度
* @return boolean
*
*/
function imagecropper($source_path, $Directroy,$doUpFile, $dscChar = 'sm_', $target_width=92, $target_height=92){
$srcFile = $doUpFile;
$dscFile = $Directroy . $dscChar . $srcFile;
$source_info = getimagesize($source_path);
$source_width = $source_info[0];
$source_height = $source_info[1];
$source_mime = $source_info['mime'];
$source_ratio = $source_height / $source_width;
$target_ratio = $target_height / $target_width;
if ($source_ratio > $target_ratio){ // 源图过高
$cropped_width = $source_width;
$cropped_height = $source_width * $target_ratio;
$source_x = 0;
$source_y = ($source_height - $cropped_height) / 2;
} elseif ($source_ratio < $target_ratio){ // 源图过宽
$cropped_width = $source_height / $target_ratio;
$cropped_height = $source_height;
$source_x = ($source_width - $cropped_width) / 2;
$source_y = 0;
}else{ // 源图适中
$cropped_width = $source_width;
$cropped_height = $source_height;
$source_x = 0;
$source_y = 0;
}
switch ($source_mime){
case 'image/gif':
$source_image = imagecreatefromgif($source_path);
break;
case 'image/jpeg':
$source_image = imagecreatefromjpeg($source_path);
break;
case 'image/png':
$source_image = imagecreatefrompng($source_path);
break;
default:
return false;
break;
}
$target_image = imagecreatetruecolor($target_width, $target_height);
$cropped_image = imagecreatetruecolor($cropped_width, $cropped_height);
// 裁剪
imagecopy($cropped_image, $source_image, 0, 0, $source_x, $source_y, $cropped_width, $cropped_height);
// 缩放
imagecopyresampled($target_image, $cropped_image, 0, 0, 0, 0, $target_width, $target_height, $cropped_width, $cropped_height);
header('Content-Type: image/jpeg');
imagejpeg($target_image,$dscFile);
imagedestroy($source_image);
imagedestroy($target_image);
imagedestroy($cropped_image);
}
js无刷新上传图片,服务端有生成缩略图,剪切图片,iphone图片旋转判断功能的更多相关文章
- ajaxFileUpload.js 无刷新上传图片,支持多个参数同时上传,支持 ie6-ie10
/* 131108-xxj-ajaxFileUpload.js 无刷新上传图片 jquery 插件,支持 ie6-ie10 依赖:jquery-1.6.1.min.js 主方法:ajaxFileUpl ...
- Thinkphp框架 -- ajax无刷新上传图片
用Thinkphp框架做无刷新上传图片 视图层 View <!doctype html> <html lang="en"> <head> < ...
- 使用SWFUpload无刷新上传图片
使用SWFUpload组件无刷新上传图片 在做项目时,需要用到一个图片的无刷新上传,之前听说过SWFUpload,于是想要通过SWFUpload来进行图片的无刷新上传,由于我的项目属于是ASP.NET ...
- nodejs利用ajax实现网页无刷新上传图片
nodejs利用ajax实现网页无刷新上传图片 标签(空格分隔): nodejs 通常情况下上传图片是要通过提交form表单来实现的,但是这又不可避免的产生了网页转. 利用ajax技术和FormDat ...
- php无刷新上传图片和文件
核心思想:通过Html的iframe标签属性操作顶级窗口,再用php动态无刷新上传图片文件. 示例如下: demo |------uploads #存放上传的文件 |------index.php | ...
- TP3.2:实现Ajax无刷新上传图片
1.基于TP3.2+ajaxfileupload进行无刷新上传图片,本次只上传一张,多张以后搞出来再发 2.效果: 3.html代码: <html> <head> < ...
- 无刷新上传图片,ajax 和 iframe
iframe 上传 upload.html 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 ...
- [Asp.net mvc]jquery.form.js无刷新上传
写在前面 最近在自己的网盘项目中想用ajax.beginform的方式做无刷新的操作,提交表单什么的都可以,但针对文件上传,就是个鸡肋.在网上查找了发现很多人都遇到了这个问题,大部分都推荐使用jque ...
- ajax无刷新上传图片
页面: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> & ...
随机推荐
- JavaWeb-springMVC
<context:component-scan/> 扫描指定的包中的类上的注解,常用的注解有: @Controller 声明Action组件@Service 声明Service组件 ...
- Markdown 是什么
tags: Markdown tags && syngx ###Markdown 是什么Markdown 是一种轻量级标记语言,创始人为约翰·格鲁伯(John Gruber).它允许人 ...
- LigerUI 表单和表格中的combobox如何初始化值
摘要: 在修改基础信息的时候,通常会遇到需要修改值为选择值的时候,这时候,数据库存的一般是value,而不是显示的text值,但页面显示的时候如果显示成数字型的值,通常会给人不够直观的感觉.因此,要求 ...
- 关于eclipse的一些配置
在linux中打开的一刹那,第一感觉就是这货怎么这么丑,用的时候还发现,这货怎么这么慢. 可以通过使用GTK2来让它的图标显示得合理一些,可以调整内存的限制来减少fullGC的次数. 配置文件的路径: ...
- PHP开发环境配置~Windows 7 IIS
1.配置IIS添加角色服务:CGI.ISAPI扩展.ISAPI筛选器 2.下载PHP安装包 http://windows.php.net/download/ 3.添加模块映射 4.配置php.ini ...
- apiCloud又拍云数据库操作经验
1.在数据库表中有个relation字段,表示一对多(对应其他表的多个记录),这个字段比较奇怪,因为实际上这个字段里并未保存实际值.而是保存在对应表的字段中.但是对应表显示出来并没有这个字段.导出数据 ...
- 程序员面试大揭秘——应聘微软、亚马逊、谷歌、苹果等IT公司你都要做什么准备?
对于多数求职者而言,面试好似一个迷局.你去了,见了几个面试官,答了一堆问题,然后,或两手空空离开,或幸运地拿到录用通知. 你有没有想过: 面试结果是怎么得出的? 面试官会不会互相交流? 公司最看重哪些 ...
- xutils3
使用方法:https://github.com/wyouflf/xUtils3 http://blog.csdn.net/tyk9999tyk/article/details/53306035 .Ne ...
- Shellcode编程小技巧
工作需要,需要注入其他程序监控一些东西,检测到的数据通过WM_COPY 消息发送给显示窗体.(大体是这样的还没定稿) ##1 选择一个框架 ## tombkeeper/Shellcode_Templa ...
- Dynamics AX 2012 R2 安装Reporting Services 扩展
今天Reinhard在VS中部署SSRS报表时,接到以下错误: 部署因错误而被取消.在报表服务器上,验证:-SQL Server Reporting Services 服务是否正在运行. 接着,Rei ...