在 React-app 前端使用 Google 日历

Question

我知道这个问题与现有代码并不完全相关，但我希望能够在我的 React 项目中集成 Google Calendar API。 我想知道是否可以在没有后端的情况下直接在 React 应用程序中集成这个谷歌日历？ 例如，我希望能够让人们有机会从网站预订会议。 当他们预订会议时，我希望能够在我的 Google 帐户日历中看到它。 这是可能的还是他们必须使用他们的帐户登录并在我的日历中预订或它是如何工作的？ 我找到了关于这个的谷歌文档：

https://developers.google.com/calendar/quickstart/js

但我不确定我想要的是否可能。 我还注册了我的 API 密钥并获得了我的客户 ID：

const CALENDAR_ID ="XXXXXXXXXXXXXXXX.apps.googleusercontent.com";
const API_KEY = "XXXXXXXXXXXXXXXXX";
let url = `https://www.googleapis.com/calendar/v3/calendars/${CALENDAR_ID}/events?key=${API_KEY}`;

但是当我尝试在 POSTMAN 中执行调用时，我得到：

{
    "error": {
        "code": 401,
        "message": "Request is missing required authentication credential. Expected OAuth 2 access token, login cookie or other valid authentication credential. See https://developers.google.com/identity/sign-in/web/devconsole-project.",
        "errors": [
            {
                "message": "Login Required.",
                "domain": "global",
                "reason": "required",
                "location": "Authorization",
                "locationType": "header"
            }
        ],
        "status": "UNAUTHENTICATED"
    }
}

所以也许我做错了。 所以有人做过这样的事情并且可以帮助我吗？ 我真的很感激，谢谢！

Answer 1

您的 API 密钥或客户端 ID 将允许您的应用程序征求用户同意以获取访问令牌并能够使用请求的 API。 在您的情况下，由于您想将人员（受邀者）添加到您的日历中，因此应该征求您的同意。

您可以看到，允许您的应用程序代表您向日历 API 发出请求的唯一方法是让应用程序访问您的访问或刷新令牌，这在前端是不安全的。