使用特定颜色创建指向 Google 日历的 HTML 链接

Question

我想在用户点击我网站上的按钮时在他们的 Google 日历中创建一个 HTML 链接，并且我想在这样做时设置特定的事件颜色。

我已经在下面找到了这些答案，它们很棒并且描述了链接参数，但是它们都没有提到事件颜色参数。 有谁知道设置事件颜色的方法？

我试过参数： color 、 eventcolor 、 event_color 、 colorID ，但它们似乎都不起作用......

谢谢！

http://useroffline.blogspot.in/2009/06/making-google-calendar-link.html

第二个链接中的参数说明：

anchor address
http://www .google.com/calendar/event?
This is the base of the address before the parameters below.

action
action=TEMPLATE
A default required parameter.

src
Example: src=default%40gmail.com
Format: src=text
This is not covered by Google help but is an optional parameter in order to add an event to a shared calendar rather than a user's default.

text
Example: text=Garden%20Waste%20Collection
Format: text=text
This is a required parameter giving the event title.

dates
Example: dates=20090621T063000Z/20090621T080000Z (i.e. an event on 21 June 2009 from 7.30am to 9.0am British Summer Time (=GMT+1)).
Format: dates=YYYYMMDDToHHMMSSZ/YYYYMMDDToHHMMSSZ
This required parameter gives the start and end dates and times (in Greenwich Mean Time) for the event.

location
Example: location=Home
Format: location=text
The obvious location field.

trp
Example: trp=false
Format: trp=true/false
Show event as busy (true) or available (false)

sprop
Example: sprop=http%3A%2F%2Fwww.me.org
Example: sprop=name:Home%20Page
Format: sprop=website and/or sprop=name:website_name

Answer 1

我想我已经找到了使用 Google Calendar API 的方法。 不是找到参数名称的问题，也不是“那个”复杂的问题:)。

在这里你可以开始阅读整个故事： https : //developers.google.com/google-apps/calendar/quickstart/js

...或者只是获取底部的代码:)。 它几乎只是上面链接中的 Javascript quicstart 示例，但我已将实际用户的日历事件列表替换为我需要的内容：添加具有特定颜色的新事件。

但是，如果您还没有客户 ID，则您需要获得一个客户 ID。 上面的站点也描述了这个过程。

下面的片段就是它的全部内容。 在这里您可以看到 colorId 参数。 还要注意日期参数，它们适用于全天事件。 如果您需要日期和时间，请使用 dateTime 之一。 （更多关于这里： https : //developers.google.com/google-apps/calendar/create-events#add_an_event ）

  function listUpcomingEvents() {
    var event = {
      'summary': 'Test Event',
      'description': 'Let's go somewhere fun',
      'start': {
        'date': '2016-03-17'
      },
      'end': {
        'date': '2016-03-18'
      },
      'colorId': '5'
    };

    var request = gapi.client.calendar.events.insert({
      'calendarId': 'primary',
      'resource': event
    });

    request.execute(function(event) {
      appendPre('Event created: ' + event.htmlLink );
    });
  }

完整代码：

<html>
  <head>
    <script type="text/javascript">
      // Your Client ID can be retrieved from your project in the Google
      // Developer Console, https://console.developers.google.com
      var CLIENT_ID = '<CLIENT ID GOES HERE!!>';

      var SCOPES = ["https://www.googleapis.com/auth/calendar"];

      /**
       * Check if current user has authorized this application.
       */
      function checkAuth() {
        gapi.auth.authorize(
          {
            'client_id': CLIENT_ID,
            'scope': SCOPES.join(' '),
            'immediate': true
          }, handleAuthResult);
      }

      /**
       * Handle response from authorization server.
       *
       * @param {Object} authResult Authorization result.
       */
      function handleAuthResult(authResult) {
        var authorizeDiv = document.getElementById('authorize-div');
        if (authResult && !authResult.error) {
          // Hide auth UI, then load client library.
          authorizeDiv.style.display = 'none';
          loadCalendarApi();
        } else {
          // Show auth UI, allowing the user to initiate authorization by
          // clicking authorize button.
          authorizeDiv.style.display = 'inline';
        }
      }

      /**
       * Initiate auth flow in response to user clicking authorize button.
       *
       * @param {Event} event Button click event.
       */
      function handleAuthClick(event) {
        gapi.auth.authorize(
          {client_id: CLIENT_ID, scope: SCOPES, immediate: false},
          handleAuthResult);
        return false;
      }

      /**
       * Load Google Calendar client library. List upcoming events
       * once client library is loaded.
       */
      function loadCalendarApi() {
        gapi.client.load('calendar', 'v3', listUpcomingEvents);
      }

      /**
       * Print the summary and start datetime/date of the next ten events in
       * the authorized user's calendar. If no events are found an
       * appropriate message is printed.
       */
      function listUpcomingEvents() {
        var event = {
          'summary': 'Test Event',
          'description': 'Let's go somewhere fun',
          'start': {
            'date': '2016-03-17'
          },
          'end': {
            'date': '2016-03-18'
          },
          'colorId': '5'
        };

        var request = gapi.client.calendar.events.insert({
          'calendarId': 'primary',
          'resource': event
        });

        request.execute(function(event) {
          appendPre('Event created: ' + event.htmlLink );
        });
      }

      /**
       * Append a pre element to the body containing the given message
       * as its text node.
       *
       * @param {string} message Text to be placed in pre element.
       */
      function appendPre(message) {
        var pre = document.getElementById('output');
        var textContent = document.createTextNode(message + '\n');
        pre.appendChild(textContent);
      }

    </script>
    <script src="https://apis.google.com/js/client.js?onload=checkAuth">
    </script>
  </head>
  <body>
    <div id="authorize-div" style="display: none">
      <span>Authorize access to Google Calendar API</span>
      <!--Button for the user to click to initiate auth sequence -->
      <button id="authorize-button" onclick="handleAuthClick(event)">
        Authorize
      </button>
    </div>
    <pre id="output"></pre>
  </body>
</html>

使用特定颜色创建指向 Google 日历的 HTML 链接

问题描述

1 个解决方案

解决方案1
1 2016-03-18 06:54:10

使用特定颜色创建指向 Google 日历的 HTML 链接

问题描述

1 个解决方案

解决方案1 1 2016-03-18 06:54:10

解决方案1
1 2016-03-18 06:54:10