QJFileCenter 又名 Lotus云盘, 是一款非常简单,方便,好用的文件存储服务器软件,支持PDF,WORD,PPT格式的文件预览
此软件由企捷公司出品,当前版本2.2
软件已经开源: https://gitee.com/qikj/QJ_FileCenter
感谢作者的无私奉献,大家多给星
官方教程:
https://www.yuque.com/books/share/cd909cd4-cee7-4479-8d5c-2f0c41572dc3/kly1ig
安装包下载地址:
链接: https://pan.baidu.com/s/1qSVvBNvg63FDqyuWgzxVoQ
提取码: 75eh
安装方法:
找到程序目录下的 installservice.bat 批处理文件,右键以管理员身份运行即可
打开浏览器,输入 http://localhost:9100 ,看到界面就是安装成功了
默认用户名: admin 默认密码: 851215
如果密码错误,可以通过找到bin目录下的.db文件,用navicat打开,sysuser表里面可以看到默认有四个用户,网上找个在线解析md5的网站,解析一下密码就行了
开发对接
API地址 | API说明 | 返回说明 |
---|---|---|
【GET】 | /{qycode}/document/{zyid} | 根据资源ID下载文件,多个资源则zyid用逗号分开 |
【GET】 | /{qycode}/document/image/{zyid} | 获取图片文件,用于src里得图片路径 |
【GET】 | /{qycode}/document/image/{zyid}/{width}/{height} | 获取图片得压缩文件,用于缩略图 |
【GET】 | /document/YL/{zyid} | 获取office预览页面 直接返回预览页面(支持手机端和PC端)(这里的预览接口好像有问题,实际的预览地址见demo) |
【GET】 | /document/YL/{zyid}/{index} | 获取office文件生成得图片, 根据资源ID和索引返回生成office得图片 |
【GET】 | /document/viedo/{zyid} | 获取二进制视频流文件 用于视频文件(MP4)播放时需要用到得接口 |
【POST】 | /document/fileupload/{qycode} | POST上传接口 传统得上传接口 |
Vue2.0版本的使用Demo
https://gitee.com/zheyiw/qj-file-center-vue-demo
纯Html的调用Demo
1,必须引入jquery
2,再引入服务器自带的上传组件 : http://localhost:9100/web/qj_upload.js
3,按如下html把上传组件绑定到一个按钮上面就可以了
用浏览器直接打开此html可以看到上传效果
把此html部署到IIS里面,才能正常返回上传后的文件信息
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta charset="utf-8" />
<title>FileCenterDemo</title>
<script type="text/javascript" src="https://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="http://localhost:9100/web/qj_upload.js"></script>
<script>
let fileCenterUrl = 'http://localhost:9100/'
let GlobalfileData = undefined
// 上传组件的配置文件
let obj = {
uploadButtton: 'upload', //上传按钮的ID
fileapiurl: fileCenterUrl, //服务器地址
usercode: "qycode",//文件中心中空间里对应的QYCODE
secret: "qycode",//文件中心中空间里里对应的企业secret
width: "50%",//弹出窗口宽度
left: "25%",//弹出窗口左侧边距
upinfo: "测试消息",//上传附带信息
webupconfig: {
//WebUpload配置项(可以配置文件上传类型,大小等属性)
fileNumLimit: 5,
},
//文件上传成功,返回上传的数据: 需要把此demo部署到IIS里面,才能正常返回上传后的文件信息
filecomplete: function (fileData) {
console.log('单个文件上传完毕!')
console.log('每上传一个文件调用一次本方法(filecomplete),但是入参fileData是全部文件的信息');
console.log('每删除一个文件也会调用一次本方法(filecomplete),入参fileData是剩余全部文件的信息');
console.log(JSON.stringify(fileData));
},
//关闭按钮,返回上传的数据(一个数组): 需要把此demo部署到IIS里面,才能正常返回上传后的文件信息
closeupwin: function (fileData) {
console.log('closeupwin:关闭了上传窗口');
console.log(JSON.stringify(fileData));
let dataJson = fileData.replace(/NaN/g, null)
let data = JSON.parse(dataJson)
for (let i = 0; i < data.length; i++) {
//服务器地址: 正式使用时替换为服务器地址
let downloadUrl = fileCenterUrl + 'qycode/document/' + data[i].zyid
let previewUrl = fileCenterUrl + '/Web/Html/Tools/doc.html?zyid=' + data[i].zyid
console.log('文件名:' + data[i].filename);
console.log('文件下载地址:' + downloadUrl);
console.log('文件预览地址:' + previewUrl);
}
GlobalfileData = data;
}
};
//预览
function previewFile() {
console.log('previewFile:' + GlobalfileData);
if (GlobalfileData === undefined) {
alert('没有可预览的数据')
return
}
let file1 = GlobalfileData[0]
let url = fileCenterUrl + '/Web/Html/Tools/doc.html?zyid=' + file1.zyid
window.open(url, 'top')
}
//下载
function downloadFile() {
if (GlobalfileData === undefined) {
alert('没有可预览的数据')
return
}
let file1 = GlobalfileData[0]
let url = fileCenterUrl + '/qycode/document/' + file1.zyid
window.location.href = url
}
$(document).ready(
function () {
//反向绑定上传按钮的点击事件
new QJUpload(obj);
},
);
</script>
</head>
<body>
需要把此demo部署到IIS里面,才能正常返回上传后的文件信息<br>
<input type="button" id="upload" value="上传" />
<input type="button" onclick="previewFile()" value="预览" />
<input type="button" onclick="downloadFile()" value="下载" />
</body>
</html>
参考: 上传组件的源码
var qjfiledata = [];
function QJUpload(t) {
if (!(t.usercode && t.uploadButtton && t.secret))
throw new TypeError("缺少参数!");
this.options = {
usercode: t.usercode,
secret: t.secret,
upinfo: t.upinfo || "",
webupconfig: JSON.stringify(t.webupconfig || {}),
filecomplete: t.filecomplete || function () { },
closeupwin: t.closeupwin || function () { },
url: location.href,
width: t.width || "50%",
height: t.height || "60%",
top: t.top || "15%",
left: t.left || "25%",
urlPrefix: "",
source: "qj-upload"
},
this.uploadButton = document.getElementById(t.uploadButtton),
this.upid = t.uploadButtton,
//this.url = t.fileapiurl + "/" + t.usercode + "/document/fileupload",
this.url = t.fileapiurl + "/Web/Html/Tools/fileupload.html",
this._init()
}
QJUpload.prototype = {
constructor: QJUpload,
_addHander: function (t, e, o) {
t.addEventListener ? t.addEventListener(e, o, !1) : t.attachEvent ? t.attachEvent("on" + e, o) : t["on" + e] = o
},
_checkH5Support: function () {
var t = document.createElement("input")
, e = !(!window.File || !window.FileList)
, o = new XMLHttpRequest
, i = !!window.FormData;
return "multiple" in t && e && "onprogress" in o && "upload" in o && i
},
_init: function () {
var t = this;
// this._checkH5Support() || (this.url = this.options.urlPrefix + "/upload-flash/index.html");
var e = this._createIframe()
, o = function () {
this.readyState && "complete" !== this.readyState || t.update()
}
;
this.frameMsg = e.contentWindow,
e.attachEvent ? e.attachEvent("onload", o) : e.onload = o,
this._addHander(this.uploadButton, "click", function (event) {
t.openWrap()
}),
this._handleMsgReceive()
},
_createIframe: function () {
var op = this;
var t = document.createElement("div")
, e = document.createElement("div")
, o = document.createElement("div")
, f = document.createElement("div")
, i = document.createElement("span")
, n = document.createElement("iframe");
return t.setAttribute("id", "qj-wrapAll" + op.upid),
t.style.display = "none",
f.style.cssText = "width: 100%;height: 50px;background-color:#fff;margin-top: -6px;text-align: right;",
e.style.cssText = "display: block;position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 2001;background-color: #000;-moz-opacity: 0.5;opacity: .50;filter: alpha(opacity=50);",
o.style.cssText = "display: block;position: fixed;left: " + op.options.left + ";top: " + op.options.top + ";width: " + op.options.width + ";height: " + op.options.height + ";BACKGROUND-COLOR: #00b7ee; z-index: 2002;box-shadow: 0 0 25px rgba(0,0,0,0.7);border-radius: 5px;padding-top: 45px;",
i.innerHTML = "×",
f.innerHTML = " <button id='qjclose" + op.upid + "' style='margin-top: 5px;cursor:pointer;height: 40px;margin-right: 10px;width: 120px;font-size: 14px;background-color: rgb(0, 183, 238); border: 0; color: #fff;'>确定</button>",
i.style.cssText = "width: 40px;height: 40px;position: absolute;top: 0px;right: 0px;cursor: pointer;text-align: center;line-height: 40px;color: #FFF;font-size: 30px;font-family: microsoft yahei;border-radius: 0 5px 0 0;",
i.onclick = function () {
t.style.display = "none"
},
//n.setAttribute("src", this.url),
n.setAttribute("id", "qj-iframe" + op.upid),
n.setAttribute("name", "qj-iframe" + op.upid),
n.setAttribute("width", "1000px"),
n.setAttribute("height", "600px"),
n.style.cssText = "width: 100%;height: 100%;z-index: 2002;border:none;background-color: #fff;",
o.appendChild(n),
o.appendChild(i),
o.appendChild(f),
t.appendChild(e),
t.appendChild(o),
document.getElementsByTagName("body")[0].appendChild(t),
document.getElementById("qjclose" + op.upid).onclick = function () {
document.getElementById("qj-wrapAll" + op.upid).style.display = "none";
"function" == typeof op.options.closeupwin && op.options.closeupwin(qjfiledata, op.uploadButton);
},
n
},
_handleMsgReceive: function () {
var t = this;
this._addHander(window, "message", function (e) {
try {
var o = JSON.parse(e.data);
switch (o.type) {
case "filecomplete":
qjfiledata = o.data;
"function" == typeof t.options.filecomplete && t.options.filecomplete(o.data);
break;
case "closewin":
closeWrap();
}
} catch (e) {
console.debug(e.message);
}
})
},
update: function () {
if ("object" == typeof arguments[0]) {
for (var t in arguments[0])
arguments[0].hasOwnProperty(t) && (this.options[t] = arguments[0][t]);
arguments[0].ts && (this.options.ptime = arguments[0].ts)
}
this.frameMsg.postMessage(JSON.stringify(this.options), this.url)
},
openWrap: function () {
var op = this;
//this.frameMsg.postMessage(JSON.stringify({
// openWrap: !0
//}), this.url),
//this.options.openWrap && this.options.openWrap(),
document.getElementById("qj-iframe" + op.upid).src = this.url;
document.getElementById("qj-wrapAll" + op.upid).style.display = "block"
},
closeWrap: function () {
var op = this;
document.getElementById("qj-wrapAll" + op.upid).style.display = "none"
}
};