php文件粘贴上传
<?php
header("Access-Control-Allow-Origin:*");
$url = 'http://'.$_SERVER['HTTP_HOST'];
$file = (isset($_POST["file"])) ? $_POST["file"] : '';
if($file)
{
$data = base64_decode(str_replace('data:image/png;base64,', '', $file)); //截图得到的只能是png格式图片,所以只要处理png就行了
$name = md5(time()) . '.png'; // 这里把文件名做了md5处理
file_put_contents($name, $data);
echo "$url/$name";
die;
}
?> <div id="box" style="width:400px;height:400px;border:1px solid;" contenteditable>
</div>
<input type="hidden" name="img" value="" id="img_puth"/> <script>
//查找box元素,检测当粘贴时候,
document.querySelector('#box').addEventListener('paste', function(e) { //判断是否是粘贴图片
if (e.clipboardData && e.clipboardData.items[0].type.indexOf('image') > -1)
{
var that = this,
reader = new FileReader();
file = e.clipboardData.items[0].getAsFile(); //ajax上传图片
reader.onload = function(e)
{
var xhr = new XMLHttpRequest(),
fd = new FormData(); xhr.open('POST', '', true);
xhr.onload = function ()
{
var img = new Image();
img.src = xhr.responseText; // that.innerHTML = '<img src="'+img.src+'" alt=""/>';
document.getElementById("img_puth").value = img.src;
} // this.result得到图片的base64 (可以用作即时显示)
fd.append('file', this.result);
that.innerHTML = '<img src="'+this.result+'" alt=""/>';
xhr.send(fd);
}
reader.readAsDataURL(file);
}
}, false);
</script>
php文件粘贴上传的更多相关文章
- 图片上传插件ImgUploadJS:用HTML5 File API 实现截图粘贴上传、拖拽上传
一 . 背景及效果 当前互联网上传文件最多的就是图片文件了,但是传统web图片的截图上传需要:截图保存->选择路径->保存后再点击上传->选择路径->上传->插入. 图片 ...
- [转]Kindeditor图片粘贴上传(chrome)
原文地址:https://www.cnblogs.com/jsper/p/7608004.html 首先要赞一下kindeditor,一个十分强大的国产开源web-editor组件. kindedit ...
- 让富文本编辑器支持复制doc中多张图片直接粘贴上传
Chrome+IE默认支持粘贴剪切板中的图片,但是我要发布的文章存在word里面,图片多达数十张,我总不能一张一张复制吧? 我希望打开文档doc直接复制粘贴到富文本编辑器,直接发布 感觉这个似乎很困难 ...
- Kindeditor图片粘贴上传(chrome)
kindeditor4.1.x版本已支持图片批量上传,不过传统的选文件上传的方式依然效率低下. 很多时候,编辑人员可能需要将一个文档中图片上传到网上,那么,按照传统的上传方法,他必须先将图片另存为到本 ...
- js实现图片粘贴上传到服务器并展示
最近看了一些有关于js实现图片粘贴上传的demo,实现如下: (这里只能检测到截图粘贴和图片右键复制之后粘贴) demo1: document.addEventListener('paste', fu ...
- Web大文件(夹)上传(断点续传)控件发布-Xproer.HttpUploader6
版权所有 2009-2017荆门泽优软件有限公司 保留所有权利 官方网站:http://www.ncmem.com/ 产品首页:http://www.ncmem.com/webapp/up6.2/in ...
- 如何上传网站程序(文件浏览器上传网页、FileZilla上传网站程序)
问题场景: 网页制作完成后,程序需上传至虚拟主机. 注意事项: Windows系统的主机请将全部网页文件直接上传到FTP根目录,即 / . Linux系统的主机请将全部网页文件直接上传到 /htdoc ...
- Web大文件(夹)上传(断点续传)控件-Xproer.HttpUploader6
版权所有 2009-2017荆门泽优软件有限公司 保留所有权利 官方网站:http://www.ncmem.com/ 产品首页:http://www.ncmem.com/webapp/up6.2/in ...
- vue文件夹上传组件选哪个好?
一. 功能性需求与非功能性需求 要求操作便利,一次选择多个文件和文件夹进行上传:支持PC端全平台操作系统,Windows,Linux,Mac 支持文件和文件夹的批量下载,断点续传.刷新页面后继续传输. ...
随机推荐
- 14.5.5.2 Deadlock Detection and Rollback Deadlock 检测和回滚
14.5.5.2 Deadlock Detection and Rollback Deadlock 检测和回滚 InnoDB 自动检测事务死锁和回滚一个事务 InnoDB 尝试挑选小的事务来回滚,事务 ...
- git日志的查看与修改
1.命令行中查看日志 git log 默认是显示所有的日志信息,之前出来的界面显示的日志,很少. 最后发现,只需要使用键盘上向下键↓,就可以继续浏览更多的日志 空格键,可以翻页浏览日志. 向左← 向 ...
- bzoj2165
类似于bzoj1706,考虑到楼层是等价的我们令f[p,i,j]为用了2^p次电梯,从房间i到j最多上升了多少层然后从2^p很容易推到2^(p+1),类似于floyd的转移即可下面我们要用最小的电梯次 ...
- Java项目中使用配置文件配置
private String readConfig() { Properties p = new Properties(); InputStream in = getClass().getClassL ...
- IE 弹出"Unable to do xml/xsl" Processing
解决方法:
- C#中的四舍五入算法
最近在产品开发过程中遇到一个问题,就是在对数值进行截取,例如说保留两位小数时,最终得到的结果跟预期的在某些情况下会产生差异,这个差异的表现就是最后一位与预期的不一致,也就是说在"四舍五入&q ...
- HDOJ/HDU 2539 点球大战(String.endsWith()方法的一个应用~)
Problem Description 在足球比赛中,有不少赛事,例如世界杯淘汰赛和欧洲冠军联赛淘汰赛中,当比赛双方经过正规比赛和加时赛之后仍然不分胜负时,需要进行点球大战来决定谁能够获得最终的胜利. ...
- 4种字符串匹配算法:BS朴素 Rabin-karp(上)
字符串的匹配的算法一直都是比较基础的算法,我们本科数据结构就学过了严蔚敏的KMP算法.KMP算法应该是最高效的一种算法,但是确实稍微有点难理解.所以打算,开这个博客,一步步的介绍4种匹配的算法.也是& ...
- android 加载图片防止内存溢出
图片资源: private int fore[]; private int back[]; fore = new int[]{R.drawable.a0, R.drawable.a1, R.drawa ...
- 使用FileSystemWatcher监视文件变化
本文转载:http://www.cnblogs.com/zanxiaofeng/archive/2011/01/08/1930583.html FileSystemWatcher基础 属性: Path ...