使用dart中的googleapis库更新日历并将其显示在网页上 [英] using the googleapis library in dart to update a calendar and display it on a webpage

问题描述

我是dart的新手，我一直在尝试弄清楚如何使用 googleapis 库更新日历事件，然后在网页上显示日历

I am new to dart and I have been trying to figure out how to use the googleapis library to update a calendars events, then display the calendar/events on a webpage.

到目前为止，我一直希望可以将 #text id的文本更改为列表中的这段代码所选日历ID中的事件：

So far I have this code that I was hoping would just change the #text id's text to a list of events from the selected calendars ID:

import 'dart:html';
import 'package:googleapis/calendar/v3.dart';
import 'package:googleapis_auth/auth_io.dart';

final _credentials = new ServiceAccountCredentials.fromJson(r'''
{
  "private_key_id": "myprivatekeyid",
  "private_key": "myprivatekey",
  "client_email": "myclientemail",
  "client_id": "myclientid",
  "type": "service_account"
}
''');

const _SCOPES = const [CalendarApi.CalendarScope];

void main() {
  clientViaServiceAccount(_credentials, _SCOPES).then((http_client) {
    var calendar = new CalendarApi(http_client);

    String adminPanelCalendarId = 'mycalendarID';

    var event = calendar.events;

    var events = event.list(adminPanelCalendarId);

    events.then((showEvents) {
      querySelector("#text2").text = showEvents.toString();
    });

  });
}

但是网页上没有任何显示。我想我误会了如何在dart中使用客户端和服务器端代码...是否将文件分解为多个文件？我该如何使用dart更新日历并将其显示在网页上？

But nothing displays on the webpage. I think I am misunderstanding how to use client-side and server-side code in dart... Do I break up the file into multiple files? How would I go about updating a calendar and displaying it on a web page with dart?

我对浏览器包，但这是我第一次用服务器端库编写任何内容（ googleapis 使用 dart：io 所以我认为它是服务器端的代码？我无法在dartium中运行代码。

I'm familiar with the browser package, but this is the first time I have written anything with server-side libraries(googleapis uses dart:io so I assume it's server-side? I cannot run the code in dartium).

如果有人可以指出正确的方向，或提供示例，

If anybody could point me in the right direction, or provide an example as to how this could be accomplished, I would really appreciate it!

推荐答案

使用以下代码，您可以显示与日历相关的事件，使用登录的帐户。在此示例中，我使用了 createImplicitBrowserFlow （请参见 https：//pub.dartlang上的文档.org / packages / googleapis_auth ）和来自Google Cloud Console项目的ID和密钥。

Using the following code you can display the events of a calendar associated with the logged account. In this example i used createImplicitBrowserFlow ( see the documentation at https://pub.dartlang.org/packages/googleapis_auth ) with id and key from Google Cloud Console Project.

import 'dart:html';
import 'package:googleapis/calendar/v3.dart';
import 'package:googleapis_auth/auth_browser.dart' as auth;

var id = new auth.ClientId("<yourID>", "<yourKey>");
var scopes = [CalendarApi.CalendarScope];

  void main() {

  auth.createImplicitBrowserFlow(id, scopes).then((auth.BrowserOAuth2Flow flow) {
        flow.clientViaUserConsent().then((auth.AuthClient client) {

          var calendar = new CalendarApi(client);

              String adminPanelCalendarId = 'primary';

              var event = calendar.events;

              var events = event.list(adminPanelCalendarId);

              events.then((showEvents) {
                showEvents.items.forEach((Event ev) { print(ev.summary); });
                querySelector("#text2").text = showEvents.toString();
              });      


          client.close();
          flow.close();
        });
      });

}

这篇关于使用dart中的googleapis库更新日历并将其显示在网页上的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！