JavaScriptを用いて、あるサイト上から特定のGoogleカレンダー上の予定を確認、追加するプログラムを作ろうとして(予約システムのような感じです)
下記のようなソースを書いています。

取得は問題なくできていますが、予定追加がうまくできず、
どこをどのように修正したらよいかわからず困っております。
サンプルもなく、そもそもJavaScriptでできるのかすらわからないのですが・・・
同様の仕様を経験した方、わかる方がいらっしゃいましたらご教授願えませんでしょうか。

もしJSではできないのであれば、PHPでやってみようかと思っていますが…
PHPならできる、などあればご教授いただきたいです。

(function($) {
    $(function() {
        const API_KEY = [APIキー];
        const CALENDAR_ID = [カレンダーID];
        function start() {
            gapi.client.init({
                'apiKey': API_KEY,
            }).then(function() {
                return gapi.client.request({
                    'path': 'https://www.googleapis.com/calendar/v3/calendars/' + encodeURIComponent(CALENDAR_ID) + '/events'
                 })
            }).then(function(response) {
                let resultArea = document.getElementById('resultArea');
                let items = response.result.items;
                for(let i = 0; i < items.length; i++){
                resultArea.insertAdjacentHTML('beforeend', items[i].start.dateTime + '<br>');
                }
            }, function(reason) {
                console.log('Error: ' + reason.result.error.message);
            });
        };

        function addEvent() {
                        gapi.client.load('calendar', 'v3', function(){
                        var resource = {
                            'summary': $("#request_form .name").val(), // 予定のタイトル
                            'start': { // 開始日・時刻
                                'dateTime': $("#request_form .datetime_st").val();
                            },
                            'end': { // 終了日・時刻
                                'dateTime': $("#request_form .datetime_ed").val();
                            },
                            'location': 'Somewhere', // 場所
                            'description': $("#request_form .detail").val() // 説明
                        };
                        var request = gapi.client.calendar.events.insert({
                            'calendarId': CALENDAR_ID,
                            'resource': resource
                        });

                        console.log(resource);

                        request.execute(function(resp){
                        console.debug(resp);
                    });

                });
        };

        gapi.load('client', start);
        $("#request_form").on("submit", function(){
            addEvent();
        })
    });
})(jQuery);

実行するとコンソールに

cb=gapi.loaded_0:223
POST https://content.googleapis.com/calendar/v3/calendars/[カレンダーID]/events?alt=json&key=[APIキー] 401

と出ます。
request.executeができてないようです)


CCC: Channnana Creative【HP制作】

大阪でホームページ制作、コーディング、HP作成講座などの仕事をしている 「CCC:Channnana Creative」です! お仕事の依頼はDMにてお願いします。

コメント