连接到 OneDrive 文件选取器 v8 时出现问题

Question

我正在尝试将 OneDrive 文件选取器 v8 API 集成到 SPA 项目中，但在连接到选取器时不断出现错误，我无法破译。

我正在按照提供的 Javascript 基本消费者示例开始使用，但到目前为止我还没有运气，使用提供的 Azure 客户端 ID 和个人 Azure 客户端 ID 配置示例应用程序，如下面的代码块中所示我按照 Picker 文档进行设置仍然会导致与上图相同的问题。

// 'javascript-basic-consumer/scripts/auth.js'
const msalParams = {
    auth: {
        authority: "https://login.microsoftonline.com/consumers",
        clientId: {"2ab80a1e-7300-4cb1-beac-c38c730e8b7f" or "my-client-id"},
        redirectUri: "http://localhost:3000"
    },
}

滚动浏览选择器的开发控制台，我看到以下错误：

plt.odsp-common.js:1 GraphError: ObjectHandle is Invalid
    at t.a (res-1.cdn.office.net/files/odsp-web-prod_2023-10-27.002/odcfilepickerwebpack.manifest/plt.odsp-common.js:1:286129)
    at t [as constructor] (res-1.cdn.office.net/files/odsp-web-prod_2023-10-27.002/odcfilepickerwebpack.manifest/plt.odsp-common.js:1:24023)
    at new t (res-1.cdn.office.net/files/odsp-web-prod_2023-10-27.002/odcfilepickerwebpack.manifest/plt.odsp-common.js:1:62054)
    at res-1.cdn.office.net/files/odsp-web-prod_2023-10-27.002/odcfilepickerwebpack.manifest/plt.odsp-common.js:1:249215
    at e.then (res-1.cdn.office.net/files/odsp-web-prod_2023-10-27.002/odcfilepickerwebpack.manifest/plt.odsp-common.js:1:90280)
    at res-1.cdn.office.net/files/odsp-web-prod_2023-10-27.002/odcfilepickerwebpack.manifest/plt.odsp-common.js:1:248860
    at Object.A [as _notify] (res-1.cdn.office.net/files/odsp-web-prod_2023-10-27.002/odcfilepickerwebpack.manifest/plt.odsp-common.js:1:86424)
    at Object.enter (res-1.cdn.office.net/files/odsp-web-prod_2023-10-27.002/odcfilepickerwebpack.manifest/plt.odsp-common.js:1:88881)
    at e._run (res-1.cdn.office.net/files/odsp-web-prod_2023-10-27.002/odcfilepickerwebpack.manifest/plt.odsp-common.js:1:94087)
    at e._error (res-1.cdn.office.net/files/odsp-web-prod_2023-10-27.002/odcfilepickerwebpack.manifest/plt.odsp-common.js:1:93595)

并且我看到选择器正在对

unauth

路线（如

https://api.onedrive.com/v1.0/drives/unauth/items/root?{queryParams}

）进行 API 调用，即使

Authorization

标头已正确提供。

最奇怪的部分是，我知道提供的示例代码可以正常工作，因为我之前已经设法让它工作，这个问题最近才在我重新访问代码时出现。

如果对 OneDrive 文件选择器工作原理有更多了解的人能够提供一些有关我的问题的见解，我将不胜感激。

Answer 1

我一直面临着和你完全相同的问题，并且我已经做了很多尝试来解决它。

切入主题，问题似乎在于传递给选择器的 cid 值无效。

打开选取器时，尝试在参数中包含 cid: 'C567A3379CB6E38C'。

像这样

const queryString = new URLSearchParams({
  filePicker: JSON.stringify(params),
  cid: 'C567A3379CB6E38C',
});
const url = `${baseUrl}?${queryString}`;

请记住，该值在您的情况下可能无效，所以让我解释一下我是如何获得它的。

我通过从示例中构建 URL 来直接将此 cid 值输入到浏览器中。

https://onedrive.live.com/picker?filePicker=%7B%22sdk%22%3A%228.0%22%2C%22entry%22%3A%7B%22oneDrive%22%3A%7B%22files%22%3A%7B%7D%7D%7D%2C%22authentication%22%3A%7B%7D%2C%22messaging%22%3A%7B%22origin%22%3A%22http%3A%2F%2Flocalhost%3A3000%22%2C%22channelId%22%3A%2227%22%7D%2C%22typesAndSources%22%3A%7B%22mode%22%3A%22files%22%2C%22pivots%22%3A%7B%22oneDrive%22%3Atrue%2C%22recent%22%3Atrue%7D%7D%7D

我可以获得 cid 值。

https://onedrive.live.com/picker?filePicker=%7B%22sdk%22%3A%228%2E0%22%2C%22entry%22%3A%7B%22oneDrive%22%3A%7B%22files%22%3A%7B%7D%7D%7D%2C%22authentication%22%3A%7B%7D%2C%22messaging%22%3A%7B%22origin%22%3A%22http%3A%2F%2Flocalhost%3A3000%22%2C%22channelId%22%3A%2227%22%7D%2C%22typesAndSources%22%3A%7B%22mode%22%3A%22files%22%2C%22pivots%22%3A%7B%22oneDrive%22%3Atrue%2C%22recent%22%3Atrue%7D%7D%7D&v=2&id=root&cid=C567A3379CB6E38C

另一方面，当 URL 提交到示例中的表单时，弹出 URL 中的 cid 值为“0000000000UNAUTH”。

https://onedrive.live.com/picker?filePicker=%7B%22sdk%22%3A%228%2E0%22%2C%22entry%22%3A%7B%22oneDrive%22%3A%7B%22files%22%3A%7B%7D%7D%7D%2C%22authentication%22%3A%7B%7D%2C%22messaging%22%3A%7B%22origin%22%3A%22http%3A%2F%2Flocalhost%3A3000%22%2C%22channelId%22%3A%2227%22%7D%2C%22typesAndSources%22%3A%7B%22mode%22%3A%22files%22%2C%22pivots%22%3A%7B%22oneDrive%22%3Atrue%2C%22recent%22%3Atrue%7D%7D%7D&v=2&id=root&cid=0000000000UNAUTH

如您所知，原本这个值是不需要开发者设置的。看来 v8 SDK 端可能有问题。

我还不确定 cid 值的含义。它可能是需要从特定API获取的值，也可能是在一定时间后过期的值。

如果我了解更多，我会再次评论。