我想要一个静态的网页，不涉及后端。直接用前端调用 oss 的 api 完成文件上传，文件列表显示和下载，实现基本的网盘功能。
感觉这个非常方便，不需要购买云主机，直接把静态网页也托管在 oss 上就好了。平时只有储存的费用。
我知道这有风险，毕竟 api key 直接在前端暴露。但是我主要是几个朋友之间小规模用，再加上设置好足够的权限和资源限制，可以把风险控制住。
不知道有没有现成的项目，可以直接使用的？
我用阿里云的教程，搭了一个纯静态的，上传的网页，但是文件列表显示与下载的那个网页没做成，不知道要怎么实现？
谢谢各位
 |
1
ktqFDx9m2Bvfq3y4 Apr 21, 2022
Cloudflare Pages ，网页放 Git 中，免费不要钱。只是不要传太大文件。
|
 |
2
mao13820 OP @Chad0000 谢谢。我主要是不知道怎么写那个静态网页。我想写个包含上传文件，显示文件列表，下载文件这三个功能的静态网页。具体操作是调用对象存储的 api 完成的，文件平时就放在 oss 中，网页托管在 git 或者 oss 中。这样就不需要服务器了。
|
|
3
ktqFDx9m2Bvfq3y4 Apr 21, 2022
@mao13820
如果要用 OSS ，你可以用 JS 把 API Key 加密，密码在页面上手动输入，这样就不是特别担心 API Key 暴露。或者每次输入 API Key 也行。 |
 |
4
TMaize Apr 21, 2022
|
 |
5
yin1999 Apr 21, 2022
我之前做过一个，讲一下我做的思路：
1. API Key 用 AES-GCM 加密，放 OSS 里面，并设置权限为公开 2. 放置文件的目录权限设置成私密，只允许带权限访问 3. 前端访问的时候，要登录输入密码，这个密码就是 API key 的加密密钥，如果解密成功，就能获取 API key ，从而在前端通过调用 API Key 来访问私密文件夹 4. 关于文件列出这一块，可以配合函数计算服务，在阿里云函数计算那边弄一个 OSS 触发的函数计算服务，它能够在文件列表发生变化时，将当前目录下的文件目录写道一个专门列出文件列表的目录下，并以 JSON 格式存储，前端可以直接调用获取。当然，这块也可以通过调用 API 直接列出目录，这个实时性较高。 附一个之前写的，很（非常）简陋的项目（不带函数计算那块，文件权限那块也没弄，默认是公开访问，仅上传需要 API Key ，这个可以自己改）。核心代码就是 scripts 里面的 fileManager.js ，实现了上传、登录、文件列出、删除这几个功能，如果还需要其它的功能，可以参照阿里云 OSS 的 API 文档自己加。 https://asset.dvlp4.fun/file-share/fileLister.zip |
|
6
yin1999 Apr 21, 2022
@yin1999 补充一下，因为文件上传到一半后中断的话，OSS 会默认保留文件，所以文件上传那块是有做 md5 校验的（ WebAssembly ），如果不需要这个，或者要用其它的 md5 库，可以自己改哈。
|
|
7
mao13820 OP @yin1999 非常感谢，我下载下来试了一下，发现无法直接打开，有以下报错。不知如何处理，谢谢
Failed to load resource: net::ERR_FILE_NOT_FOUND index.full.js:1 Failed to load resource: net::ERR_FILE_NOT_FOUND index.css:1 Failed to load resource: net::ERR_FILE_NOT_FOUND index.css:1 Failed to load resource: net::ERR_FILE_NOT_FOUND index.js:1 Failed to load resource: net::ERR_FILE_NOT_FOUND upload.svg:1 Failed to load resource: net::ERR_FILE_NOT_FOUND |
 |
9
sommer Apr 21, 2022 via Android
那为什么不直接用对象存储自己的控制台呢？
|
 |
12
cheese Apr 21, 2022
列表显示有 listV2 方法，但是 oss 是对象储存，所以需要你自己去处理路径，模拟文件夹，如果是小文件多的话，还得做好列表渲染优化。
实际上阿里云官方的客户端就挺好用的，你只要在 ram 控制里，设定好你每个朋友的权限就行了，oss 权限我记得甚至可以设定到一个文件夹（不太确定了，之前好像看过）。用那个更加方便 |
Select Language