移动端web无刷新上传图片【兼容安卓IOS】

简介:

博客已转移到:PHP博客

需求 手机端网页或者微信无刷新上传头像
环境 手机浏览器或者微信浏览器(支持HTML5)
实现方式 LocalResizeIMG
地址

https://github.com/think2011/LocalResizeIMG(原版地址)

链接: http://pan.baidu.com/s/1ntNYXrb 密码: 71cp(个人修改版)

说明 原版只能指定固定的图片宽度,而修改版扩展原图片上传
使用方式
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
< h1  class = "text-center" >LocalResizeIMG-本地压缩 1.0</ h1 >
     < hr />
     < input  type = "file"  />
     < hr />
 
     <!-- javascript
         ================================================== -->
     < script  src = "http://cdn.staticfile.org/jquery/2.1.1-rc2/jquery.min.js"  type = "text/javascript" ></ script >
     < script  src = "localResizeIMG.js"  type = "text/javascript" ></ script >
     
     <!-- mobileBUGFix.js 兼容修复移动设备 -->
     < script  src = "patch/mobileBUGFix.mini.js"  type = "text/javascript" ></ script >
     < script  type = "text/javascript" >
         $('input:file').localResizeIMG({
              width: 100,
              quality: 0.1,
              success: function (result) {
              var img = new Image();
              img.src = result.base64;
 
              $('body').append(img);
              console.log(result);
              }
          });
     </ script >


简单说明:width是生成的图片的宽度,个人修改里,如果指定width为1,则为原图宽度

         quality是图片的质量

         success:生成成功以后是base64码,在success里可以用ajax发送到服务器端保存,base64会生成两种:一种是带前缀说明图片类型的base64码,可以直接放到img标签里使用,调用方法:result.base64   还有一种是result.clearBase64,不带说明的,读取方法:result.clearBase64。

服务器端代码:

1
2
3
4
5
6
7
$path = './Uploads/' . date ( 'Ymd' ). '/' ;
         if (! file_exists ( $path )){
             mkdir ( $path );
         }
         $file = $path .time(). '.jpeg' ;
         $base64 = base64_decode ( $_POST [ 'head' ]);
         file_put_contents ( $file $base64 )


       

     其他说明:安卓下有些可以调用相册,文件管理器和摄像头,有些只能调用相册和文件管理器

               IOS可调用相册和摄像头。

               PC端无限制

               无论上传什么图片,最后都会变成jpeg的格式。










本文转自 3147972 51CTO博客,原文链接:http://blog.51cto.com/a3147972/1551066,如需转载请自行联系原作者
目录
相关文章
|
26天前
|
存储 监控 API
app开发之安卓Android+苹果ios打包所有权限对应解释列表【长期更新】-以及默认打包自动添加权限列表和简化后的基本打包权限列表以uniapp为例-优雅草央千澈
app开发之安卓Android+苹果ios打包所有权限对应解释列表【长期更新】-以及默认打包自动添加权限列表和简化后的基本打包权限列表以uniapp为例-优雅草央千澈
|
1月前
|
IDE 开发工具 Android开发
移动应用开发之旅:探索Android和iOS平台
在这篇文章中,我们将深入探讨移动应用开发的两个主要平台——Android和iOS。我们将了解它们的操作系统、开发环境和工具,并通过代码示例展示如何在这两个平台上创建一个简单的“Hello World”应用。无论你是初学者还是有经验的开发者,这篇文章都将为你提供有价值的信息和技巧,帮助你更好地理解和掌握移动应用开发。
75 17
|
2月前
|
安全 Android开发 数据安全/隐私保护
深入探索Android与iOS系统安全性的对比分析
在当今数字化时代,移动操作系统的安全已成为用户和开发者共同关注的重点。本文旨在通过比较Android与iOS两大主流操作系统在安全性方面的差异,揭示两者在设计理念、权限管理、应用审核机制等方面的不同之处。我们将探讨这些差异如何影响用户的安全体验以及可能带来的风险。
93 21
|
1月前
|
Java 开发工具 Android开发
安卓与iOS开发环境对比分析
在移动应用开发的广阔天地中,安卓和iOS两大平台各自占据半壁江山。本文深入探讨了这两个平台的开发环境,从编程语言、开发工具到用户界面设计等多个角度进行比较。通过实际案例分析和代码示例,我们旨在为开发者提供一个清晰的指南,帮助他们根据项目需求和个人偏好做出明智的选择。无论你是初涉移动开发领域的新手,还是寻求跨平台解决方案的资深开发者,这篇文章都将为你提供宝贵的信息和启示。
36 8
|
1月前
|
开发框架 Android开发 iOS开发
安卓与iOS开发中的跨平台策略:一次编码,多平台部署
在移动应用开发的广阔天地中,安卓和iOS两大阵营各占一方。随着技术的发展,跨平台开发框架应运而生,它们承诺着“一次编码,到处运行”的便捷。本文将深入探讨跨平台开发的现状、挑战以及未来趋势,同时通过代码示例揭示跨平台工具的实际运用。
154 3
|
1月前
|
人工智能 安全 物联网
Android与iOS:移动操作系统的双雄争霸
在智能手机市场中,Android和iOS作为两大主流操作系统,各自拥有庞大的用户群体和独特的生态系统。本文将深入探讨这两种系统的发展历程、技术特点、市场表现以及未来趋势,以期为读者提供全面而深入的了解。通过对比分析,我们可以发现,尽管Android和iOS在某些方面存在竞争关系,但它们也在相互借鉴中不断进步和完善。
|
1月前
|
安全 生物认证 Android开发
深入探索iOS与Android操作系统的安全性差异
本文旨在通过对比分析iOS和Android两大主流移动操作系统在安全性方面的差异,揭示它们各自的安全机制、面临的挑战以及用户如何提升自身设备的安全保护。通过对系统架构、应用审核机制、数据加密方式及隐私政策的深入探讨,本文为读者提供了一个全面了解两大平台安全性的视角,并提出了实用的安全建议。
|
1月前
|
Java 调度 Android开发
安卓与iOS开发中的线程管理差异解析
在移动应用开发的广阔天地中,安卓和iOS两大平台各自拥有独特的魅力。如同东西方文化的差异,它们在处理多线程任务时也展现出不同的哲学。本文将带你穿梭于这两个平台之间,比较它们在线程管理上的核心理念、实现方式及性能考量,助你成为跨平台的编程高手。
|
1月前
|
安全 Android开发 iOS开发
深入探索iOS与Android系统架构差异及其对开发者的影响
本文旨在通过对比分析iOS和Android两大移动操作系统的系统架构,探讨它们在设计理念、技术实现及开发者生态方面的差异。不同于常规摘要仅概述内容要点,本摘要将简要触及核心议题,为读者提供对两大平台架构特点的宏观理解,铺垫
|
1月前
|
开发工具 Android开发 iOS开发
Android与iOS生态差异深度剖析:技术架构、开发体验与市场影响####
本文旨在深入探讨Android与iOS两大移动操作系统在技术架构、开发环境及市场表现上的核心差异,为开发者和技术爱好者提供全面的视角。通过对比分析,揭示两者如何塑造了当今多样化的移动应用生态,并对未来发展趋势进行了展望。 ####

热门文章

最新文章