さて、約2ヶ月ぶりの更新になります。ご無沙汰しています。
本業が忙しかったり、知り合いの開発支援で時間が取れなかったり、SOC2の取得に向けて動き出す必要があったり、様々な要因がありますが、2ヶ月もブログ更新を空けたことなかったので、逆に新鮮でもあり、ネタは溜まるものの消化できずでモヤモヤだったりw
これからは、年初の目標に戻って頑張って週1回は更新していきたいと、思ったり思わなかったり汗
あまりがっつり意気込んでってわけではないですが、もう少しは更新頻度を戻していきたいなと思います。
さて、今回はGASでスクレイピングをする場合によく質問されるログイン関係の処理についての解説です。
ログイン認証：ブラウザの役割及び通信の流れ（基本）
まずは、おさらいがてら（と言っても、過去一度もこのブログでログインの話をしたことはありませんが。。）、ざっくりとログイン処理の流れを把握しなおしてみましょう。シンプルなユーザID・パスワードをformでPOSTすることを前提としたイメージです。FIDOだとか2FAによるチェックとか、そういうちゃんとしたログインセキュリティの確保する話でないことはあしからず。
実はHTMLの解析だとかcookieの保存だとか結構いろんな部分をブラウザ他に依拠しながら我々はウェブサービスやwebページなどを閲覧・利用しています。
これが、GASやpythonなどでスクレイピングする際に、留意しなければならない点の１つです。
ブラウザを使わない（pythonでseleniumを利用する場合は別ですが）ため、ブラウザ等がはたしてくれていた役割もスクリプトの中で自分で実装していく必要があります。
GASでのログイン処理
ログイン処理の流れをみたところで、実際にGASで同様のことを実行してみましょう。
でも、その前に一つPOSTするためのURIを識別するための方法を紹介してから、GASのスクリプトを紹介していきます。
事前準備~form postするスクリプトを探す方法〜
ログイン認証の流れの部分で、説明したようにサーバ側にログイン処理をリクエストするためのコードが基本的にログインフォーム内には存在します。そして、そのコードを探し出して、そこにfetchでPOSTしに行く必要があります。
そこで、まずはそのPOSTするためのコードを探し出す方法を紹介します。
今回利用するDELTA TracerというAmazon商品の相場をASINやJANコードで検索するツールの場合、以下のlogin_exec/が対象となります。
そこのForm Dataの要素をfetchでPOSTしていくことになります。
このサイト以外でも、基本的にはFormでPOSTする流れは変わらないので、このやり方自体は覚えておいていいと思います。
コード概要
function main() {
//ログイン処理
const Logoin_url = "https://delta-tracer.com/auth/login_exec/"
let login_payload = {
"r":"",
"login-email":"e-mail_adress",
"login-password":"password",
}
let post_options = {
method: "post",
payload: login_payload,
followRedirects: false
};
var response = UrlFetchApp.fetch(Logoin_url, post_options);
Logger.log(response)
//hedearからcookieを取得
let cookies = response.getHeaders()["Set-Cookie"];
let headers = { Cookie: cookies };
//欲しいデータのページへ遷移
let target_URL = "https://delta-tracer.com/item/detail/jp/" + "B07GWY3HYD";
let get_options = {
method: "get",
headers: headers,
followRedirects: true,
};
let response2 = UrlFetchApp.fetch(target_URL, get_options);
let content = response2.getContentText("UTF-8");
}
簡易コード解説
それでは、簡単にスクリプトの説明をしていきたいと思います。
ログイン処理の実施方法
まずは、ログイン処理の部分から見ていきます。対象コードは以下の部分です。
//ログイン処理
const Logoin_url = "https://delta-tracer.com/auth/login_exec/"
let login_payload = {
"r":"",
"login-email":"e-mail_adress",
"login-password":"password",
}
let post_options = {
method: "post",
payload: login_payload,
followRedirects: false
};
var response = UrlFetchApp.fetch(Logoin_url, post_options);基本的にやってることは、対象URLにoption(method指定、payload, redirect指定）を付与して、fetchしているだけです。
methodはpost処理なので、POST指定しているのはそのまま理解可能かと思います（仮にgetでform送るというやっちゃいけない実装している会社があれば、別ですが。。）
payloadは、先ほど事前準備で識別したform dataの内容に沿って作っていきます。今回のケースでは、{r, login-email, login-password}という指定だったので、そのフォーマットに沿ってpayloadを作成していけばOKです。
GASでのセッション保持〜ログイン後のページ遷移〜
次に、セッション保持（クッキーデータの保持）とurl遷移の方法です。対象コードは以下の部分です。
//hedearからcookieを取得
let cookies = response.getHeaders()["Set-Cookie"];
let headers = { Cookie: cookies };
//欲しいデータのページへ遷移
let target_URL = "https://delta-tracer.com/item/detail/jp/" + "B07GWY3HYD";
let get_options = {
method: "get",
headers: headers,
followRedirects: true,
};
let response2 = UrlFetchApp.fetch(target_URL, get_options);まずはログイン処理でfetchした結果返されるレスポンスから、クッキーを取得しています。クッキーはheaderに含まれて返却されます。
そのクッキーを使い回すことで、GASスクレイピングでもログインしたままページ遷移が可能です。これをしないとログイン状態の保持がなされないので、ログイン後画面をスクレイピングしたい場合、機能しません。
そして、遷移したい場合、遷移したい先のURLをgetしてこればいいのですが、この際にheadersに先ほど取得したcookieを付与しています。ここが肝ですね。
セッションって何？cookieって何？
えぇっと今回のメインテーマではないのですが、いつか説明用の記事を作りたいなと思っています。今回は端折らせてもらいますが。。
現代のwebページが便利に利用できる理由の一つがこのcookieです。昨今はGDPR等で叩かれている（同意必須になったり、忘れられる権利だったり）ものでもありますが、恩恵を預かっている側面もいつか説明したい。。
【追記 記事がありました汗】
まとめ
さて、久しぶりの記事は【GAS ログインが必要なページへのスクレイピング方法〜ログインのパス方法とセッション管理〜】として、GASでスクレイピングする際のログイン処理への対応とセッション維持したまま遷移する方法の紹介でした。
今時のウェブサービスだとAPIが提供されているケースも多いですが、APIが提供されておらずスクレイピングが必要でログインが絡むというケースもまだまだ見かけます。
早くAPIがどのサービスでも提供されるようになるとノンプロにはありがたい世界なんですけどねぇ。
