我正在使用Codeigniter的上传库来上传用户头像的图像.我也在使用
Jcrop,它允许用户选择要裁剪的区域.
http://www.webresourcesource.com/wp-content/uploads/2012/04/jcrop.jpg
我在文本输入中保存所选区域的所有坐标,我将在PHP中使用它来裁剪.
上传表格：
<?PHP echo form_open_multipart('upload/do_upload');?> <input type="file" name="userfile" size="20" /> <input type="submit" value="upload" /> </form>
如果可能的话,我试图避免重js或上传2次.选择文件时,我注意到它显示了它的名称：
有没有办法使用该功能来检索图像路径(上传者计算机中图像的路径)？从理论上讲,我将能够在图像标签中使用它并显示没有js的图像.
需要说明的是,您没有在当前的解决方案中上传文件两次,对吗？您应该只上传一次,将其存储在临时位置,在裁剪页面上显示,然后在第二个操作上发回裁剪参数.
原文链接：https://www.f2er.com/php/136446.html传统上,无法访问文件的内容或文件上载表单的值.存在安全风险,使网页知道文件系统的结构. (你是在Windows上,在管理员帐户上,……？)很久以前你可以做到这一点,但我们明智了.
The File API introduced in HTML5可以在不泄露此信息的情况下访问文件,并且客户端应用程序可以使用一些很酷的选项,关键的是文件输入的文件属性和URL.createObjectURL.
更改表单时,使用fileInput.files(FileList对象)公开输入中文件的内部表示. API存在于您可以读取字节但您想将其设置为图像源的位置.
由于文件不是URL,因此URL.createObjectURL会在文件周围创建一个虚拟URL,该URL只能由您的页面和同源iframe使用.将图像设置为this,然后onload,撤消URL并启动jQuery裁剪插件：
input.addEventListener('change',function () {
preview.src = URL.createObjectURL(this.files[0]);
});
preview.addEventListener('load',function () {
URL.revokeObjectURL(this.src);
alert('jQuery code here. Src: ' + this.src + ',W: ' + this.width + ',H: ' + this.height);
});
至少在Chrome和Firefox中试用this jsFiddle.这显然不适用于所有浏览器,但对于支持它的浏览器来说,这是一种很好的方法.
