CFWorker-ODIndex 中文文档 & 使用教程

OneDrive,相信大家都不陌生,微软家的网盘,虽说有类似于 OneManager 一样的目录列表程序,但是直连海外总是会遭受严重的丢包,得到极其糟糕的体验。这时候 CLoudFlare 作为不那么好使的 CDN 就排上用场了,项目 onedrive-cf-index 解决了这个问题, 但是据我观察, 这个仓库作者应该是个中国人, 但是 readme 文档可不是中文, 这对一些使用者造成了一定的困扰, 而且文档相当 言简意赅 , 这一篇文章相当于文档的中文翻译和使用教程.

使用前言
部署此项目较为麻烦, 请确保你满足以下俩个及以上想法后, 才继续往下读:

  1. 我非常需要搭建于 CloudFlare 的 OneDrive 目录列表吗?
  2. 我非常需要这个版本的目录列表吗?
  3. 我有这个耐心吗?
    如果没有, 那么我们建议你可以使用另一个功能和 UI 稍差的 cf 目录列表 OneDrive-Index-Cloudflare-Worker 这个版本有不是很详尽的中文文档, 并且较为简单, 或者试试一步生成的 GDIndex, 可以参考我之前写的GDIndex 部署参考

简介

新功能

  • 新设计: spencer.css。
  • 根据文件类型呈现的文件图标。
  • 使用“Font Awesome icons” 图标代替材料设计图标(以获得更好的设计一致性)。
  • 使用 github-markdown-css 进行 README.md 渲染
  • 添加 Cookie 以更好地进行目录导航。
  • 支持文件预览:
  • 图片:.png,.jpg,.gif
  • 纯文本:.txt
  • 文档:.md,.mdown,.markdown
  • 代码:.js,.py,.c,.json。
  • PDF:延迟加载,加载进度和内置的 PDF 查看器
  • 音乐 / 音频: .mp3,.aac,.wav,.oga
  • 视频: .mp4,.flv,.webm,.m3u8

  • 代码语法以 GitHub 样式突出显示。(使用 PrismJS。)
  • 图像预览支持中型缩放效果。
  • 使用 Google Firebase 实时数据库缓存和刷新令牌。(对于那些负担不起 Cloudflare Workers KV 存储的人。 😢)
  • 在 Turbolinks®的帮助下进行延迟加载。(从 folder 转到时有些问题 file preview,但不会降低用户体验。)

在这表面下:

  • 一直以来都是 CSS 动画。
  • 使用 wrangler 和 webpack 打包源代码。
  • 转换所有 CDN 以使用 jsDelivr 加载。
  • 没有外部 JS 脚本,所有脚本都已通过 webpack 加载!(除了某些库。)


所有其他功能

请参阅:新功能 | OneDrive-Index-Cloudflare-Worker

开始

导入此项目

请注意!
请不要 Fork 此项目 ,
在这个过程中你将会获取到数串 token,fork 的仓库无法转为私有仓库, 这将会对你的数据造成威胁.

点击右上角的 + 号选择 Import 项目

原先仓库地址填写 https://github.com/spencerwooo/onedrive-cf-index, 新仓库名称随意, 仓库类型必须改为 Private 私人, 最后导入

导入成功, 进入 repo:

获取 Token

进入 https://heymind.github.io/tools/microsoft-graph-api-auth 开始准备你所需要的东西:

进入 https://portal.azure.com/#blade/Microsoft_AAD_RegisteredApps/ApplicationsListBlade,注册一个新 app【使用微软账号】

几番跳转后,来到这样的界面:

注意,我们强烈建议用英文界面,中文界面可能存在翻译错误产生误导

点击 OneIndex,进入应用详情

点击 Redirect URIs 修改跳转链接:

将此处改为 https://heymind.github.io/tools/microsoft-graph-api-auth

设置 API:

至少选择 offline_access, Files.Read, Files.Read.All .

返回,获取 Application (client) ID

在这里填上复制的 client id,并点击 AUTHORIZE 验证

你会发现跳转一段时间后又回到了拉取界面, 不过多了一个提示框, 上面写着已经获取到 Code

接着我们获取 Secrets, 点击 Certificates & secrets, 进入该选项卡:

新增一个:

名字随意, 期限为永久:

复制生成的密钥, 请注意此处密钥仅 出现一次 , 以后就不会再出现了

将获得密钥粘贴进第五步:

点击 GetToken, 将跳转至如下界面:

此处若失败,请重试第四步

将获得字段的 refresh_token 写入,重新制得 token:

取得 token:

妥善保管,接下来我们会用到。

OneDriveToken 完毕,接下来进入 FireBase 教程:

作为数据库存储,原本采用的是 cloudFlareKV 存储,但考虑到大部分用户没有这个钱去买 KV,于是采用了第三方存储。

进入 https://firebase.google.com/

开始创建项目:

项目名字随意,下一步

一直下一步,稍后将进入管理界面

选择 Database,将其设置为发布模式,禁用写入权限,在数据一栏中添加 key,名字为 value, 值为 https:// 项目名.firebaseio.com/auth.json ,如我的:
https://oneindex-chenyfan.firebaseio.com/auth.json

点击右上角的小齿轮 - 项目设置 - 服务账号 - 旧版凭据 - 数据库账号 - 显示密钥,复制密钥。

FireBase 教学完毕。

配置 CloudFlare

登录你的 CloudFlare,点击右上角,账户设置:

选择 API 令牌选项卡,生成新的 API:

选择自定义令牌:

配置至少如下,可以选择增加

点击获取 API 令牌

接着还要获取账户 ID 和区域 ID

进入任意一域名,右侧拦里头会有俩 ID,复制:

到这里,你获取了以下所有密钥:

  • Azure-refresh_token
  • Azure-client_id
  • Azure-client_secret
  • GoogleFireBase-firebase_url
  • GoogleFireBase-firebase_token
  • CloudFlare-APIToken
  • CloudFlare-ZoneID
  • CloudFlare-AccountID

八个 Token,切勿丢失 累死我了

配置 OneDrive

用微软账户登录 OneDrive,新建文件夹,名字为“Public”

本地 wrangler 部署

由于此篇教程具体将 GithubAction 实现无服务器部署,本块内容一笔带过,请直接看到 GithubAction 部署一块

本地安装依赖环境

yarn global add @cloudflare/wrangler
yarn install

用 wrangler 登录 CloudFlare

wrangler config

wrangler.toml 修改

name: The draft worker's name, your worker will be published at <name>.<worker_subdomain>.workers.dev.
account_id: Your Cloudflare Account ID.
zone_id: Your Cloudflare Zone ID.

src/config/default.js 修改:

client_id: Your client_id from above.
base: Your base path from above.
firebase_url: Your firebase_url from above.

添加环境变量:

wrangler secret put REFRESH_TOKEN
wrangler secret put CLIENT_SECRET
wrangler secret put FIREBASE_TOKEN

部署命令:

wrangler publish

GithubAction 部署

GithubAction 部署

进入你导入的仓库,点击 wrangler.toml

  • name ==> 默认生成为 <#name>.<#User>.workers.dev,随意
  • account_id ==> CloudFlare-AccountID
  • zone_id ==> CloudFlare-ZoneID

进入 /src/config/default.js

修改样式

src/render/htmlWrapper.js : 修改标题

src/folderView.js : 修改介绍

设置密钥

密钥名:CF_API_TOKEN

内容: ==> CloudFlare-APIToken

激活 Action:

设置 CloudFlare 变量

进入新创建的 Worker:

  • CLIENT_SECRET ==> Azure-client_secret
  • FIREBASE_TOKEN ==> GoogleFireBase-firebase_token
  • REFRESH_TOKEN ==> Azure-refresh_token

部署,发布,绑定域名【可选】:

成品:

Demo:https://onedrive.cyfan.top

后言

其实默认才 5GB,还不如 GoogleDrive 香,但是据说白嫖 E5 开发者还不错。

OK 就到这了,还不懂的欢迎评论区,或者去官方 github 地址发 issues。


 目录