Giter Club home page Giter Club logo

yuyixing / web-oss-browser Goto Github PK

View Code? Open in Web Editor NEW

This project forked from yangrds/web-oss-browser

0.0 0.0 0.0 2.11 MB

WEB-OSS-Browser是一款阿里云对象存储web端管理工具(因为每次查看对象存储的信息都要登录阿里云控制台,不胜其烦,然后WEB-OSS-Browser就出来了),本工具为B/S架构,直连阿里云ali-oss(AccessKeyId和AccessKeySecret登陆)功能包括文件管理,文件复制/裁剪,二维码生成,代码编辑,图片裁剪,文件上传(断点续传),文件下载,批量获取下载地址,书签管理,图片预览,图片裁剪,后续将会更新更多实用新功能。该项目不接受任何意见以及建议(包括但不限于lssues,Pull requests),已经很完善了。

JavaScript 48.59% HTML 0.32% Vue 50.69% SCSS 0.40%

web-oss-browser's Introduction

WEB-OSS-Browser开源文档(使用教程)

经过两个月的努力WEB-OSS-Browser基本开发完毕,本工具为B/S架构,直连阿里云ali-oss,不参杂任何第三方接口,不需要担心您的隐私泄露(可以参阅源码检查API接口),WEB-OSS-Browser包括文件管理,文件复制/裁剪,二维码生成,代码编辑,图片裁剪,文件上传(断点续传),文件下载,批量获取下载地址,书签管理,图片预览,图片裁剪,后续将会更新更多实用新功能。

免责声明

本网站所展示项目都属于 非商业盈利行为,其目的是为了更好的交流及讨论技术,创建更和谐的社区环境。 本网站及其所展示项目的部分设计资源均来源于网络,如果这部分资源侵犯了您的合法权益,请您第一时间联系我, 我将已最快的速度将侵犯您权益的内容下线处理。

联系方式: [email protected]

WEB-OSS-Browser 基于MIT协议开放源代码, 特此免费授予获得副本的任何人 软件和相关文档文件(以下简称“软件”)的交易 在软件中不受限制,包括但不限于权利 使用,复制,修改,合并,发布,分发,再许可和/或出售 本软件的副本

核心资源: 本软件核心代码来自 ali-sdk/ali-oss 您可以查看其开源代码及开源许可证

责任归属:本人不对 WEB-OSS-Browser 任何时间造成的任何后果承担任何责任,在使用前请务必参阅WEB-OSS-Browser源代码

本工具在UI方面参照阿里云官方OSS-Browser设计(如果涉及侵权,将会第一时间更改)

全部代码围绕着ali-sdk/ali-oss进行开发,没有抄袭OSS-Browser一个字节OSS-Browser作为阿里云官方客户端工具(桌面程序)稳定性将是毋庸置疑的,他是WEB-OSS-Browser一直学习以及追赶的目标。

登录WEB-OSS-Browser

Snipaste_2021-03-30_16-28-06

准备工作

关于如何获取AccessKeyId和AccessKeySecret

配置跨域资源共享(CORS)规则

通过浏览器直接访问OSS时,CORS配置规则要求如下:

  • 来源:设置精准域名(例如www.aliyun.com)或带有通配符星号(*)的域名(例如*.aliyun.com)。
  • 允许 Methods:建议您根据实际使用场景,选择不同的Methods。例如分片上传时,设置为PUT;删除文件时,设置为DELETE
  • 允许 Headers:设置为*
  • 暴露 Headers:设置为ETagx-oss-request-idx-oss-version-id

Snipaste_2021-03-30_16-52-56

感觉上面的配置很复杂?(使用官方oss工具也需要配置),打开跨域设置,按照上面的填写即可,来源可以填写自己特定的域名,*代表所有

文件上传(断点续传)

  1. 工具的右下角可以直接打开上传管理器
  2. 点击工具栏的文件可以选择文件上传(支持多选)
  3. 点击工具栏的目录可以选择文件上传(整个目录)
  4. 请确保每次同时上传文件不超过1000个(数量过大可能导致阿里云API接口拥堵)

Snipaste_2021-03-30_17-04-00

获取地址

勾选需要的文件,点击工具栏获取地址,可以批量获取所有文件的下载地址

Snipaste_2021-03-30_17-08-44

点击目录列表文件对应的获取地址,可以获取该文件的二维码,以及下载地址

Snipaste_2021-03-30_17-21-36

图片裁剪

点击工具栏的图片裁剪,可以唤醒图片裁剪控制台

Snipaste_2021-03-30_17-25-06

可以对云端图片直接进行裁剪(从云端下载至内存中转为流数据)可以重选一张图片替换云端图片,多次裁剪均不满意,可以一键恢复原图(重选后的图片不支持),点金更新按钮,可以将全部图片更新至云端。

复制/移动

勾选需要的文件,点击复制/移动,然后选择文件夹,点击粘贴可拷贝至对应,目录。

注意:移动文件在拷贝结束后会删除源文件,请不要进行大批量移动,以免API接口拥堵造成误删文件。

删除

点击工具栏的删除按钮,可以删除已勾选的文件,文件批量删可以进行大批量操作(漏删的话在执行即可)

在线代码编辑器

WEB-OSS-Browser集成ACE代码编辑器,支持代码在线编辑,支持110+种语言

  1. 支持代码智能补全/提示
  2. 支持全局搜索/替换关键字
  3. 支持编辑过程中切换语言高亮
  4. 支持展开/收缩代码块
  5. 支持代码异常标注
  6. 基本的代码编辑均支持

Snipaste_2021-03-30_17-41-13

图片预览

点击图片的文件名即可打开文件预览界面

WEB-OSS-Browser基本的操作就介绍到这里,更多功能可以下载源码部署,或者查看测试案例

web-oss-browser's People

Contributors

yangrds avatar

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.