GoogleSpreadSheetでWebサイトのチェックをできるようにしてとお願いしました【ChatGPT】

ChatGPT-4を使ってGoogle SpreadSheetとGoogle Apps Script (GAS)を利用して、Webページのチェックを行う業務改善を実現できます。以下に解説とGASのサンプルコードを提供します。

解説
GASのサンプルコード
Google SpreadSheetの設定
スクリプトの実行
まとめ

解説

Google Apps Script (GAS)は、Google SpreadSheetと連携してWebページのチェックを行うためのプログラムを作成できます。サンプルコードでは、指定されたURLのTitleやMeta情報を取得して、Google SpreadSheetに出力する機能を提供します。

GASのサンプルコード

まず、新しいGoogle SpreadSheetを作成し、スクリプトエディタを開いてください。

Google SpreadSheetを開く
“拡張機能” メニューから “Apps Script” を選択

以下のコードをコピーし、コード.gsファイルに貼り付けてください。

function checkWebPages() {
  const sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  const urls = sheet.getRange("A2:A").getValues().filter(url => url[0]);

  const limit = 50;
  const startRow = parseInt(PropertiesService.getScriptProperties().getProperty("startRow") || "2");

  for (let i = startRow - 2; i < Math.min(urls.length, startRow - 2 + limit); i++) {
    const url = urls[i][0];
    const response = UrlFetchApp.fetch(url, { muteHttpExceptions: true });
    const contentText = response.getContentText() || '';  // Add an empty string as a fallback
    const parsedData = parseHtmlData(contentText);
    
    for (const [key, value] of Object.entries(parsedData)) {
      sheet.getRange(i + 2, getColumnIndex(key)).setValue(value);
    }
  }

  if (startRow - 2 + limit < urls.length) {
    PropertiesService.getScriptProperties().setProperty("startRow", startRow + limit);
    Utilities.sleep(5000);
    checkWebPages();
  } else {
    PropertiesService.getScriptProperties().deleteProperty("startRow");
  }
}

function getColumnIndex(columnName) {
  const columnNames = ['URL', 'Title', 'Keywords', 'Description', 'H1', 'Lang', 'Charset', 'Telephone', 'Viewport', 'og:title', 'og:description', 'og:type', 'og:url', 'og:image', 'og:site_name', 'fb:app_id', 'fb:pages', 'twitter:card', 'twitter:site', 'twitter:description', 'twitter:image'];
  return columnNames.indexOf(columnName) + 1;
}

function parseHtmlData(html) {
  const metadata = {};

  const titleMatch = html.match(/<title>(.*?)<\/title>/i);
  metadata['Title'] = titleMatch ? titleMatch[1] : '';

  const getMetaContent = (name) => {
    const regex = new RegExp(`<meta\\s+(?:name|property)="${name}"\\s+content="(.*?)"`, 'i');
    const match = html.match(regex);
    return match ? match[1] : '';
  };

  metadata['Keywords'] = getMetaContent('keywords');
  metadata['Description'] = getMetaContent('description');
  metadata['Charset'] = getMetaContent('charset');
  metadata['Telephone'] = getMetaContent('format-detection');
  metadata['Viewport'] = getMetaContent('viewport');

  const h1Match = html.match(/<h1[^>]*>(.*?)<\/h1>/i);
  metadata['H1'] = h1Match ? h1Match[1] : '';

  const langMatch = html.match(/<html[^>]+lang="([^"]+)"/i);
  metadata['Lang'] = langMatch ? langMatch[1] : '';

  const ogPrefix = 'og:';
  const fbPrefix = 'fb:';
  const twitterPrefix = 'twitter:';

  const metaTags = ['og:title', 'og:description', 'og:type', 'og:url', 'og:image', 'og:site_name',
                   'fb:app_id', 'fb:pages', 'twitter:card', 'twitter:site', 'twitter:description', 'twitter:image'];

  metaTags.forEach(tag => {
    metadata[tag] = getMetaContent(tag);
  });

  return metadata;
}

次に、スクリプトエディタの画面上部にあるディスクアイコンをクリックして、スクリプトを保存します。

Google SpreadSheetの設定

Google SpreadSheetの”Sheet1″に以下のヘッダーを追加してください。

A列1行目に “URL” と入力
A列2行目以降にチェックしたいURLを記述
B列1行目から横列に以下を記入していく。
タイトルキーワードディスクリプション H1 lang属性文字コード telephone viewport og:title og:description og:type og:url og:image og:site_name fb:app_id fb:pages twitter:card twitter:site twitter:description twitter:image

A列にチェックしたいWebページのURLを入力することでまとめてチェックをすることが可能です。