Googleサイトに表示される「アクセス権が必要です」が解決できない件について

実現したいこと

スプレッドシートの情報を抽出しサイト上に表示させることを実現させたく取り組んでいます。
まず始めにGoogle Apps Script(GAS)とGoogleサイトの連携が出来るかを検証する為、
下記のgsとhtmlをGAS上に作成しデプロイしました。

code.gs
1function doGet() {
2  return HtmlService.createHtmlOutput('Hello World');
3}

index.html
1<!DOCTYPE html>
2<html>
3  <head>
4    <base target="_top">
5  </head>
6  <body>
7    <h1>Test</h1>
8    <div id="messageContainer"></div>
9    <script>
10      window.addEventListener('load', () => {
11        google.script.run.withSuccessHandler((output) => {
12          document.getElementById('messageContainer').innerHTML = output;
13        }).doGet();
14      });
15    </script>
16  </body>
17</html>

デプロイ条件

次のユーサーとして実行：ウェブアプリケーションにアクセスしているユーザー
アクセスできるユーザー：Googleアカウントを持つ全員

デプロイ時に生成されたライブラリのURLをサイト上へ埋め込んだところ「Hello World」が表示されました。

つづいてGoogleサイトとGoogleスプレッドシートを連携するを参考に下記のgsとhtmlをGAS上に作成しデプロイしました。

code.gs
1const id = 'スプレッドシートのID'
2const name = '該当のシート名'
3
4function getData() {
5  var sheet = SpreadsheetApp.openById(id).getSheetByName(name);
6  var rows = sheet.getDataRange().getValues();
7  var keys = rows.splice(0, 1)[0];
8  return rows.map(function(row) {
9    var obj = {}
10    row.map(function(item, index) {
11      obj[keys[index]] = item;
12    });
13    return obj;
14  });
15}
16
17function doGet(request) {
18  var data = getData();
19  return ContentService.createTextOutput(JSON.stringify(data, null, 2))
20  .setMimeType(ContentService.MimeType.JAVASCRIPT);
21}

index.html
1<!DOCTYPE html>
2<html>
3  <head>
4    <base target="_top">
5    <?!=HtmlService.createHtmlOutputFromFile('styles.html').getContent();?>
6  </head>
7  <body>
8    <h1>SpreadsheetData</h1>
9    <pre id="data-container"></pre>
10    <script>
11      google.script.run.withSuccessHandler(displayData).doGet();
12
13      function displayData(data) {
14        const dataContainer = document.getElementById('data-container');
15        const jsonString = JSON.stringify(data, null, 2);
16        dataContainer.textContent = jsonString;
17      }
18    </script>
19  </body>
20</html>

デプロイ条件

次のユーサーとして実行：ウェブアプリケーションにアクセスしているユーザー
アクセスできるユーザー：Googleアカウントを持つ全員

スプレッドシートの公開条件

アクセスできるユーザー：自分
一般的なアクセス：リンクを知っている全員(閲覧者)

スプレッドシートの内容

発生している問題・分からないこと

デプロイ時に生成されたライブラリのURLをサイト上へ埋め込んだところ「Googleドライブ　アクセス権が必要です」が表示されました。

上記画像の左上にある「新しいタブで開く」をクリックするとGASが実行されJSON形式でスプレッドシートの値が表示されます。

エラーメッセージ

error
1Googleドライブ　アクセス権が必要です
2ドキュメントを直接開いてアクセス権のリクエストが可能かどうかを確認するか、アクセス権のあるアカウントに切り替えてください。詳細
3ログイン名

該当のソースコード

```code.gs
const id = 'スプレッドシートのID'
const name = '該当のシート名'


function getData() {
  var sheet = SpreadsheetApp.openById(id).getSheetByName(name);
  var rows = sheet.getDataRange().getValues();
  var keys = rows.splice(0, 1)[0];
  return rows.map(function(row) {
    var obj = {}
    row.map(function(item, index) {
      obj[keys[index]] = item;
    });
    return obj;
  });
}

function doGet(request) {
  var data = getData();
  return ContentService.createTextOutput(JSON.stringify(data, null, 2))
  .setMimeType(ContentService.MimeType.JAVASCRIPT);
}

index.html
1<!DOCTYPE html>
2<html>
3  <head>
4    <base target="_top">
5    <?!=HtmlService.createHtmlOutputFromFile('styles.html').getContent();?>
6  </head>
7  <body>
8    <h1>SpreadsheetData</h1>
9    <pre id="data-container"></pre>
10    <script>
11      google.script.run.withSuccessHandler(displayData).doGet();
12
13      function displayData(data) {
14        const dataContainer = document.getElementById('data-container');
15        const jsonString = JSON.stringify(data, null, 2);
16        dataContainer.textContent = jsonString;
17      }
18    </script>
19  </body>
20</html>

試したこと・調べたこと

teratailやGoogle等で検索した
ソースコードを自分なりに変更した
知人に聞いた
その他

上記の詳細・結果

GASの設定にてサービスを追加からDrive APIを追加しましたが結果は変わりませんでした。
「ドキュメントを直接開いて」をクリックすると

That’s an error.

The server cannot process the request because it is malformed. It should not be retried. That’s all we know.
のエラーとなりました。

ログイン名:のところにあるアイコンをクリックすると

drive.google.com で接続が拒否されました。
のエラーとなりました。

なぜこのように非ログイン状態になってしまうのかと、こちらの解決方法を教えていただきたいです。
よろしくお願いいたします。

補足

GoogleサイトとGoogleスプレッドシートを連携するの通りにコーディングしChrome上で確認したところCORSのエラーにより表示させることが出来ず、Claude等に確認したところGAS上でgsとhtmlを作成することを勧められ、Hello Worldの表示までは実現できました。

winterboum

2024/04/06 23:42

Google Apps Script(GAS) のことはわかりませんが、この表示はシートにアクセスしたユーザがシートへのアクセス権がない、ということです。 Google Apps Script(GAS) の実行者がシートのアクセス権を持っているかまず確認してください。

Gaston23

2024/04/07 00:53

ご回答いただきありがとうございます。 GASのアクセス権は以下の通りです。次のユーサーとして実行：ウェブアプリケーションにアクセスしているユーザーアクセスできるユーザー：Googleアカウントを持つ全員スプレッドシートの公開条件は以下の通りです。アクセスできるユーザー：自分一般的なアクセス：リンクを知っている全員(閲覧者) 実際にデプロイしたURLをクリックしGASが実行されると値が表示されるのですが、その値がSite上では表示されず困っております。