php实现粘贴截图并完成上传功能
2024-09-01 22:17:29
<?php
header(
"Access-Control-Allow-Origin:*"
);
$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>
最新文章
- AFNetworking 3.0 源码解读 总结(干货)(下)
- DWT小波变换及其在时间序列数据预测中的应用
- ubuntu下samba服务器的安装与配置
- 注解@PostConstruct与@PreDestroy讲解及实例
- 一切从IL开始
- Eigen库实现简单的旋转、平移操作
- exists与in的使用与区别
- mysql学习(七)-索引学习
- 201521123122 《java程序设计》 第三周学习总结
- [SCOI2009]生日快乐
- java去除数组重复元素的方法
- #1 // BZOJ 4361 isn
- C#-MVC开发微信应用(5)--自动应答系统-自动回复机器人
- 自己实现more命令
- bzoj千题计划215:bzoj1047: [HAOI2007]理想的正方形
- hihocoder 1284 - 机会渺茫
- JavaScript匿名函数知多少
- Oracle中varchar2(XX)和varchar2(XX byte)区别
- Visual Studio Community 2013 中文语言包-离线安装版
- 网络代理-Firefox在shadow socks下面的使用