ImgURL是一个简单、纯粹的图床程序,让个人图床多一个选择。
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

136 lines
5.9 KiB

<div class="layui-container">
<div class="layui-row">
<!-- 首页主要区域 -->
<div class="layui-col-lg12">
<div id="main">
<div class="alert alert-warning" role="alert">
<span class="alert-inner--icon"><i class="layui-icon"></i></span>
<span class="alert-inner--text"><strong>注意:</strong>游客限制每日上传10张,单张图片不能超过5M,上传的图片将公开显示,使用之前请先阅读《<a href="/page/use">使用协议</a></span>
</div>
<!-- 选择按钮 -->
<!-- 上传地址 -->
<!-- <div id = "storage">
<form class="layui-form" action="">
<div class="layui-form-item">
<label class="layui-form-label">存储方式</label>
<div class="layui-input-block">
<input type="radio" name="storage" value="localhost" title="本地" checked = "checked">
<input type="radio" name="storage" value="qiniu" title="七牛云">
<input type="radio" name="storage" value="upyun" title="又拍云">
<input type="radio" name="storage" value="oss" title="阿里OSS">
</div>
</div>
</form>
</div> -->
<!-- 选择按钮END -->
<!-- 上传区域 -->
<div class="layui-form-item">
<div class="layui-upload-drag" id="upimg">
<i class="layui-icon"></i>
<p>将图片拖拽到此处,支持Ctrl + V粘贴上传</p>
</div>
</div>
<!-- 上传区域END -->
</div>
</div>
<!-- 首页主要区域END -->
</div>
<div class="layui-row">
<div class="layui-col-lg12" id = "imgshow">
<!-- 图片显示区域 -->
<!-- 显示缩略图 -->
<div class="layui-col-lg4">
<div id = "img-thumb"><a href="" target = "_blank"><img src="" alt=""></a></div>
</div>
<!-- 显示地址 -->
<div class="layui-col-lg7 layui-col-md-offset1">
<div id="links">
<table class="layui-table" lay-skin="nob">
<colgroup>
<col width="80">
<col width="450">
<col>
</colgroup>
<tbody>
<tr>
<td>URL</td>
<td><input type="text" class="layui-input" id="url" data-cip-id="url"></td>
<td><a href="javascript:;" class="layui-btn layui-btn-sm" onclick="copyurl('url')">复制</a></td>
</tr>
<tr>
<td>HTML</td>
<td><input type="text" class="layui-input" id="html" data-cip-id="html"></td>
<td><a href="javascript:;" class="layui-btn layui-btn-sm" onclick="copyurl('html')">复制</a></td>
</tr>
<tr>
<td>Markdown</td>
<td><input type="text" class="layui-input" id="markdown" data-cip-id="markdown"></td>
<td><a href="javascript:;" class="layui-btn layui-btn-sm" onclick="copyurl('markdown')">复制</a></td>
</tr>
<tr>
<td>BBCode</td>
<td><input type="text" class="layui-input" id="bbcode" data-cip-id="bbcode"></td>
<td><a href="javascript:;" class="layui-btn layui-btn-sm" onclick="copyurl('bbcode')">复制</a></td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- 图片显示区域END -->
</div>
</div>
</div>
<!--Ctrl + V粘贴上传-->
<script src = "/static/js/PasteUpload.js"></script>
<script>
var load1 = document.querySelector("#upimg");
// 实例化即可
new ctrlVUtil({
uploadUrl: "/upload/parse",
targetElement: load1,
isCompleteImg:false,
data:{
name:"alanzhang",
},
success:function(data){
//转为对象
var res = data;
//上传成功
if(res.code == 200){
layer.closeAll('loading');
//layer.closeAll('loading');
$("#img-thumb a").attr('href','/img/' + res.imgid);
$("#img-thumb img").attr('src',res.thumbnail_url);
$("#url").val(res.url);
$("#html").val("<img src = '" + res.url + "' />");
$("#markdown").val("![](" + res.url + ")");
$("#bbcode").val("[img]" + res.url + "[/img]");
$("#imgshow").show();
//对图片进行鉴黄识别
$.get("/deal/identify/" + res.id,function(data,status){
var re = JSON.parse(data);
//状态码为400,说明该图片存在异常
if(re.code == 400){
layer.open({
title: '警告!'
,content: '您的IP已被记录,请不要上传违规图片!'
});
}
else{
console.log(re.code);
}
});
}
else{
layer.msg(res.msg);
}
},
error: function(error){
layer.closeAll('loading');
layer.msg('上传失败!');
}
});
</script>
<!--粘贴上传END-->