見出し画像

つかえる自動化/効率化「短縮URLの自動生成とカウント」 - プログラム解説編

【つかえる自動化/効率化「短縮URLの自動生成とカウント」 - どこから、どれだけ来たか知りたい!】

⬇️ 内容の詳細はこちら ⬇️

上記の note では、イベントやキャンペーン、各種SNS からの集客などで「どこから、どれだけの人が来ているのか把握したい」、短縮URL を使ってその要望を叶える、というものでした。

「プログラム解説編」では、実際にどのように実現しているか、プログラムの解説を行っていきたいと思います。

  • プログラミングしてみたい

  • 少しだけ改良してもっと使いやすくしてみたい

  • スキルアップしたい

  • プログラミングを学んで活躍の場を増やしたい

などなど、考えているあなたのための一助となるよう頑張ってみます😁



スプレッドシートからデータの読み取り

// 開いているスプレッドシート
const ss = SpreadsheetApp.getActiveSpreadsheet();
// name を指定
const sheet = ss.getSheetByName(name);
// 左上(A:1)~最終段までのすべてのエリアを指定
const range = sheet.getRange(1,1,sheet.getLastRow(),sheet.getLastColumn());
// データを取得
const data = range.getValues();
  1. スプレッドシートを開く

  2. 指定したシートを開く

  3. シート内のエリアを指定する

  4. 指定したエリアのデータを取得する

という手順でデータを取得します。
今回は、あとで処理をするため、シート内のすべてのデータを取得しています。

※必要なエリアだけの情報を取得したい場合は、getRange()関数の引数を変えて下さい。

⬇️ 以下は使用しているクラス ⬇️

API を介しての外部サービスへの接続

// リクエストデータ
let options =
{
  "method" : method,
  "muteHttpExceptions" : true,
  "headers" : {
    "Authorization": "Bearer "+PERSONAL_TOKEN,
    "Content-Type" : "application/json"
  },
  "payload" : JSON.stringify(formdata)
};

// リクエストを発行して結果を取得
const response = UrlFetchApp.fetch(url,options);

API を介して外部サービスに接続するには、UrlFetchAppクラスの fetch()関数を使用します。

ここでは、UrlFetchApp.fetch()関数についての詳しい説明は割愛しますが、
「指定したURL に対してリクエストを発行し、その結果を得る手段」と覚えておけば良いと思います。

今回は、指定したURL (=Bitly のサイト) に対してリクエストを発行し、その結果 (=短縮URLの生成結果やクリック数) を得ます。

その際、本人かどうかを確認する (=どのアカウントで生成するか、どのアカウントのクリック情報を取得するか) ためにアクセストークンを使用します。

options の Authorization がアクセストークンを指定している箇所です。

外部サービスにアクセスする場合は必ず使用する関数ですので、覚えておきましょう。

⬇️ 以下は使用しているクラス ⬇️

短縮URL の生成

// リクエストデータ
let options =
{
  "method" : "post",
  "muteHttpExceptions" : true,
  "headers" : {
    "Authorization": "Bearer "+PERSONAL_TOKEN,
    "Content-Type" : "application/json"
  },
  "payload" : JSON.stringify({
    "long_url": "ベースURL"+id,
    "title": "管理名"}')
};

// リクエストを発行して結果を取得
const response = UrlFetchApp.fetch("https://api-ssl.bitly.com/v4/bitlinks/",options);

短縮URL を生成するには、「短縮URL生成用リクエスト」を発行します。

Bitly の APIリファレンスには、

・リクエストURL:https://api-ssl.bitly.com/
・短縮URL生成コマンド:v4/bitlinks
・リクエスト方法:POST

と記載されていますので、この方法でアクセスします。

⬇️ Bitly の API リファレンスはこちら ⬇️

リクエストURL の後ろに短縮URL生成コマンドを足したものが "短縮URL生成コマンド用のURL" になりますので、以下が実際のリクエストURL になります。

https://api-ssl.bitly.com/v4/bitlinks/

この URL に対して、POSTメソッドでアクセスしなければなりません。
そのため、method パラメータを "POST" としています。

また、短縮URL生成コマンドでは、以下のパラメータが必須となっています。

long_url : string

これは、短縮したいURL です。
当たり前ですね💦
これがないと始まりませんから。

また、Bitly の仕様として、同じアドレスに対して短縮URL を作成しようとすると「もうあるよ~👍」といって、結果を返してきます。
※つまり、短縮URL を作成してくれません。

それでは、同じ URL にリンクさせたいけど複数作れない!ということになってしまいます。

そのため、id を付与してアドレスを別のものと認識させるようにしています。

https://sample.com/?id=xxxxxxxx

アドレスを一意のもの (重なるものがない) にしないといけないので、id として付与する xxxxxxx の部分は、作成日時の Unix Timestamp を使用しました。

Unix Timestamp とは、「1970年1月1日 00:00:00 からの経過秒数」のことを指します。
ここでは、Unix Timestamp でも高精度なミリ秒オーダーのものを使用して、必ずかぶることが無いようにしています。

ここで、"勝手に id とか付けていいの?" という疑問が出るかもしれませんね。

通常 ? 以降の id=xxx に相当するところは、sample.com にパラメータとして値を渡すために使用する GETパラメータと呼ばれるものです。
使用していなければ無視するパラメータですので、特に問題はありませんが、もし id を使用している場合は、何かしらのエラーがでる恐れがあります。
その場合は、id を異なる文字列 (例えば、sampleid) に変更してください。

また、ソースを見るとわかると思いますが、long_url のほかにもう1つ title というパラメータを付けています。

title : 管理名

これは通常不要 (APIリファレンスではオプション扱い) なのですが、title を付けずに生成すると、アドレスがそのままタイトルとして設定されてしまい Bitly の管理画面上では「分かんねぇ~💢」ってことになってしまうために title をつけて生成しています。

この title はスプレッドシートでご自身で入力した管理名を入れるようにしていますので、管理名=Bitly 上でのタイトル となり分かりやすくなります。

この方がユーザーフレンドリーですからね☝️
ちょっとした優しさです✨

id を付与して、別のリンクとして生成させた例
title を設定して、分かりやすくタイトルを設定した例です。
⬇️

Bitly の管理画面

クリックデータの取得

サマリーデータ

// リクエストデータ
let options =
{
  "method" : "get",
  "muteHttpExceptions" : true,
  "headers" : {
    "Authorization": "Bearer "+PERSONAL_TOKEN,
    "Content-Type" : "application/json"
  },
};

// リクエストを発行して結果を取得
const response = UrlFetchApp.fetch("https://api-ssl.bitly.com/v4/bitlinks/短縮URL/clicks/summary/?units=day&unit=-1",options);

指定の短縮URL の総クリック数を取得するには、「クリックサマリー取得用リクエスト」を発行します。

Bitly の APIリファレンスには、

・リクエストURL:https://api-ssl.bitly.com/
・短縮URL生成コマンド:v4/bitlinks/短縮URL/clicks/summary
・リクエスト方法:GET

と記載されていますので、この方法でアクセスします。

短縮URL 生成時と同様にアクセスすることになりますので、

https://api-ssl.bitly.com/v4/bitlinks/短縮URL/clicks/summary
※短縮URL は生成時の短縮URL を入れる

この URL に対して、GETメソッドでアクセスしなければなりません。
そのため、method パラメータを "GET" としています。

サマリーとして取得した結果は "クリック回数" に記載しています。
⬇️

取得結果

30日間の日次データ

// リクエストデータ
let options =
{
  "method" : "get",
  "muteHttpExceptions" : true,
  "headers" : {
    "Authorization": "Bearer "+PERSONAL_TOKEN,
    "Content-Type" : "application/json"
  },
};

// リクエストを発行して結果を取得
const response = UrlFetchApp.fetch("https://api-ssl.bitly.com/v4/bitlinks/短縮URL/clicks/?units=day&unit=-1",options);

指定の短縮URL の日次クリック数を取得するには、「クリック数取得用リクエスト」を発行します。

Bitly の APIリファレンスには、

・リクエストURL:https://api-ssl.bitly.com/
・短縮URL生成コマンド:v4/bitlinks/短縮URL/clicks/
・リクエスト方法:GET

と記載されていますので、この方法でアクセスします。

短縮URL 生成時と同様にアクセスすることになりますので、

https://api-ssl.bitly.com/v4/bitlinks/短縮URL/clicks/
※短縮URL は生成時の短縮URL を入れる

この URL に対して、GETメソッドでアクセスしなければなりません。
そのため、method パラメータを "GET" としています。

今回は、日次データを取得したいため、units=day と設定していますが、時間単位・週単位など単位を変更することができますので、必要に応じて units の箇所を変更してください。

日次データとして取得した結果は "日付データ" に記載しています。
日付データのヘッダ (紫色の背景) の箇所の日付情報は、取得した内容によって変化しますので、ご注意ください。
⬇️

日付データ

メニューの作成

// UIオブジェクトの取得
const ui = SpreadsheetApp.getUi();
// メニューの作成
let menu = ui.createMenu(list["menuName"]);
// アイテムの追加
menu = menu.addItem("短縮URL生成","createBitlink");
menu = menu.addSeparator();
menu = menu.addItem("クリックデータ取得","getClickData");
// UIオブジェクトにメニューを設定
menu.addToUi();

様々な機能を GAS で追加していますので、それらを使用するために独自メニューを追加しています。

sidebar()関数と併せてよく使う機能ですので、覚えておきましょう。

⬇️ 以下は使用しているクラス ⬇️


サポート窓口

プログラミングのこと、実現方法(仕様や実装)のこと、あなたの実現したいこと、など困ったことがあれば、LINE公式アカウントにて質問してください。

サポートさせて頂きます。

⬇️LINE公式アカウントに登録してご連絡ください⬇️


IT や マーケティング でお悩みの方は
ぜひこの機会に LINE に登録して
【無料】個別相談 にお申込みください✨

もし「サポートしたい!」という方がいらっしゃいましたら、ぜひぜひサポートをお願いいたします! 開発費や外注費などクリエイター活動の一部として使用させて頂きます✨