Giter Site home page Giter Site logo

shiqw / filemanager Goto Github PK

View Code? Open in Web Editor NEW

This project forked from markstock7/filemanager

0.0 0.0 0.0 12.99 MB

前端文件管理工具, 采用类似阿里云oss的设计, 所有的目录和文件均以key标识, 因为制作该工具的本意是为网站的后台管理系统设计一个类似wordpress一样的上传文件管理插件,但要同时兼容阿里云oss, 和本地云, 以及其他云存储

JavaScript 61.36% CSS 33.84% HTML 0.54% Java 0.39% Objective-C 1.93% Makefile 1.92%

filemanager's Introduction

截图

查看screenshot 目录 #Usage 打开core/server/config/fileManager.config.js 可以进行bucket配置,容器根目录设置

默认的容器为根目录下localCloudStore

bower install

npm install

npm start

然后在浏览器中打开http://localhost:3001/

#TODO 图片显示接口,可以让文件中的图片直接显示

文件下载接口

#Service 配置 前台通过service和后端相应的api进行交互,每个service接口都应该遵循相应的规格,查看 <<服务器端接口配置>>

# HTML
<div class="fileManager"></div>


# Javascript
fileManager = $('#fileManager').fileManager({

    //配置服务
    Service: [{

        // 服务名称
        serviceName: 'local',

        // 服务的域
        server: 'http://localhost:3000',

        listBuckets: {
            method: 'GET',
            endpoint: '',
        },

        listFolders: {
            method: 'GET',
            endpoint: '',
        },

        listObjects: {
            method: 'GET',
            endpoint: '',
        },

        createFolder: {
            method: 'POST',
            endpoint: ''
        },

        deleteObject: {
            method: 'DELETE',
            endpoint: ''
        },

        reNameObject: {
            method: 'PUT',
            endpoint: ''
        },

        mvObject: {
            method: 'POST',
            endpoint: '/api/localCloud/object'
        }
    }],

    //
    Title: 'Greate Media',
});

#服务器端接口配置

####createFolder 创建目录

请求方法: Post
Request Body: {
	bucket:		
	key:
	Addition:[]		
	newFolderName:
}

返回结果: {
	newFOlderKey: 新目录的key
}

####reNameObject 修改objcet的名称(可以是文件夹,也可以是文件名)

请求方法: PUT
Request Body: {
	bucket:  
	key:  
	fromName:
	toName:
	Addition:[]
}

返回结果: {
	newKey:
}

####deleteObject 删除objcet(可以是文件夹, 也可以是文件名) 可以在服务器端设置删除模式,如果为strict则会强行删除目录,即便目录不为空(使用rimraf-promise模块)

如果为normal则调用fs.rmdir,如果目录不为空,则会报错

请求方法: DELETE
Request Body: {
    bucket:
    key:
}

返回结果: 'ok'

####mvObject 移动Object toKey 必须为目录, fromKey 可以为文件也可以为目录

请求方法: POST
Request Body: {
	bucket:
	fromKey:
	toKey
}

返回结果 {
    toNewKey: // 新的fromKey
}

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.