第一步：先期准备

快速开始

请确保你有以下所有账号

注册 OneDrive (微软) 账号

本小结请选择阅读

选择说明

使用OneDrive账号时一定要注意账号类型！

不同类型的OneDrive账号的区别(仅针对本目的)：

OneDrive账号类型 难易程度 安全性 免费容量
个人账号 简单 安全 5GB
临时教育账号 繁琐 不安全 1TB
教育账号(无法自行注册) 繁琐 安全 1TB

个人账号

OneDrive(微软)账号注册链接 https://signup.live.com/signup

临时教育账号

临时教育邮箱注册链接（一定要保留！！！） https://obagg.com

用户名越复杂越好
域类型请选择 @5tb.tech

教育OneDrive(微软)账号注册链接 https://www.microsoft.com/zh-cn/education/products/office

教育账号

教育OneDrive(微软)账号注册链接 https://www.microsoft.com/zh-cn/education/products/office

注册Github账号

GitHub账号注册链接 https://github.com/signup

注册Vercel账号

Vercel账号注册链接 https://vercel.com/signup

第二步：在 Vercel 中导入和部署

将 onedrive-vercel-index GitHub 项目导入 Vercel

1
https://github.com/spencerwooo/onedrive-vercel-index.git

然后点击部署。Vercel 将自动构建和部署您的项目。但是，部署可能会失败，因为您尚未添加环境变量，这就是我们接下来要做的。REDIS_URL
如图：
导入第三方储库1
导入第三方储库2
导入第三方储库3

第三步：创建 Redis 连接

创建一个 Redis 数据库，并将 Redis 实例的 URL 设置为 Vercel 项目内的环境变量。Redis 数据库用于存储所需的内容以及与 OneDrive 的 API 接口时。REDIS_URL access_tokens refresh_tokens

您可以使用 Upstash 来实现此目的，完全免费，与Vercel完全集成，这是我所演示的。
您还可以托管任何Redis服务器，使用AWS，Google Cloud，Azure等。只要你有一个Vercel可以使用的Redis URL。
无论你使用什么方法，在 Vercel 的环境变量中都应该有一个存在，它应该看起来像这样：REDIS_URL 

1
redis://:xxx...@some-thing-like-35533.upstash.io:35533

或：

1
rediss://:xxx...@some-thing-like-35533.upstash.io:35533

使用 Upstash 来创建 Redis 连接

官方文档

  1. 将集成添加到您的 Vercel 帐户
    访问 Vercel Upstash Integration 网页，然后单击按钮。选择要集成的范围和应用程序。
  2. 链接数据库
    Vercel将显示一个弹出窗口，您可以在其中注册Upstash。然后，如果没有数据库，则可以创建一个数据库。
    创建数据库
  3. 拥有数据库后，您将看到一个页面，您可以在其中将Upstash数据库映射到Vercel应用程序。选择数据库和项目后，单击New Integration 。
    链接数据库
  4. 现在点击，这样弹出窗口将关闭，您将返回到您的Vercel页面。
    新建项目
  5. 获取你的 Redis 链接
    获取 Redis 链接

第四步：配置网站

可选步骤：设置NEXT_PUBLIC_USER_PRINCIPLE_NAME

如果你使用的是临时教育账号，你必需额外执行此步骤

打开 Vercel 项目的 设置(Settings) 。选择 环境变量(Environment Variables)

Name 填 NEXT_PUBLIC_USER_PRINCIPLE_NAME VALUE 填 你的临时教育账号

单击 添加(Add)

可选步骤：自定义域名

https://vercel.com/docs/concepts/projects/custom-domains

修改配置

需要进行一些基本的配置修改。两个配置文件包括 config/site.config.js 和config/api.config.js 。前者用于自定义您的网站，后者用于配置API路由。

自定义网站设置

根据您的配置修改 config/site.config.js
您必须更改：

  • userPrincipalName

    用于在进行OAuth时验证您的身份。它通常是您登录 OneDrive 时的 Microsoft 电子邮件地址。
    注：如果你在之前的步骤中设置了NEXT_PUBLIC_USER_PRINCIPLE_NAME 那你可以将此处留空或设为你的常用邮箱，否则你必需将此设置为你的 OneDrive(微软)账号

  • baseDirectory

    使用 onedrive-vercel-index 共享的基本文件夹。你必须确保该文件夹存在于你的 OneDrive 中。（你还可以创建一个在 OneDrive 中命名的文件夹，以保持与主项目相同的内容。Public

还有其他可选配置可用于自定义站点，请参阅 自定义 配置以了解其功能。

可选步骤：修改 API 设置

如果你是 OneDrive 国际版用户（不是 OneDrive 商业版或教育版帐户，不是 SharePoint 用户，不是 Microsoft 365 E5 用户），你可以忽略此步骤并保持原样，否则，你必须执行此步骤

如果你使用的是 个人 Outlook(微软)账户

你需要修改 config/api.config.js

  • authApi 和 driveApi

    1
    2
    authApi: "https://login.partner.microsoftonline.cn/common/oauth2/v2.0/token",
    driveApi: "https://microsoftgraph.chinacloudapi.cn/v1.0/me/drive",

如果你使用的是 (临时)教育 Outlook(微软)账户

你不需要做任何改动

第五步：验证您的 onedrive-vercel-index

导航到 vercel 新部署的 onedrive-vercel 索引，如果尚未设置自定义域，通常是 https://xxx.vercel.app 。由于您尚未通过身份验证，您将被重定向到OAuth进程。

准备

检查有关已定义配置的任何不正确之处。特别是 和 （混淆），如果您使用 (临时)教育 Outlook(微软)账户 进行身份验证，则应该与主项目完全相同。还要检查 API 范围，只需要：client_id , client_secret

  • user.read：用于根据您用于OAuth的帐户检查您的电子邮件，以便某些人一遍又一遍地使用ta的帐户重新进行身份验证来“轰炸”你。
  • files.read.all：用于访问 OneDrive 中的文件。
  • offline_access： 离线访问
    如果一切似乎正确，请继续执行步骤 2。如果没有，则需要在 Vercel 上修改和重新部署config/api.config.js 。

获取身份验证代码

基于我们为您生成了OAuth链接。单击该链接，将打开一个新选项卡，并提示您登录到您的Microsoft帐户。确保使用您在 中定义的同一帐户登录。

如果您的帐户存在权限问题，则可能需要使用自己的帐户进行身份验证。这可能发生在 OneDrive 教育或业务用户身上。有关此内容的更多信息，请单击此处：使用自己的客户端 ID 和机密。

您将被定向到 ，将地址栏中的整个URL复制到下面的输入部分。onedrive-vercel-index 将从 URL 中提取 需要的信息。单击“获取令牌”以继续。

获取访问和刷新令牌

稍等片刻，因为令牌需要一点才能返回。如果一切顺利，您将收到以下消息：成功屏幕，其中包含一对有效令牌，供您存储在Redis数据库中。单击“存储令牌”以继续。

在这里，我们将验证您是否真的是您，因此，如果按钮显示“不要假装是网站所有者”，请更改 NEXT_PUBLIC_USER_PRINCIPLE_NAME 或 userPrincipalName

最后，您将被重定向到 onedrive-vercel-index。Enjoy it！

如果您被重定向回步骤1，并且您确定所有内容都已正确设置，请稍等片刻，然后尝试手动导航回家并进行硬刷新。令牌有时需要一段时间才能传播到 Redis。

参考资料

https://ovi.swo.moe/docs/getting-started
https://docs.upstash.com/redis/howto/vercelintegration