test

6 years ago · 8f61a15b0c
5 changed files with 616 additions and 0 deletions
--- a/functions/cvupload.php
+++ b/functions/cvupload.php
@ -0,0 +1,58 @@
				@@ -0,0 +1,58 @@
+<?php
+    //载入配置文件
+    include_once("./class/class.user.php");
+    //检查用户是否登录
+    $status = $basis->check($config);
+
+    //检查用户是否登陆来判断上传目录
+    if($status == 'islogin') {
+        //设置上传路径
+        $updir = $config['admindir'];
+    }
+    else{
+        $updir = $config['userdir'];
+        //限制用户上传数量
+        $basis->limitnum();
+    }
+
+    //获取上传者信息
+    $ip = $basis->getip();
+    $ua = $_SERVER['HTTP_USER_AGENT'];
+    $date = date('Y-m-d',time());
+
+    //图片存储路径
+    $picpath = $updir.'/'.date('ym',time()).'/'.'dsdds.png';
+
+    //接受base64图片
+    $picfile = $_POST['content'];
+    $picfile = base64_decode($picfile);
+    //echo $picfile;
+    //存储图片
+    var_dump(file_put_contents("D:/wwwroot/imgurl/upload/1809/dsd.png", $picfile));
+    
+
+	//echo $picpath;
+	//var_dump($picfile);
+    
+?>
+<?php
+	function base64_image_content($base64_image_content,$path){
+    //匹配出图片的格式
+    if (preg_match('/^(data:\s*image\/(\w+);base64,)/', $base64_image_content, $result)){
+        $type = $result[2];
+        $new_file = $path."/".date('Ymd',time())."/";
+        if(!file_exists($new_file)){
+            //检查是否有该文件夹，如果没有就创建，并给予最高权限
+            mkdir($new_file, 0700);
+        }
+        $new_file = $new_file.time().".{$type}";
+        if (file_put_contents($new_file, base64_decode(str_replace($result[1], '', $base64_image_content)))){
+            return '/'.$new_file;
+        }else{
+            return false;
+        }
+    }else{
+        return false;
+    }
+}
+?>
--- a/miniup.html
+++ b/miniup.html
@ -0,0 +1,136 @@
				@@ -0,0 +1,136 @@
+<!DOCTYPE html>
+<html lang="zh-cmn-Hans" xmlns="http://www.w3.org/1999/xhtml">
+<head>
+	<meta charset="utf-8" />
+	<title>ImgURL - 简单、纯粹的图床程序。</title>
+	<meta name="generator" content="EverEdit" />
+	<meta name="author" content="xiaoz.me" />
+	<meta name="keywords" content="ImgURL,免费图床,图床程序,小z图床,XZ Pic" />
+    <meta name="description" content="ImgURL是一个简单、纯粹的图床程序，让个人图床多一个选择。" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="shortcut icon" href="favicon.ico"  type="image/x-icon" />
+	<link rel="Bookmark" href="favicon.ico" />
+    <link rel="stylesheet" href="./static/layui/css/layui.css">
+    <link rel="stylesheet" href="./static/style.css?v=1.2">
+    <script src = "https://libs.xiaoz.top/clipBoard.js/clipBoard.min.js"></script>
+    
+    <style type="text/css" media="screen" id="test">
+    	#imgbtn{
+	    	display: none;
+    	}
+    </style>
+</head>
+<body>
+<div class="layui-container">
+    <div class="layui-row">
+        <div class="layui-col-lg12 layui-col-xs12">
+        <div class="msg"><i class="layui-icon">&#xe645;</i>  注意：您上传的图片将会公开显示，勿上传隐私图片。此项目依赖于：<a href="https://imgurl.org/" target = "_blank">https://imgurl.org/</a></div>
+	    <!--选项卡测试-->
+		<div class="layui-tab layui-tab-brief" lay-filter="uptab">
+		  <ul class="layui-tab-title">
+		    <li class="layui-this">ImgURL</li>
+		    <li>SM.MS</li>
+		  </ul>
+		  <div class="layui-tab-content">
+		  	<!--上传到ImgURL-->
+		    <div class="layui-tab-item layui-show">
+			    <!-- 上传图片表单 -->
+	            <div class="layui-upload-drag" id="upimg">
+	                <i class="layui-icon">&#xe67c;</i>
+	                <p>点击上传，或将图片拖拽到此处</p>
+	            </div>
+	            <!-- 上传图片表单END -->
+		    </div>
+		    <!--上传到sm.ms-->
+		    <div class="layui-tab-item">
+			    <div class = "smfile">
+		            <a href="javascript:;" class="file">
+					    <input type="file" name="smfile" id="sm">
+						<i class="layui-icon" style = "font-size:6em;">&#xe67c;</i>
+					</a>
+	            </div>
+		    </div>
+		  </div>
+		</div>    
+	    <!--选项卡END-->
+        </div>
+    </div>
+    <div style = "clear:both;"></div>
+    <!-- 图片上传成功 -->
+    <div class="layui-row" id = "upok" style = "margin-top:1em;"> 
+        <div>
+            <div id="showpic" class = "layui-col-lg5"><a href="" target = "_blank"><img src=""></a></div>
+            <div id="piclink" class = "layui-col-lg6 layui-col-md-offset1">
+            <table class="layui-table" lay-skin="nob">
+                <colgroup>
+                    <col width="80">
+                    <col width="400">
+                    <col>
+                </colgroup>
+                <tbody>
+                    <tr>
+                        <td>URL</td>
+                        <td><input type="text" class="layui-input" id = "url"></td>
+                        <td><a href="javascript:;" class = "layui-btn layui-btn-sm" onclick = "copy('url')">复制</a></td>
+                    </tr>
+                    <tr>
+                        <td>HTML</td>
+                        <td><input type="text" class="layui-input" id = "html"></td>
+                        <td><a href="javascript:;" class = "layui-btn layui-btn-sm" onclick = "copy('html')">复制</a></td>
+                    </tr>
+                    <tr>
+                        <td>MarkDown</td>
+                        <td><input type="text" class="layui-input" id = "markdown"></td>
+                        <td><a href="javascript:;" class = "layui-btn layui-btn-sm" onclick = "copy('markdown')">复制</a></td>
+                    </tr>
+                    <tr>
+                        <td>BBcode</td>
+                        <td><input type="text" class="layui-input" id = "bbcode"></td>
+                        <td><a href="javascript:;" class = "layui-btn layui-btn-sm" onclick = "copy('bbcode')">复制</a></td>
+                    </tr>
+                </tbody>
+            </table>
+            </div>
+        </div>       
+    </div>
+    <!-- 图片上传成功END -->
+</div>
+
+  <div style = "clear:both;"></div>
+    <script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
+    <script src = "./static/index.js"></script>
+	<script src="./static/layui/layui.js"></script>
+	<script src="./static/embed.js?v=1.2"></script>
+	<script>
+		//隐藏按钮
+		//setTimeout('$("#imgbtn").remove()',100)
+		layui.use(['element'],function(){
+			var element = layui.element;
+			element.on('tab(uptab)', function(data){
+			  //console.log(this); //当前Tab标题所在的原始DOM元素
+			  //console.log(data.index); //得到当前Tab的所在下标
+			  //console.log(data.elem); //得到当前的Tab大容器
+			});
+		});
+
+		var load1 = document.querySelector("body");
+
+// 实例化即可
+new ctrlVUtil({
+    uploadUrl: "functions/cvupload.php",
+    targetElement: load1,
+	isCompleteImg:false,
+    data:{
+        name:"alanzhang"
+    },
+    success:function(data){
+        alert("上传成功");
+        console.log(data);
+    },
+	error: function(error){
+		alert("上传失败");
+	}
+});
+	</script>
+</body>
+</html>
--- a/static/imgurl.js
+++ b/static/imgurl.js
@ -0,0 +1,69 @@
				@@ -0,0 +1,69 @@
+// ==UserScript==
+// @name         ImgURL上传脚本
+// @namespace    https://imgurl.org/
+// @version      0.1
+// @description  ImgURL快捷上传工具
+// @author       xiaoz.me
+// @match        http://*/*
+// @match        https://*/*
+// @license      GPL
+// @grant        none
+// ==/UserScript==
+
+(function() {
+    'use strict';
+
+    //定义一个全局弹出层
+    window.layerstart = '<div id = "layer" style = "box-shadow: 1px 1px 2px #888888;border-radius:5px;top:0em;left:0;width:1280px;height:720px;background-color:#FFFFFF;position:fixed;z-index:999;display:none;border:1px solid #d2d2d2">';
+    layerstart += '<div style="text-align:right;padding:0.8em;border-bottom:1px solid #d2d2d2;"><a href="javascript:;" onclick="closelayer()" style="color:#FFFFFF;background-color:#FF5722;width:80px;text-align:center;padding:0.5em;border-radius:2px;padding-left:1em;padding-right:1em;">关闭</a></div>';
+    window.layerend = '</div>';
+
+    //让层居中显示
+    window.layerCenter = function(){
+	    var bwidth = window.screen.availWidth;
+	    var bheight = window.screen.availHeight;
+	    var layertop = (bheight - 720) / 2;
+	    var layerleft = (bwidth - 1280) / 2;
+
+	    //改变css
+	    $("#layer").css({"top":layertop,"left":layerleft});
+    }
+    //创建一个遮罩层
+    window.keepout = function(){
+	    var fade = '<div id = "fade" style = "width:100%;height:100%;background:rgba(0, 0, 0, 0.5);position: fixed;left: 0;top: 0;z-index: 99;" onclick = "closelayer()"></div>';
+	    $("body").append(fade);
+    }
+
+    //关闭层
+    window.closelayer = function(){
+	    $("#layer").hide();
+		//showSidebar();
+		$("#layer").remove();
+		$("#fade").remove();
+    }
+
+    //创建一个显示按钮
+    function imgurl(){
+	    //var imgButton = layerstart;
+	    //imgButton += '<iframe src = "http://localhost/imgurl/miniup.html" width="100%" height="660px" frameborder="0"></iframe>';
+	    //imgButton += layerend;
+	    //$("body").append();
+	    $("body").append('<div id = "imgbtn" style = "position:fixed;right:1em;bottom:1em;z-index:88;cursor:pointer;" onclick = "showImgurl()"><img src = "https://libs.xiaoz.top/material/image.png" width = "36px" height = "36px" /></div>');
+    }
+    //显示上传按钮
+    window.showImgurl = function(){
+	    var up = layerstart;
+	    up += '<iframe src = "https://imgurl.org/miniup.html" width="100%" height="660px" frameborder="0"></iframe>';
+	    up += layerend;
+	    $("body").append(up);
+
+	    $("#layer").show();
+	    
+	    //显示遮罩
+	    keepout();
+	    //居中显示层
+	    layerCenter();
+    }
+
+    imgurl();
+})();
--- a/static/index.js
+++ b/static/index.js
@ -0,0 +1,226 @@
				@@ -0,0 +1,226 @@
+/*!
+ *
+ * @author: diandian & alanzhang
+ * @date: 2016/8/19
+ * @overview: [截屏后，按粘贴快捷键ctrl+v上传，]
+ * @兼容性说明： IE11，Firefox，chrome
+ *
+ */
+
+
+'use strict';
+
+(function(root, factory){
+    if (typeof define === 'function' && define.amd) {
+        // AMD
+        define([], factory);
+    } else if (typeof exports === 'object') {
+        // Node, CommonJS-like
+        module.exports = factory();
+    } else {
+        // Browser globals (root is window)
+        root.ctrlVUtil = factory();
+    }
+}(this, function(){
+
+    function ctrlVUtil(option){
+
+        // 鼠标在该元素上，使用ctrl+v键时上传
+        this.targetElement = null;
+
+        // 用于响应paste事件的元素，如果页面不传递，则创建该元素，并位于targetElement前面
+        this.uploadInput = null;
+
+        // 默认的上传地址
+        this.uploadUrl = "http://www.oa.com/screenshot/create-file";
+
+        // 对于读取的图片base64，前缀为data:image/jpg;base64,base64content
+        // isCompleteImg为false则去掉前缀直接上传内容部分，为true则上传完整的base64字符串
+        this.isCompleteImg = false;
+
+        var that = this;
+
+        // 合并参数
+        that.mixinConfig(option);
+
+        // 鼠标移入和点击时上传，移出时失焦
+        that.targetElement.addEventListener("mouseover", function() {
+            that.uploadInput.focus();
+        });
+
+        that.targetElement.addEventListener("click", function() {
+            that.uploadInput.focus();
+        });
+
+        // 移除鼠标则input失去交掉
+        that.targetElement.addEventListener("mouseleave", function() {
+            that.uploadInput.blur();
+        });
+
+        // 监听paste的事件
+        that.uploadInput.addEventListener('paste', function(e) {
+            that.handlePaste(e);
+        });
+
+    }
+
+    /**
+     * [mixinConfig 整合参数]
+     * @param  {[type]} option [description]
+     * @return {[type]}        [description]
+     */
+    ctrlVUtil.prototype.mixinConfig = function(option){
+        this.targetElement = option.targetElement || document.querySelector(".js-upload");
+        this.uploadInput =  this.createInputTarget();
+
+        this.isCompleteImg = "isCompleteImg" in option ? option.isCompleteImg : this.isCompleteImg;
+
+        // 上传地址
+        this.uploadUrl = option.uploadUrl || this.uploadUrl;
+
+        // 除了图片内容以外的其他数据
+        this.data = option.data;
+
+        // 上传成功时的回调函数
+        this.success = option.success || function(data) {
+            console.log(data);
+        };
+
+        // 上传失败时的回调函数
+        this.error = option.error || function(error) {
+            console.log(error);
+        };
+    };
+
+    /**
+     * [createInputTarget 创建div元素，用于响应paste事件]
+     * @return {Element} [description]
+     */
+    ctrlVUtil.prototype.createInputTarget = function() {
+        var imgContinaer = document.createElement("div");
+
+        // 使其不可见
+        imgContinaer.style.cssText = "border:none;margin:0;padding:0;font-size: 0;height:1px;width:1px;opacity:0;position:fixed;z-index:-1;";
+
+        // 让其可编辑，能响应paste事件
+        imgContinaer.contentEditable = true;
+        imgContinaer.class = "ui-ctrlv-uploadInput";
+
+        // 插入targeElementn前面
+        this.targetElement.parentNode.insertBefore(imgContinaer, this.targetElement);
+
+        return imgContinaer;
+    };
+
+    /**
+     * [handlePaste 处理粘贴行为]
+     * @param  {Event} e [粘贴事件]
+     * @return {[type]}   [description]
+     */
+    ctrlVUtil.prototype.handlePaste = function(e){
+
+        var that = this;
+
+        // webkit 内核支持items方法
+        if (e && e.clipboardData && e.clipboardData.items) {
+
+            // 获取item
+            var item = e.clipboardData.items[0],
+                that = this;
+
+            if (item.type.indexOf('image') != -1) {
+
+                var blob = item.getAsFile();
+
+                // 创建读取对象
+                var fileReader = new FileReader();
+
+                // 将文件读取为字符串
+                fileReader.readAsDataURL(blob);
+
+                fileReader.addEventListener('load', function(e) {
+                    var file = e.target.result;
+                    that.send(file);
+                }, false);
+
+            } else {
+
+                that.alertMsg("请粘贴image类型");
+
+            }
+
+        // firefox无法使用items方法，在粘贴时，图片会作为img标签插入targetElement中，
+        // 获取img标签的src内容进行上传
+        } else {
+
+            setTimeout(function() {
+                var $img = that.uploadInput.querySelector("img");
+
+                if ($img) {
+                    that.send($img.src);
+                } else {
+                    that.alertMsg("浏览器不支持剪贴板操作");
+                    return;
+                }
+
+            }, 200);
+        }
+
+
+    };
+
+    /**
+     * [send 上传图片]
+     * @param  {string} imgcontent [图片内容base64格式]
+     * @return {[type]}            [description]
+     */
+    ctrlVUtil.prototype.send = function(imgcontent) {
+        var that = this;
+
+        that.uploadInput.innerHTML = "";
+
+        var data = that.data || {};
+
+        // 根据sCompleteImg来决定上传的是整体的base64字符串还是仅仅为内容部分
+        data.content = this.isCompleteImg ? imgcontent : imgcontent.split(';')[1].split(',')[1];
+
+        var xhr = new XMLHttpRequest();
+
+        xhr.open("post",that.uploadUrl,true);
+
+        xhr.onreadystatechange = function(e) {
+            if (xhr.readyState == 4) {
+                if (xhr.status == 200) {
+                    var ret = JSON.parse(xhr.responseText);
+                    that.success && that.success(ret);
+                } else {
+                    that.error && that.error(e, xhr);
+                }
+            }
+        };
+
+        xhr.onerror = function(e) {
+            that.error && that.error(e, xhr);
+        };
+
+        xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
+
+        var dataString = [];
+
+        for(var key in data){
+            dataString.push(key+"="+encodeURIComponent(data[key]));
+        }
+
+        xhr.send(dataString.join("&"));
+    };
+
+    ctrlVUtil.prototype.alertMsg = function(content){
+        alert(content);
+    }
+
+    // 暴露构造函数
+    return ctrlVUtil;
+}));
+
+
+
--- a/static/paste-upload-image.js
+++ b/static/paste-upload-image.js
@ -0,0 +1,127 @@
				@@ -0,0 +1,127 @@
+(function ($) {
+    var $this;
+    var $ajaxUrl = '';
+    $.fn.pasteUploadImage = function (ajaxUrl) {
+        $this = $(this);
+        $ajaxUrl = ajaxUrl;
+        $this.on('paste', function (event) {
+            var filename, image, pasteEvent, text;
+            pasteEvent = event.originalEvent;
+            if (pasteEvent.clipboardData && pasteEvent.clipboardData.items) {
+                image = isImage(pasteEvent);
+                if (image) {
+                    event.preventDefault();
+                    filename = getFilename(pasteEvent) || "image.png";
+                    text = "{{" + filename + "(uploading...)}}";
+                    pasteText(text);
+                    return uploadFile(image.getAsFile(), filename);
+                }
+            }
+        });
+        $this.on('drop', function (event) {
+            var filename, image, pasteEvent, text;
+            pasteEvent = event.originalEvent;
+            if (pasteEvent.dataTransfer && pasteEvent.dataTransfer.files) {
+                image = isImageForDrop(pasteEvent);
+                if (image) {
+                    event.preventDefault();
+                    filename = pasteEvent.dataTransfer.files[0].name || "image.png";
+                    text = "{{" + filename + "(uploading...)}}";
+                    pasteText(text);
+                    return uploadFile(image, filename);
+                }
+            }
+        });
+    };
+
+    pasteText = function (text) {
+        var afterSelection, beforeSelection, caretEnd, caretStart, textEnd;
+        caretStart = $this[0].selectionStart;
+        caretEnd = $this[0].selectionEnd;
+        textEnd = $this.val().length;
+        beforeSelection = $this.val().substring(0, caretStart);
+        afterSelection = $this.val().substring(caretEnd, textEnd);
+        $this.val(beforeSelection + text + afterSelection);
+        $this.get(0).setSelectionRange(caretStart + text.length, caretEnd + text.length);
+        return $this.trigger("input");
+    };
+    isImage = function (data) {
+        var i, item;
+        i = 0;
+        while (i < data.clipboardData.items.length) {
+            item = data.clipboardData.items[i];
+            if (item.type.indexOf("image") !== -1) {
+                return item;
+            }
+            i++;
+        }
+        return false;
+    };
+    isImageForDrop = function (data) {
+        var i, item;
+        i = 0;
+        while (i < data.dataTransfer.files.length) {
+            item = data.dataTransfer.files[i];
+            if (item.type.indexOf("image") !== -1) {
+                return item;
+            }
+            i++;
+        }
+        return false;
+    };
+    getFilename = function (e) {
+        var value;
+        if (window.clipboardData && window.clipboardData.getData) {
+            value = window.clipboardData.getData("Text");
+        } else if (e.clipboardData && e.clipboardData.getData) {
+            value = e.clipboardData.getData("text/plain");
+        }
+        value = value.split("\r");
+        return value[0];
+    };
+    getMimeType = function (file, filename) {
+        var mimeType = file.type;
+        var extendName = filename.substring(filename.lastIndexOf('.') + 1);
+        if (mimeType != 'image/' + extendName) {
+            return 'image/' + extendName;
+        }
+        return mimeType
+    };
+    uploadFile = function (file, filename) {
+        var formData = new FormData();
+        formData.append('imageFile', file);
+        formData.append("mimeType", getMimeType(file, filename));
+
+        $.ajax({
+            url: $ajaxUrl,
+            data: formData,
+            type: 'post',
+            processData: false,
+            contentType: false,
+            dataType: 'json',
+            xhrFields: {
+                withCredentials: true
+            },
+            success: function (data) {
+                if (data.success) {
+                    return insertToTextArea(filename, data.message);
+                }
+                return replaceLoadingTest(filename);
+            },
+            error: function (xOptions, textStatus) {
+                replaceLoadingTest(filename);
+                console.log(xOptions.responseText);
+            }
+        });
+    };
+    insertToTextArea = function (filename, url) {
+        return $this.val(function (index, val) {
+            return val.replace("{{" + filename + "(uploading...)}}", "![" + filename + "](" + url + ")" + "\n");
+        });
+    };
+    replaceLoadingTest = function (filename) {
+        return $this.val(function (index, val) {
+            return val.replace("{{" + filename + "(uploading...)}}", filename + "\n");
+        });
+    };
+})(jQuery);