手動で毎日アクセスするのが面倒な全ての人へ

## はじめに
通知機能が搭載されていないWebページについて、毎日手動でアクセスして情報を取得するのが面倒なので自動化してみました。

## スクレイピング（Webスクレイピング）について
Webスクレイピングとは主にWebサイト上に掲載されている情報を取得したのち、必要な部分のみ抽出（+保存）する作業を指します。例えば任意のページのとある情報（商品情報・天気予報・Web記事）の特定部分を抽出したい場合に利用できます。
また、似た言葉にクローリングというものがありますがこちらはWebサイト全体を網羅的に巡回しデータを収集することを指します。例えばこのクローリングという技術はGoogleの検索インデックスの構築に利用されていますね。

### Webスクレイピング実施時の注意点
ここまで聞くと「便利やん、使い倒したろ」となるかも知れませんが、チョット待って！！！
賢い方ならお気づきかもしれませんが、この技術、Webサイト運営者の立場としては少々厄介モノだったりするんですわ。個人情報に関わる情報は抽出禁止はもちろんのこと、著作権侵害の恐れもあり、短時間で大量のリクエストを実施することになるのでサーバーへ多少なりとも負荷をかけることになります。そのため、Webスクレイピングを実施する前には必ず事前に当該Webサイトを確認してください。robots.txtの内容や利用規約ページの確認が必要ですが、利用規約内には「スクレイピング」と限定した書き方ではなく、「ロボット等によるデータ抽出・収集」といった書き方がされていることが多いです。スクレイピングはもちろんそれに含まれるため、このような記載がある場合にはスクレイピングはしないように注意してください。本ブログの利用に起因するいかなる損害についても、当方は一切の責任を負いかねます。なお本ブログにおいても[利用規約](https://techblog.futosh1.com/terms)内に同様の記載をしておりますので、スクレイピングはくれぐれもお控えください。とはいえ大変便利な技術ですので早速使い方を紹介しますね。今回は私のブログでWebスクレイピングを実施してみました。自分自身のページにおけるWebスクレイピングであれば誰が文句を言えようか（以下略）。

## Pythonのスクレイピングライブラリ比較
Webスクレイピングについての概要は前述の通りですが、どうやって実施をしましょうか？まあお決まりの話ですが、Pythonなので便利なライブラリがいくつもあるんですよね。まずはいくつか代表的なものを紹介します。

### Requests & BeautifulSoup
BeautifulSoup、美味しそうですよね。こちらはHTML・XMLの解析と特定の情報の抽出に特化しており、通常Requestsライブラリと一緒に使われます。DOMツリー構造を使って操作が可能なので静的ページにはもってこいのライブラリです。初学者向けで最も学習コストが低いとも言われていますが、標準のhtml.parserだけでなくC言語で書かれたlxmlパーサーと組み合わせることもできるため、比較的高速な処理が可能で、簡単な処理には重宝されています。一方でHTMLをそのまま解析するだけなので、ブラウザ側(=JavaScript)でレンダリングされるSPAのようなWebサイトや、lazy laodが組み込まれた動的ページの解析には不向きです。

### Scrapy
こちらは膨大なデータの処理に向いており、スクレイピングとクローリングの両方が利用可能なフレームワークです。ライブラリではなくフレームワークであることがポイントで、他のライブラリと比較して幅広く機能が提供されています。また並行処理も可能であるため非常に高速な処理が期待できます。一方で、BeautifulSoupと同様に動的ページの解析には不向きです。

### Selenium
Seleniumは既出の2ライブラリとは少し毛色の違うライブラリです。一番の特徴はブラウザをどのように操作するかを指示できることにより、静的ページだけでなく動的ページからの抽出が可能であることです。これにより、例えばJavaScriptによるページの読み込みが完了してから操作を実行できたり、入力フォームへのテキスト入力・ボタン押下・スクロール動作ができたりと、さながら実際にページを手動で操作するような感覚です。RPAっぽいとも言えるかもしれませんね。ここまで褒めちぎりましたが、反対に一番のネックは処理速度です。クライアント上でブラウザを実際に起動しているので、手動よりは格段に速いですがそれはもう時間がかかります。

### 比較表
ここまでの情報を以下の通りまとめてみました。
|  | BeautifulSoup | Scrapy | Selenium |
| :-- | :--: | :--: | :--: |
| HP | [URL](https://www.crummy.com/software/BeautifulSoup/) | [URL](https://scrapy.org/) | [URL](https://www.selenium.dev/ja/documentation/) |
| 特徴 | 簡単！速い！ | 大規模な処理が得意 | 動的ページの処理が可能 |
| 静的コンテンツの処理 | ✔︎ | ✔︎ | ✔︎ |
| 動的コンテンツの処理 | - | - (一部可能) | ✔︎ |
| 処理スピード | ◯ | ◎ | ▲ |
| 学習コスト | ◎ | ▲ | ◯ |

## Webスクレイピング、実際にやってみた。
### RequestsとBeautifulSoupを使ったWebスクレイピング
まずは一番簡単なこちらから。解析するページは以前執筆した[PythonでGoogle Driveにファイルをアップロード・ダウンロードする。](https://techblog.futosh1.com/blogs/python-gdrive-updownload)という記事にします。ここから`meta`タグと`h2`タグを取得してみましょう。
まずは`beautifulsoup4`タグと`requests`をインストールします。
```
pip install beautifulsoup4 requests
```
続いて以下の通りコードを書いていきましょう。
<script src="https://gitlab.com/-/snippets/4777841.js"></script>
<details>
<summary>「一行解説」を見る</summary>
<ol type="1">
<li>(l.1-2) ライブラリをインポートします。</li>
<li>(l.4) 対象のWebページのURLを用意します。</li>
<li>(l.6) <code>requests.get()</code>メソッドを使って4行目のURLに対してHTTP GETリクエストを送信し、HTMLデータを取得します。結果を<code>response</code>に格納します。</li>
<li>(l.7) 6行目の<code>response</code>を解析するためにDOMツリー構造に変換します。そのために第一引数には<code>responsex.text</code>を、第二引数には<code>html.parser</code>をセットして<code>BeautifulSoup()</code>メソッドを実行します。<code>response</code>について<code>.text</code>という属性をつけたのは、BeautifulSoupが解析可能なテキスト形式に変換する必要があるからです。また、第二引数に<code>html.parser</code>をセットしたのは、あくまでもBeautifulSoupに自体にはパース済みのHTML・XMLを操作する機能しかなく、パース自体はパーサーの役割となるからです。なお、<code>response</code>については、テキスト属性の他にも、ステータスコードを取得できる<code>.status_code</code>属性やJSONデータを取得できる<code>.json</code>属性があります。</li>
<li>(l.9) DOMツリー構造への変換が完了したので、ここからは<code>BeautifulSoup()</code>メソッド内のメソッドを使って抽出したい要素を探索します。まずは<code>find()</code>メソッドを使用して、HTML内の特定の<code>meta</code>タグを検索します。ここで第二引数に<code>{'name': 'description'}</code>を設定することで、<code>name</code>属性が<code>description</code>となっているページ名が登録されている<code>meta</code>タグのみに限定することができます。これを<code>meta_description</code>に格納します。</li>
<li>(l.10) 9行目の<code>meta_description</code>に格納された<code>meta</code>タグについて、<code>'content'</code>属性の値を<code>.get()</code>メソッドで抽出します。この<code>'content'</code>属性内の値こそが今回欲しかった値です。</li>
<li>(l.12) 続いて9行目と同様に、今度はブログ記事内の各章の見出しである<code>h2</code>タグを取得します。こちらは複数存在するため、<code>.find_all()</code>メソッドで該当する<code>h2</code>タグをすべて検索します。</li>
<li>(l.13-14) <code>h2</code>タグについて、そのまま出力するとタグごと出力されてしまうので、今回も<code>.text</code>属性を利用してテキスト部分のみ抽出し出力します。</li>
</details>
こんな具合にで簡単に取得できることが分かりましたね。処理時間も一瞬でしたね。

ちなみにこちらのブログでは記事の検索もちょっとだけ可能なのですが、検索の実行+結果からの抽出はBeautifulSoupでは難しいんですよね。。これを実現するのが、そう、Seleniumなんです。

### Seleniumを使ったWebスクレイピング実施
ということでSeleniumを使ったスクレイピングについては、検索キーワード入力→検索の実施→検索結果の出力という手順を踏みたいと思います。まずはライブラリをインストールします。
```
pip install selenium
```
続いて以下の通りコードを書いていきましょう。
<script src="https://gitlab.com/-/snippets/4777853.js"></script>
<details>
<summary>「一行解説」を見る</summary>
<ol type="1">
<li>(l.1-3) Seleniumとして利用するコンポーネントをインストールしていきます。<code>webdriver</code>とはブラウザを操作するために必要なコンポーネントです。<code>selenium.webdriver.common.keys.Keys</code>はキーボード操作を受け付けるためのモジュール、<code>selenium.webdriver.common.by.By</code>はHTMLの要素を検索する際に方法を指定するためのモジュールです。</li>
<li>(l.4) クライアントの処理に時間がかかることを想定して、<code>time</code>もインポートします。</li>
<li>(l.6-8) <code>webdriver.Chrome()</code>メソッドを利用してSeleniumのChrome WebDriverを起動します。その後URLを指定して<code>.get()</code>メソッドでページを開きます。</li>
<li>(l.10) Seleniumはクライアントでブラウザを利用して実行されるのでエラー発生を想定した処理を記述するためエラーハンドリングを記述します。</li>
<li>(l.11) 続いて検索キーワードを入力するためのフィールドを検索します。第一引数には<code>By.CSS_SELECTOR</code>とすることでCSSセレクタを使うことを指定、第二引数には<code>input</code>タグの<code>type</code>属性が<code>text</code>であることを指定して、<code>find_element()</code>メソッドでフィールドを検索します。今回はCSSセレクタを指定する方法を取りましたが、<code>TAG_NAME</code>や<code>ID</code>も利用できます。</li>
<li>(l.12-14) 検索キーワードを指定します。今回は<code>Google</code>としました。それを<code>send_keys()</code>メソッドに渡すことでフィールドへの入力を実行し、<code>send_keys(Keys.RETURN)</code>とすることでEnterキーを押下しました。これにより検索の実行が完了しました。</li>
<li>(l.17) <code>time.sleep(3)</code>として、検索結果表示までの時間を確保します。</li>
<li>(l.19-20) 続いて、検索結果の要素数をカウントします。このブログでは検索結果は長方形の<code>div</code>タグの箱で表示されるようにしていますが、クラス名はいずれも<code>ArticleItem_eachArticle</code>を含むことがわかっています。そのため、部分一致を表す<code>*=</code>でクラス名を指定して<code>find_element()</code>メソッドの第二引数に設定します。検索結果は<code>elements</code>内にリスト形式で入っているので<code>len()</code>メソッドで個数を確認します。</li>
<li>(l.23) エラーハンドリングの例外処理として<code>Except</code>を記述します。</li>
<li>(l.26) 処理が完了したら、<code>.quit()</code>でブラウザを切ります。</li>
</details>
というわけで検索キーワード入力→検索の実施→検索結果の出力が完了しました。このような動作はBeautifulSoupでは実施できないため、Seleniumの活用によりWebスクレイピングの幅を広げることができたのではないでしょうか？ただ、この程度の処理にもかかわらず約10秒要したため、使い所の見極めは大事そうです。

## まとめ
スクレイピングについて解説してきましたが、どのライブラリを使うにしろ一番のネックはWebページの構造・デザイン自体が変更されるリスクです。海外の有名なSaaSアプリ等は単なる機能追加だけでなくデザインのアップデートも頻繁になされるため、その度にコードを修正するのは骨が折れると思います。提供されているのであればWebAPI経由の方が、抜け漏れの少ない構造的な情報を取得可能なのでそちらをおすすめしたいです。

Webページの情報を自動取得する。

News APIを使って巷のニュースを拾い上げてみた。

## はじめに
さて、最後の更新からおよそ10ヶ月経ってしまいました。毎週更新が目標だったのに。。というわけで、今後は毎月更新に下方修正してこれからも頑張りたいと思います（？）。さて復活第一弾はNews APIを使ってみた、です。RSSリーダーのような機能を自作のWebアプリにも搭載してみたいなと思い、試しに使ってみたのでここでまとめてみます。

## News APIとは
[<strong>「News API」</strong>](https://newsapi.org/)とは世界中のニュースをかき集めたサービスで、利用者はREST APIでニュースを取得できます。[無償版・有償版](https://newsapi.org/pricing)があり、HPを確認する限りでは有償版は企業でも利用されているようですが、記事更新が24時間遅れ、100リクエスト/日などの制約に目を瞑れば十分有用だと思うので今回は無償版を利用させていただきましょう。また、今回Pythonを使用してAPIを叩きますが、その他にもNode.js, Ruby, PHP, Java, C#が利用できるようです。利用までの大まかな流れは以下の通りです。めっちゃ簡単です。イージーピージー。
1. 利用登録・APIキー取得
2. APIを叩く

## 1. 利用登録・APIキー取得
一般的に、サービス利用時に求められる情報の提供さえすればAPIキーは取得可能なので、ここは省きます。

## 2. APIを叩く
News APIには<strong>「Everything」</strong>`/v2/everything`と<strong>「Top headlines」</strong>`/v2/top-headlines`の2種類のエンドポイントがありますが、今回は「Everything」を使います。それぞれパラメータが異なるので注意してください。

<script src="https://gitlab.com/-/snippets/3746930.js"></script>
<details>
<summary>「一行解説」を見る</summary>
<ol type="1">
<li>(l.1-3) <a href="https://newsapi.org/docs/client-libraries/python">公式ドキュメント</a>を確認すると<code>newsapi-python</code>というライブラリが使われているようですが、PythonでのHTTP通信によく使われる<code>requests</code>で代用可能なので今回はこちらを使います。その他、取得したデータを整形するための<code>pandas</code>もインポートします。
<li>(l.5-12) HTTPリクエスト時のパラメータを設定しています。<code>apiKey</code>はNews API登録時に取得したものです。また今回のニュース検索では検索クエリとして<code>q</code>、検索対象言語として<code>language</code>、検索条件として<code>sortBy</code>、期間指定として<code>from</code>と<code>to</code>を設定しています。<a href="https://newsapi.org/docs/endpoints/everything">検査対象言語</a>としては残念ながら日本語は設定できませんが、英語をはじめいくつかの言語が設定できるようです。デフォルトでは言語に関係なく返されますが、今回はフランス語（<code>fr</code>）を設定してみました。検索条件には<code>popularity</code>を設定しており、閲覧数の多いソース・出版社からの記事が優先されます。最後に、期間指定を指定しました。</li>
<li>(l.13-15) URLにはAPIのエンドポイントを、<code>get()</code>メソッド内にパラメーター（<code>params</code>）と一緒に設定します。レスポンスは<code>json()</code>メソッドを利用しJSON形式としてパースします。</li>
<li>(l.17) 最後にJSON形式のままでは利用しづらいため、DataFrame形式に変換しましょう。実際の記事データは、<code>articles</code>という配列の中に格納されているので、この部分だけ抜き出しますが、今回はJSON形式からの変換となるため、<code>pd.DataFrame()</code>メソッドではなく<code>json_normalize()</code>メソッドを利用します。</li>
</details>

## まとめ
今回はあえてフランス語での検索をしてみましたが、日本語のキーワードを入力すれば日本語の記事が返ってきます。しかし前述の通り日本語指定検索は非対応のため、一部中国語の記事が返されてしまいました。その後正規表現ライブラリを利用すればできなくはないですが、使いこなすには色々と工夫が必要そうです。

News APIでニュースを取得する。

Pythonを使ってGoogle Driveにファイルをアップロードしたりダウンロードしたりして遊んでみました。

## はじめに
当方Google教原理主義者につき何から何までGoogleを利用していますが、もうデータベースまでGoogle様を利用することにしました。でも敬虔故に（？）無料で使用可能なGoogle Driveを今回は利用します。

## アップロードダウンロードの準備・流れ
Google Driveへのファイルアップロード・ダウンロードには[<strong>「Google Drive API」</strong>](https://developers.google.com/drive/api/guides/about-sdk?hl=ja)というライブラリが公式で用意されているためこちらを利用しましょう。またアップロード・ダウンロードするファイルには、前回[Pythonで株価情報を取得・チャート化してみた。](https://techblog.futosh1.com/blogs/python-stock-data)で使用したデータを使ってみたいと思います。全体の流れとしては以下の通りです。
1. Google Drive APIの有効化
2. Google Drive設定
3. csvファイルのアップロード・csvファイルのダウンロード

## 1. Google Drive APIの有効化
### APIの有効化
Google Drive APIを利用するにはGoogle Cloud Platform（以下GCP）からAPIの有効化が必要です。まずは[このリンク](https://console.cloud.google.com/marketplace/product/google/drive.googleapis.com?q=search&referrer=search&hl=ja&project=) にアクセスして"有効にする"のボタンを押してください。

### サービスアカウントの作成
続いてGCPで下画像の通りサービスアカウントを作成します。

#### サービスアカウントって？
[<strong>「サービスアカウント」</strong>](https://cloud.google.com/iam/docs/understanding-service-accounts?hl=ja)とはGoogle APIを利用するための認証情報の1種です。Googleは数多くのAPIを提供していますがAPIの利用には認証が必要になります。他の認証手段としては<strong>「APIキー」</strong>と<strong>「OAuth 2.0 クライアントID」</strong>の2つがありますが、それぞれ取得情報と取得主体に応じて以下のような使い分けがされています。
* APIキー・・・<strong>一般に公開</strong>されている情報を取得する際に、<strong>直接</strong>アクセスして利用します。
* OAuth 2.0 クライアントID・・・<strong>一般への公開・非公開にかかわらず</strong>情報を取得する際に、<strong>Googleアカウントを持つユーザー認証経由</strong>でアクセスして利用します。
* サービスアカウント・・・<strong>一般への公開・非公開にかかわらず</strong>情報を取得する際に、<strong>人間ではないサービスアカウント経由</strong>でアクセスして利用します。

例えば、Googleマップの情報やYouTubeの情報を取得する場合にはAPIキーが利用できますが、今回はGoogle DriveへのアクセスとなるためOAuth 2.0 クライアントIDもしくはサービスアカウントでアクセスする必要があります。しかし、OAuth 2.0 クライアントIDの場合、現在の当方の環境（外部ユーザへ開放されている、かつTesting版）ではRefresh Tokenが7日間で失効するという制約があったため、サービスアカウントを使用することにしました。

#### サービスアカウント作成
[こちらのリンク](https://console.cloud.google.com/apis/credentials?hl=ja&project=)からも飛べますが、GCPから"APIとサービス" > "認証情報"で下の画面に行けます。この画面から、"認証情報を作成" > "サービスアカウント"をクリックしてください。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/python-gdrive-updownload1_ttvbmv">
下画像の通りサービスアカウント作成画面に遷移したら、詳細を設定していきます。まずは赤枠の通りサービスアカウント名を入力しましょう。するとサービスアカウントIDが自動で入力されるので、それで問題がない場合はそのまま使用してOKです。サービスアカウント名とサービスアカウントIDが入力できたら、一旦ここでは完了ボタンを押してください。上画像のサービスアカウント欄に今作成したサービスアカウントが確認できると思います。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/python-gdrive-updownload2_fxtxki">

#### 秘密鍵作成
次に秘密鍵を作成しましょう。サービスアカウント欄に上で新規作成されたサービスアカウントが表示されていると思いますが、一番右にペンのアイコンがあると思います。それをクリックすると下画像のような"IAMと管理"というページに飛びます。画面左のナビゲーションで"サービスアカウント"が選択されていること、主画面上のタブで"キー"が選択されていることを確認した上で、"鍵を追加" > "新しい鍵を作成"というボタンを押してください。すると下画像の通りダイアログが出てきます。ここでキーのタイプを"JSON"の状態にしたまま"作成"ボタンを押すとJSONファイルがダウンロードされます。このJSONファイルがAPIを利用する際の秘密鍵となりますので、今回作成するPythonファイルと同じディレクトリに格納しておいてください。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/python-gdrive-updownload3_jrbmrt">

## 2. Google Drive設定
#### サービアカウントのメールアドレス
GCP側の設定が終わったら次はGoogle Drive側の設定ですが、その前に1つGCP側から重要な情報を控えてくる必要があります。メールアドレスです。2つ上の画像内で、サービスアカウントIDというものが出てきましたが、ここに"abcde-460@quicstart-~~~~~.iam.gserviceaccount.com"という情報があると思います。このメーアドレスがGoogle Drive側の設定で必要になりますのでコピーしておきます。コピーできたら早速Google Driveを開きましょう（※[URL](https://drive.google.com/drive/my-drive)）。
#### Google Driveに移動・設定
ここで適当にフォルダを作ってください。参考までに`sample_folder`としました。`sample_folder`内に遷移しパンくずリストの`sample_folder`をクリックし、下画像のように"共有" > "共有"を押してください。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/python-gdrive-updownload4_daonjd">
すると下のようなダイアログが出てきます。ここで先ほど控えておいたメールアドレスを入力して（任意ですが）"通知"を外すと"共有"ボタンが出てきます。これをクリックしたらGoogle Drive側の設定は完了です。これでPythonコードからアクセスできるようになりました。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/python-gdrive-updownload5_z7dv2t">

## 3. csvファイルのアップロード・csvファイルのダウンロード
ようやく準備が整ったので、最後にcsvファイルをアップロード・ダウンロードするための記述をしていきましょう。今回は`updown_sample.py`というファイルを作ってそこに記述していきます。また、先ほど作成したJSONファイルの秘密鍵を同じディレクトリ内に格納しましょう。格納する際にはこのJSONファイル名を`client_secrets.json`に変更しておいてください。


<script src="https://gitlab.com/-/snippets/3619823.js"></script>
<details>
<summary>「一行解説」を見る</summary>
<ol type="1">
<li>(l.3-20) 参考情報として前回<a href="https://techblog.futosh1.com/blogs/python-stock-data">Pythonで株価情報を取得・チャート化してみた。</a>で使用したデータをインポートして出力しています。</li>
<li>(l.22) 入出力に関わるモジュールをインポートします。今回は<code>BytesIO()</code>メソッドをダウンロード時に利用します。</li>
<li>(l.23) サービスアカウントを用いて認証を行うために必要なモジュールをインポートします。</li>
<li>(l.24) Google API サービスのクライアントオブジェクトを作成するためのモジュールをインポートします。</li>
<li>(l.25) ファイルのアップロード・ダウンロードに使用するモジュールをインポートします。</li>
<li>(l.27) 上でディレクトリに格納済みのサービスアカウントの秘密鍵のパスです。</li>
<li>(l.28) Google Driveにおいてアップロード先・ダウンロード元のフォルダのIDを指定します。先ほど、<code>sample_folder</code>というフォルダをGoogle Drive上に作成しましたがそのフォルダのIDとなります。IDについてはフォルダを開いた際のURLから取得できます。（URLの最後のディレクトリそのものです。）</li>
<li>(l.29) 今回利用するデータをアップロードするために格納するファイルの名前です。</li>
<li>(l.31-34) サービスアカウントの秘密鍵を利用して認証を設定します。引数にはサービスアカウントの秘密鍵のパスと、Google Drive API に対する読み取り/書き込みの権限を指定する<code>scopes</code>を設定しています。今回利用するスコープでは<strong>ドライブにあるすべてのファイルを表示・管理できます。</strong>なお、<code>scopes</code>の種類については<a href="https://developers.google.com/drive/api/guides/api-specific-auth?hl=ja">こちら</a>、<code>service_account</code>に関わるGitHubレポジトリは<a href="https://github.com/googleapis/google-auth-library-python/blob/main/google/oauth2/service_account.py">こちら</a>をご利用ください。</li>
<li>(l.36) Google Drive APIの<strong>「クライアントライブラリ」</strong>を<code>build()</code>メソッドを用いて作成します。クライアントライブラリとはGoogleのAPIと通信を行い様々な操作（取得・作成・削除等）するためのオブジェクトのようなものです。引数にはGoogle Drive APIを指す<code>"drive"</code>、対象のAPIのバージョンを指す<code>"v3"</code>、 (l.31-34) で設定した認証情報を指定しています。</li>
<li>(l.38-41) アップロードするファイルの名前と配置先のフォルダを指定するためにメタデータを指定します。</li>
<li>(l.43) Google Drive APIの<code>MediaFileUpload</code>というクラスを利用してアップロードのためのインスタンスを作成しています。第一引数にはアップロードしたいファイルのファイルパスを指定します。第二引数には<code>resumable=True</code>とすることで、アップロードが中断された場合に再開できるように、リジューマブル（再開可能）なアップロードを有効にしています。これにより大きなファイルのアップロード時に途中で接続が切れた場合に再開が可能となります。</li>
<li>(l.44) 実際に<strong>Google Driveにファイルをアップロードする</strong>部分です。<code>build()</code>メソッドで作成したクライアントライブラリに対して<code>.files()</code>メソッドを呼び出すことでファイル操作関連のリソースを呼び出します。さらに<code>.create()</code>メソッドでファイルを作成し、引数として<code>body</code>と<code>media_body</code>内にそれぞれ上で作成した<code>file_metadata</code>と<code>media</code>を指定します。<code>fields</code>にはレスポンスとして返される情報として今回は<code>id</code>のみ指定しています。最後に<code>.execute()</code>メソッドを呼び出すことで、処理を実行をします。これでファイルアップロードは完了です。</li>
<li>(l.48) これ以降はファイルダウンロードに関わる部分です。ファイルの有無を検索するためのクエリを作成します。</li>
<li>(l.49-50) ここでは<code>file_path</code>が空でない（具体的なファイル名が指定されている）場合、かつ<code>folder_id</code>が指定されている場合に、<code>parents</code>フィールドが指定されたフォルダ内で検索する条件を追加しています。これにより、特定のフォルダ内で指定されたファイル名に一致するファイルを検索する条件が構築されます。</li>
<li>(l.52) 実際に<strong>Google Drive内からファイルを検索する</strong>部分です。ファイル作成時でも利用した、<code>build()</code>メソッドで作成したクライアントライブラリに対して<code>.files()</code>メソッドを呼び出しています。ここでは検索を実行したいので、引数として (l.48) で作成したクエリを指定することで指定条件に一致するファイルを<code>.list()</code>メソッドで検索しています。</li>
<li>(l.53) 実行結果は辞書形式でその中の<code>"files"</code>キーに検索結果のファイルリストが格納されています。<code>.get()</code>メソッドを使ってこのキーにアクセスし、検索結果を取得しています。もし<code>"files"</code>キーが存在しない場合には空のリストが返されます。</li>
<li>(l.58-59) ここでは検索結果の有無で場合分けをしていますが、存在する場合には最初に見つかったファイルの情報にアクセスし、そのファイルIDを変数<code>downloaded_file_id</code>に格納しています。見つかったファイルは後でターミナルから確認できるように、 (l.59) の通り出力しておきます。</li>
<li>(l.61) (l.44)ではアップロードするために<code>build()</code>メソッドで作成したクライアントライブラリに対して<code>.files()</code>メソッドを呼び出してファイル操作関連のリソースを呼び出した上で<code>.create()</code>メソッドでファイルを作成しました。今度はパラメータに先ほどの変数<code>downloaded_file_id</code>を指定して<code>.get_media()</code>メソッドでファイルダウンロードの準備をします。</li>
<li>(l.62-63) ここでは (l.62) と (l.63) でダウンロードするファイルに対してのその形式を指示していますが、 (l.62) についてはお試しでローカルに書き込んでいるだけなので飛ばしてもらって構いませんが、もしこのコード例のようにローカルにダウンロードしたい場合は、引数にダウンロードする際のファイル名とバイナリでの書き込みを意味する<code>"wb"</code>を指定して<code>io.FIle()</code>メソッドでファイルを開きます。続いて、 (l.63) については<code>io.BytesIO()</code>メソッドを利用することでメモリ上に一時的にダウンロードするようにします。</li>
<li>(l.64-65) その後Google Drive APIの<code>MediaIoBaseDownload</code>クラスを利用して (l.61-63) で設定した情報をもとにそれぞれローカル・メモリにダウンロードするためのインスタンスを作成します。</li>
<li>(l.67-71) この部分については、 (l.73-77) でカバーしているため省略します。</li>
<li>(l.73-77) ここからインスタンスをもとに実際にデータをダウンロードしていきます。
<ul>
<li>(l.73) いきなり<code>done1 = False</code>としていますが、変数<code>done1</code>を<code>False</code>初期化することによってダウンロードが完了したかどうかを示すフラグを用意して、次の<code>while</code>に備えています。</li>
<li>(l.74-75) <code>MediaIoBaseDownload</code>クラス内の<code>next_chunk()</code>メソッドを呼び出して、複数のかたまりに分割して<strong>Google Driveからファイルをダウンロードする</strong>部分です。<code>status1</code>にはダウンロードの進捗情報が含まれ、ダウンロードが完了したかどうかを示すフラグが更新されます。</li>
<li>(l.76) <code>MediaIoBaseDownload</code>クラス内の<code>.progress()</code>メソッドを利用してファイルダウンロードの進捗率を表示します。</li>
<li>(l.77) 続いて (l.63) で作成した<code>io.BytesIO()</code>のオブジェクトである<code>fh1</code>に対して、<code>.seek(0)</code>とすることでファイルポインタの位置を"0"=先頭に戻しています。通常ファイルを読み取り後に再度同じファイルを読み取る際、ファイルポインタがファイルの最後に進んだままだと何も読み取れないません。そのためファイルポインタをファイルの先頭に戻しておくことで期待通り全データを取得できるようにしています。</li>
</ul>
</li>
<li>(l.79-80) 最後に取得したデータをDataFrame形式で出力しましょう。</li>
<li>(l.82-95) (l.7-20) と同じ結果が出力されていれば成功です。</li>
</ol>
</details>


これで`updown_sample.py`によるファイルのアップロード・ダウンロード設定が完了しました。

## まとめ

今回Google Drive APIの基本操作として「アップロード」、「検索」、「ダウンロード」の3種類を実行しました。CRUDなアプリケーションを作るのには物足りないですが、個人的にはデータベース代わりに少量のデータを保管・読み取りするだけなら使えそうだなという印象です（がいかがでしょうか？）。

PythonでGoogle Driveにファイルをアップロード・ダウンロードする。

Google Search Consoleに蓄積されたデータをPythonで取得してみました。

## はじめに
以前、[Pythonで<strong>「Googleアナリティクス（以下、GA4）」</strong>のデータをAPI経由で取得する方法](/ga4-data-python)についてまとめましたが、今回は同様に<strong>「Google Search Console」</strong>でもやってみたいと思います。ちなみにGA4（およびUA）がWebページへの<strong>流入後</strong>のデータを主に取得するのに対して、Google Search Consoleでは<strong>流入前</strong>のデータを主に取得します。

## 利用するツール
PythonでAPIを叩くために今回は[<strong>「Google Search Console API」</strong>](https://developers.google.com/webmaster-tools?hl=ja)というものを使います。こちらは[無料](https://developers.google.com/webmaster-tools/pricing?hl=ja)で利用することができ、<strong>自然検索経由での流入に関連するデータ</strong>を取得することができます。今回は検索クエリ、インプレッション数、クリック数、CTRを取得してみようと思います。それぞれの用語の説明は以下の通りです。
* <strong>「検索クエリ」</strong>・・・ユーザーが検索する際に使用された単語および単語の組み合わせ。検索語句とも呼ばれる。
* <strong>「インプレッション数」</strong>・・・WebページがGoogle検索において検索結果として表示された回数。この指標はユーザーが当該ページのリンクが確認できる部分までスクロールされなくてもカウントされる。表示回数とも呼ばれる。
* <strong>「クリック数」</strong>・・・Google検索結果として表示されたURLがクリックされた回数。
* <strong>「CTR」</strong>・・・クリック率 / インプレッション数で表される値。Click Through Rateの略でクリック率とも呼ばれる。

なお前提として、前回GA4データを取得した時と同じ環境で実行することを想定しているので、予めご了承ください。

## API利用
### Google Search Console側の設定（1/2）
#### Google Cloud Platform設定
前回、Google Cloud Platform（GCP）側でプロジェクトを作成しましたが今回は同じプロジェクトで実施するため、GCPでの新規プロジェクト作成は不要です。ただし、前回生成したJSONファイルはそのまま利用します。
#### Google Search Consoleの設定
GA4同様、JSONファイル内の"client_email"をGoogle Search Console内に設定していきます。[設定] → [ユーザーと権限] → [ユーザーを追加]内に、"client_email"を追加、[権限]は一旦「フル」で良いと思います。※必要に応じて変更してください。これでGoogle Search Console側の設定は完了です。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/gsc-data-python1_o0j9v6"/>

### Python設定（2/2）
続いて、Pythonプロジェクト側で[Google API Python Client](https://github.com/googleapis/google-api-python-client)というライブラリをインストールします。
```
pip install google-api-python-client
```
あとは~雰囲気的にはGA4と似ているので~GA4同様に下のようにコードを記述していくだけです。
<script src="https://gitlab.com/-/snippets/3607969.js"></script>

参考までに、[公式のパラメータ一覧](https://developers.google.com/webmaster-tools/v1/searchanalytics/query?hl=ja#dimensions)を載せておきます。GA4ほどではないですが、こちらでも色々と試してみる甲斐ありそうです。

## まとめ
これでGoogle Search Consoleに蓄積されている検索結果についても取得することができるようになりました。取得回数に制限はありますが無料で利用できるのは助かりますね。GA4と組み合わせて自分だけのダッシュボードを作ってみても良いかもしれませんね。

Google Search ConsoleのデータをPythonで取得する。

Django REST Frameworkをバックエンドに、Next.js+MUIをフロントエンドにして、Markdown形式で記事を投稿するブログを作成しました。【Part 3】

ブログ作成についてまとめました。

Django REST Framework + Next.js (MUI) + Markdownでブログを作る【Part 3】

Django REST Frameworkをバックエンドに、Next.js+MUIをフロントエンドにして、Markdown形式で記事を投稿するブログを作成しました。【Part 2】

Django REST Framework + Next.js (MUI) + Markdownでブログを作る【Part 2】

Django REST Frameworkをバックエンドに、Next.js+MUIをフロントエンドにして、Markdown形式で記事を投稿するブログを作成しました。【Part 1】

Django REST Framework + Next.js (MUI) + Markdownでブログを作る【Part 1】

Next.jsで作ったWebサイトがGoogle検索で出てこないので、いろいろと試しました。

## はじめに
これまでWebサイト作成についていろいろとまとめてきました。[Next.jsでWebサイト作成のための環境構築](https://techblog.futosh1.com/blogs/nextjs-tailwindcss-setup)をして、[アクセス解析のためにGA4設定](https://techblog.futosh1.com/blogs/ga4-nextjs)をして、[Vercelにデプロイして、サブドメイン設定して](https://techblog.futosh1.com/blogs/vercel-subdomain-webapp)。。。ただ、Google検索しても出てこないんです！！！これは大ごとです。せっかく作っても流入経路がTwitterしかないなんてふざけ倒しています。。。まあ、これはGoogleにインデックス登録されていないからなんですがね。
ということで、Google検索結果に出てくることを目指して、そして自然検索からの流入爆増を目指して対処しました。

## Google検索結果に表示されるまで・・・
### インデックスへの登録
そもそもここから学ぶべきなのです。Googleにおけるインデックスとは、「Googleが持つ検索エンジンの大規模なデータベース」です。（参考：[Google の検索エンジンの仕組み、検索結果と掲載順位について](https://developers.google.com/search/docs/fundamentals/how-search-works?hl=ja)）このインデックスに登録されないと、誰かがGoogle検索を実施した際、検索結果に表示されません。つまり誰にも見られないのです。ではどのような仕組みでインデックスに登録されるのでしょうか？

### ウェブクローラーによるインデックス登録
[Google の検索エンジンの仕組み、検索結果と掲載順位について](https://developers.google.com/search/docs/fundamentals/how-search-works?hl=ja)によると、Googleが持つウェブクローラーというソフトウェアが定期的にWebを探索することで、基本的には自動で見つけたページをインデックス登録されているとのことです。このウェブクローラーをGooglebotと言います。私のWebサイトは見つかっていないのですね。。。では、このGooglebotとやらにはなぜ見つけてもらえていないのでしょうか？

## インデックス登録されるには？
### インデックス登録されないワケ
いくつかあるのですが、多くの原因は下の通りです。
1. ドメインが新しいため・・・これはそういうもんだと覚えておいた方が良いかもしれません。新しいドメインはクロールの優先順位が下がるようです。
2. Googleガイドライン違反により、ペナルティを受けているため・・・Google検索には、Webサイト・アプリ制作者向けに[ガイドライン](https://developers.google.com/search/docs/essentials?hl=ja)が存在します。これに違反するとせっかく作っても掲載順位が上がらなかったり、場合によってはGoogle検索から除外されたりする可能性があるようです。詳しくは[Google ウェブ検索のスパムに関するポリシー](https://developers.google.com/search/docs/essentials/spam-policies?hl=ja)をご確認ください。要するにしょうもないことすなと書いてあります。
3. プログラムでnoindexを指定しているため・・・<head>内で`noindex`を指定してしまうと、インデックス登録がされなくなってしまいます。
4. robots.txtでクロールを禁止にしているため・・・robots.txtとは、収集されたくないコンテンツがある場合に、Googlebotに対してクロールを拒否するためのファイルです。

### インデックス登録されるための対処法
上記の通り原因をいくつか並べましたが、開発側で技術的に対処が可能な3と4の原因に対してそれぞれ対処していきましょう。
#### 3.プログラムでnoindexを指定しているため
文字通りですが、noindexを指定しなければ良いのです。<head>タグを利用している場合は、その中に以下の記述がないか確認してみてください。
<script src="https://gitlab.com/-/snippets/2581833.js"></script>
`<meta>`という記述があれば、これを消すだけで大丈夫です。

#### 4.robots.txtでクロールを禁止にしているため
robots.txtにおいて、以下の通り`Disallow`の記述をしている場合、`Disallow`の中身が空の場合は問題ありませんが、下のようにディレクトリ（もしくはディレクトリ+ページ）が記述されている場合、そのディレクトリ（今回の場合はpages以下のコンテンツ）が表示されなくなります。表示させたくないコンテンツがない場合には、`Disallow`の中身は空に保っておきましょう。
```
Disallow:/pages/
```

## Googleにインデックス登録されやすくするためには？
ここまでインデックス登録されない原因についてまとめてきましたが、全部対応したからといってすぐにインデックス登録されるわけではありません。だからと言って、ほな指咥えて待っとき！という話でもなく、インデックス登録されやすくするための工夫はできるんです。

### サイトマップ（sitemap.xml）の生成、Google Search Console（サーチコンソール）への送信
インデックスへの登録のためにGoogleはGooglebotを利用してクロールしている、しかし新しいドメインの場合はインデックス登録に時間がかかるというのは前述の通りです。というわけで、GooglebotにWebサイトの内容・構造を理解してもらうために（=クロールしてもらいやすくするために）、サイトマップを作ってあげましょう。

#### next-sitemapの利用
Next.jsのWebサイト・アプリでサイトマップを作成するためには、`next-sitemap`というパッケージを利用します。対象のGitHubリポジトリは[こちら](https://github.com/iamvishnusankar/next-sitemap)です。それではまず下の通りインストールします。
```
npm i --save next-sitemap

```

#### next-sitemap.config.jsファイルの設定
インストールできたら、プロジェクト直下に`next-sitemap.config.js`ファイルを新規作成します。ファイルの中身には以下の通り記述します。
<script src="https://gitlab.com/-/snippets/2581789.js"></script>
* 3行目にはWebサイト・アプリのURLを記述します。ここはベースとなるURLを入力してください。
* 4行目で、オプションですが`robots.txt`ファイルを生成します。デフォルトでは`false`なので、`true`の場合のみ記載しましょう。
* 5行目で、こちらもオプションですが`sitemapSize`を指定します。ここでは`7,000`という値を指定していますが、サイト内のURLが7,000を超過すると自動的にサイトマップが分割され、index（e.g. sitemap.xml）ファイルと詳細サイトマップファイル（e.g. sitemap-0.xml, sitemap-1.xml）ができるという設定です。
* 6行目で、こちらもオプションですが`exclude`を指定して、サイトマップから除外したいページ・サブディレクトリを配列形式で指定します。

#### package.jsonファイルの設定
続いて、`package.json`ファイルに必要事項を追記して、ビルド時に`public`ディレクトリの下に`sitemap.xml`ファイルを作成するようにします。
<script src="https://gitlab.com/-/snippets/2581796.js"></script>
* 3行目には`build`の記述をします。こちらはすでに記述があるかもしれません。
* 4行目には新しく`postbuild`を追加し、`next-sitemap.config.js`を実行するよう記述をします。

#### buildの実行
`npm run build`を実行します。すると、ビルドする度に、`postbuild`で記述したようにビルド後に`next-sitemap.config.js`が実行されます。
<script src="https://gitlab.com/-/snippets/2581797.js"></script>
また`postbuild`完了後には、`public`ディレクトリの下に、`sitemap.xml`ファイルと`robots.txt`ファイルが新しく生成されていると思います。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/next-googleindex1_xna4sl">

#### 生成されたsitemap.xmlファイル
`sitemap.xml`ファイルは以下の通りになっていると思います。
<script src="https://gitlab.com/-/snippets/2581801.js"></script>
* 3行目はWebサイト・アプリのURL（ベース）が表示されています。
* 5行目はWebサイト・アプリ内に存在する、別ページのURLが表示されています。今回は、`about`というページをWebサイト内に作成したため、このような表記になっているはずです。また、この下にも同Webサイト・アプリ内に存在する全てのURLが書き出されていると思います。

#### 生成されたrobotx.txtファイル
`robots.txt`ファイルは以下の通りになっていると思います。
<script src="https://gitlab.com/-/snippets/2581802.js"></script>
* 3行目は`Allow`となっていると思います。これは、今回Disallowを設定していないためです。
* 6行目にはWebサイト・アプリのURL（ベース）が表示されています。
* 9行目には今回生成されたサイトマップのURLが表示されています。これでURLとしてサイトマップにアクセスできるようになりました。

#### Vercelへのデプロイ
通常通りVercelへデプロイします。これで"https://~（Webサイト・アプリのURL（ベース））/sitemap.xml"にアクセスできるようになります。

#### Google Search Console（サーチコンソール）への登録
最後に、[Google Search Console（サーチコンソール）](https://search.google.com/search-console/welcome)にサイトマップを登録していきましょう。
何も登録されていない場合、サーチコンソールを開くと下のような画面が表示されます。「URLプレフィックス」の方に、"https://~（Webサイト・アプリのURL（ベース））/"を入力しましょう。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/next-googleindex2_jdezaz">
すると、下のような「所有権の確認」というモーダルが表示されます。「おすすめの確認方法」という表示とともに「HTMLファイル」のダウンロードが可能となっていますがこちらは利用せず、今回は「その他の確認方法」から「HTMLタグ」を選択しましょう。ここでは指示通り`<head>`タグ内に表示されているメタタグを追加します。※メタタグ追加後反映に時間がかかる可能性があります。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/next-googleindex3_do8dqq">
<script src="https://gitlab.com/-/snippets/2581834.js"></script>
少し時間を空けてから上の画面で「確認」を押すと所有権の確認が完了し、下のような管理画面に移動できます。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/next-googleindex4_zr9k1y">
管理画面に移動したら、画面左側のナビゲーションから「サイトマップ」をクリックすると「新しいサイトマップの追加」というセクションが表示されるので、ここで`sitemap.xml`と入力し、「送信」ボタンを押してください。「サイトマップを送信しました」というダイアログが表示されたらサイトマップ送信の作業完了です。ダイアログで隠れて見えませんが、「送信されたサイトマップ」のセクションが表示され、ステータスが「成功しました」となっていることが確認できます。


## まとめ
なお、作業完了後すぐにインデックス登録されているわけではないため、この時点でGoogle検索をしても検索結果には表示されないかもしれませんが、気長に待ちましょう。
### 参考
* [Google検索セントラル - Google の検索エンジンの仕組み、検索結果と掲載順位について](https://developers.google.com/search/docs/fundamentals/how-search-works?hl=ja)
* [Google検索セントラル - Google 検索の基本事項](https://developers.google.com/search/docs/essentials?hl=ja)
* [Google検索セントラル - Googleウェブ検索のスパムに関するポリシー](https://developers.google.com/search/docs/essentials/spam-policies?hl=ja)
* [GitHub - next-sitemap](https://github.com/iamvishnusankar/next-sitemap)

Next.jsで作ったWebサイトがGoogleの検索結果に出てこない！？

Googleアナリティクスに蓄積されたデータをPythonで取得してみました。

## はじめに
Googleアナリティクスって使ったことがある人なら分かると思いますが、情報量えげつないですよね（語彙力）。ちょっと情報取得できればと思ってもどこを見たら良いのか分からず、最初はダッシュボードを使いこなすことさえままならないと思います。そんな中個人的には他のツールから取得したデータと組み合わせて別途ダッシュボードを作成したいなと思っていたところでして、調べてみるとPythonからAPIを叩けるんですね。実際に使ってみたので設定方法含めまとめます。なお、以下略称です。
* Googleアナリティクス（以下、GA）：総称
* Google Analytics 4（以下、GA4）：~最新バージョン~現行バージョン
* Universal Analytics（以下、UA）：~現行バージョン~旧バージョン

## 利用するツール
PythonでAPIを叩くために今回は[Google Analytics Data API](https://developers.google.com/analytics/devguides/reporting/data/v1/quickstart-client-libraries?hl=ja)というものを使います。似たライブラリに[Google Analytics Reporting API v4](https://developers.google.com/analytics/devguides/reporting/core/v4?hl=ja)というものがありますが、ドキュメントに記載の通りこちらはUAのみ対応（GA4非対応）のため、今回は利用しません。v4とか記載があるからGA4対応かと勘違いしてしまいますよね。そのUAは2023年7月1日をもって廃止と~なります~ました。お世話になりました。

## API利用
それではAPIを使うための設定をしていきましょう。以下大きく2ステップとなります。
### GA側の設定（1/2）
#### Google Analytics Data API設定
* はじめに[Google Analytics Data API](https://developers.google.com/analytics/devguides/reporting/data/v1/quickstart-client-libraries?hl=en)のページからStep1.の<strong><i>Enable the Google Analytics Data API v1</i></strong>ボタンをクリックするとダイヤログが開かれるので、ここでGoogle Cloud Platform（以下、GCP）上にプロジェクトを新しく作成します。ここでの入力項目はプロジェクト名のみです。<strong><i>Next</i></strong>ボタンから作成後、プロジェクト作成と同時に自動でJSONファイルがダウンロードされます。
#### GA4の設定
* 次にGA4にサービスアカウントを追加します。上でダウンロードしたJSONファイルの中身を確認すると、"client_email"という値が追加されていると思うので、こちらをGA4に追加します。<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/ga4-data-python1_tg3him" /><img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/ga4-data-python2_pgyblg" />
* 上の画像の通り、GA4の対象のプロパティを開いた状態で、[管理] → [プロパティのアクセス管理] → [+ボタン（新規ユーザーにアクセス権限を追加）]（画面右側モーダルの右上あたり）→ [ユーザーを追加] から、<strong><i>client_email</i></strong>キーに対応する値を<strong><i>メールアドレス</i></strong>欄に追加します。同時に<strong><i>直接の役割とデータ制限</i></strong>で権限の選択を求められますが、ここでは閲覧者（<strong><i>Read & Analyze</i></strong>）以上の権限を付与する必要があります。

### ローカル側、Python設定（2/2）
* 続いて、クライアント側でライブラリをインストールします。[Python client library installation guide](https://github.com/googleapis/python-analytics-data#installation)の通り、仮想環境を作成し、その中で
```
pip install google-analytics-data
```
で対象のライブラリをインストールしておきます。
* [公式サイト](https://developers.google.com/analytics/devguides/reporting/data/v1/quickstart-client-libraries?hl=en)のコードを一部改変させていただき、地域別に累計ユーザー数を取得してみましょう。ここから1行解説です。
<script src="https://gitlab.com/-/snippets/2567496.js"></script>
1. (l.2~10)ライブラリ等から必要モジュールのインポート。
2. (l.12~13)別途、.envファイルを作成する。Google Analytics Data API設定時にダウンロードしたJSONファイルから認証情報を設定し、.envファイルに格納。`load_dotenv()`メソッドで環境変数読み込みます。
3. (l.15)対象のGA4のプロパティIDを取得し設定します。
4. (l.17)プロパティIDを引数にGA4情報を抽出する関数を作成します。
5. (l.19)今回は`BetaAnalyticsDataClient`クラスを利用します。`BetaAnalyticsDataClient`では、`runReport`メソッド、`getMetadata`メソッド、`checkCompatibility`メソッド等が提供されています。その中でも今回は`runReport`メソッドを使ってみましょう。他にもいくつかメソッドは提供されていますが、上記3メソッドはそれぞれ以下のような役割を果たします。
    * `runReport()`メソッド：GA4データの取得において最も一般的・汎用的なメソッドです。以下の通りコード例を示すので参考にしてみてください。
    * `getMetadata()`メソッド：データスキーマ・リファレンス情報を取得するためのメソッドです。利用可能なmetrics, dimensions等の詳細情報を取得できます。
    * `checkCompatibility()`メソッド：指定したクエリとパラメータにおいてAPIとの互換性確認するためのメソッドです。
6. (l.21~26)`RunReportRequest()`でリクエストを作成します。22行目〜25行目のパラメータについての説明は以下の通りです。`dimentions`と`metrics`の違いは分かりづらいですが、[Web担当者Forumさんの記事](https://webtan.impress.co.jp/e/2012/06/07/12921)が分かりやすいです。
    * `property `：上で説明したプロパティIDです。
    * `dimensions`：データの属性を指します。これに基づいてグループ化（ソート）ができます。
    * `metrics`：データの指標を指します。集計値・数値になります。
    * `date_ranges`：データを取得する期間です。開始日・終了日を一緒に指定します。
7. (l.27)`RunReportRequest()`で作成したリクエストをrunReport()メソッドに渡すことで、任意のGA4データを取得することができます。
8. (l.30~31)"dimention-metric"で対にして結果を出力します。
9. (l.37~40)結果です。

## まとめ
今回は[`runReport`](https://developers.google.com/analytics/devguides/reporting/data/v1/rest/v1beta/properties/runReport)というメソッドを使いましたが、中でもdimensions, metrics以外にも指定可能なパラメータについては[公式サイト](https://developers.google.com/analytics/devguides/reporting/data/v1/api-schema)に一覧があるので、逐一参照しつつ使いましょう。また[<strong>「GA4 Dimensions & Metrics Explorer」</strong>](https://ga-dev-tools.google/ga4/dimensions-metrics-explorer/)というツールを使えば、利用可能な`dimentions`と`metrics`の組み合わせを確認することができ、さらに、データのレスポンス形式についても事前に確認することができます。

### 参考
* [Google Analytics Data API](https://developers.google.com/analytics/devguides/reporting/data/v1/quickstart-client-libraries?hl=en)
* [Google Analytics Reporting API v4](https://developers.google.com/analytics/devguides/reporting/core/v4?hl=en)
* [googleapis/python-analytics-data - GitHub](https://github.com/googleapis/python-analytics-data#installation)
* [Web担当者Forum - Googleアナリティクスのディメンションと指標（メトリクス）の違い／意味を理解［第9回］](https://webtan.impress.co.jp/e/2012/06/07/12921)

GA4のデータをPythonで取得する。

HerokuのデータベースをDataclipsを使ってJSON出力してみました。

## はじめに
Herokuの無償版が近々使えなくなってしまうので、そろそろやばいと思い一旦データをどこかに出力・保管しておこう、ということでDataclipsを使ってみました。ビボーロクです。

## Dataclips使ってみた。
### Dataclipsとは
一刻も早くJSON出力したいので、ここは[公式](https://devcenter.heroku.com/ja/articles/dataclips)の説明をそのままお借りします。
> Heroku Dataclips を使用すると、Heroku Postgres データベースへの SQL クエリを作成し、その結果を同僚、サードパーティツール、パブリックと共有できます。データクリップの受信者は、そのデータをブラウザで表示できるほか、JSON および CSV 形式でダウンロードすることもできます。

要するに<strong>Herokuのダッシュボード画面からJSON・CSV形式でエクスポートできる機能</strong>ということですね。これは便利。急ぎで使ってみましょう。

### 使い方
Herokuへのログイン後は[Dashboard画面](https://dashboard.heroku.com/apps)が最初に表示されていると思うので、そこからデータクリップを操作できる画面に移動しましょう。まずは[Data画面](https://data.heroku.com/)に移動し任意のアプリケーションのDBを選択、<strong><i>Dataclips</i></strong>タブを選択します。すると<strong><i>Create Dataclip</i></strong>というボタンが現れるのでクリックすると下の画像のような画面が現れます。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/heroku-dataclips-howto1_oduno6">
ほとんどの項目・テーブルがグレーの網掛けでマスクしてあるので見づらくなってしまっていますが、画像上に記載の番号通り選択・記述するだけで任意のデータをエクスポートできます。
* ①・・・データクリップ名を指定します。データクリップ1つに対し、処理は1つ書くことができます。
* ②・・・プルダウンで処理を実行したいDBを選択します。
* ③・・・DB内に存在するテーブル一覧を確認することができます。
* ④・・・SQL文を書く欄です。今回はテーブルを丸ごと出力したかったので、そのように記述しました。
* ⑤・・・④で書いたSQLの結果が表示されます。
* ⑥・・・⑤で表示された結果をエクスポートする際の形式を指定します。JSONとCSVが選択可能です。

これだけ。ほんまに簡単。

### PostgreSQLとの接続
以上で出力の作業は完了していますので、暇があればこの先読んで見てください。
* ここでは、「PostgreSQLをCLIからも操作できるようにしておかないといけないなぁ」とふと思い立ったことから、接続だけできるようにということで設定方法をまとめています。というわけでまずはHerokuのPostgreSQLに接続します。
<script src="https://gitlab.com/-/snippets/2567487.js"></script>
* 早速エラーです。ローカルにPostgreSQLがインストールされている必要があるようですね。ということで親切に[公式ドキュメントのURL](https://devcenter.heroku.com/articles/heroku-postgresql#local-setup)が記載されているので中身を見てみると、[Postgres.app](https://postgresapp.com/)をインストールするように指示があるので、仰せのままに。インストール後はPATHを通すよう指示があるので実行します。
<script src="https://gitlab.com/-/snippets/2567488.js"></script>
* これでパスが通ったはずです。もう一度接続を試みます。
<script src="https://gitlab.com/-/snippets/2567489.js"></script>
* これでCLIで操作できる環境を構築することに成功しました。

## まとめ
Dataclipのおかげで我が子のように大事なデータをとりあえずローカルに保管できました。今後Herokuを使い続けるか他サービスに乗り換えるべきか検討したいです。ただし、いずれにしてもSQLは習得する必要があるので、個人的に勉強しておかないとなぁと思った次第です。今回は<strong>あえて</strong>お試しでテーブル内の全データを出力したかのような書きぶりでしたが、それしかできないだけですので、ここにて報告させていただきます。

### 参考
* [Heroku Dev Center  - データクリップとのクエリ結果の共有](https://devcenter.heroku.com/ja/articles/dataclips)
* [Heroku Dev Center - Heroku Postgres, Local Setup](https://devcenter.heroku.com/articles/heroku-postgresql#local-setup)
* [Postgres.app](https://postgresapp.com/)

HerokuのDataclips使ってみた。

Djangoでの開発時よく使用されるコマンドについて調べました。

## はじめに
Djangoで必ず使用するファイルと言えば？、、、`manage.py`ですよね。これが使えないと話にならないと思います。ではこのファイルを使ったコマンドはいくつ言えますか？、、、`makemigrations`, `migrate`, `runserver`もセットで覚えると思いますが、私だけでしょうか、他は使わないからすぐ忘れてしまうんですよ。山手線ゲームやったら確実に4・5人目で切れますね。そこで今回はコマンドおよびコマンドラインユーティリティの種類・使い方についてまとめました。

## コマンドラインユーティリティ
コマンドラインユーティリティはDjangoプロジェクトを実行するために必要なものです。以下の通り3種類あります。いずれも同じ役割を果たしますが、一番はじめにプロジェクトを作る際には`django-admin`を使用します。
<script src="https://gitlab.com/-/snippets/2566313.js"></script>
* <strong>`django-admin`</strong>：
    * プロジェクト作成時に使用します。
* <strong>`python3 manage.py`</strong>：
    * 最も高頻度で使用されます。
* <strong>`python3 -m django`</strong>：
    * `manage.py`に共に使用することができます。

## コマンド
ここから上記のコマンドユーティリティを使用した頻出コマンドをまとめます。
<script src="https://gitlab.com/-/snippets/2566315.js"></script>
* <strong>`$ django-admin startproject`</strong>：
    * Djangoプロジェクトを作成するためのコマンド。まさにDjangoの根幹（1）。
* <strong>`$ django-admin startapp`</strong>：
    * Djangoアプリケーションを作成するするためのコマンド。まさにDjangoの根幹（2）。
* <strong>`$ python3 manage.py collectstatic`</strong>：
    * HTMLファイル、CSSファイル、画像ファイル等のstaticファイル（静的ファイル / assets）をまとめるためのコマンド。開発環境ではDjangoが自動で管理する一方、本番環境ではこのコマンドでstaticファイルを一つのディレクトリに集めておく。`settings.py`では、STATIC_ROOT, STATIC_URL, STATICFILES_DIRS, STATICFILES_STORAGE等を別途設定する。
* <strong>`$ python3 manage.py changepassword [username]`</strong>：
    * 任意の[username]のパスワードを変更可能。
* <strong>`$ python3 manage.py createsuperuser`</strong>：
    * Djangoの管理サイトにログインし使用するための管理者ユーザーを作成するためのコマンド。ユーザー名、メールアドレス、パスワードを指定する。
* <strong>`$ python3 manage.py dumpdata`</strong>：
    * データベースの内容をバックアップ等の目的でエクスポートするためのコマンド。JSON形式、XML形式等のフォーマットを指定しアプリケーション単位、テーブル単位でエクスポート可能。
* <strong>`$ python3 manage.py help ([command name])`</strong>：
    * 困ったときはこれ。helpと入れるだけで利用可能なコマンドを出力可能。さらに、[command name]を入力すると、そのコマンドのオプション含めた使い方を教えてくれる。
* <strong>`$ python3 manage.py loaddata`</strong>：
    * dumpしたファイルをデータベースにインポートするためのコマンド。例えばJSON形式のファイルをインポートする際には、`loaddata`以降に`sample.json`という形式で指定可能。
* <strong>`$ python3 manage.py makemigrations`</strong>：
    * `models.py`で定義した内容をデータベースに反映させるための、マイグレーションファイルを作成するためのコマンド。
* <strong>`$ python3 manage.py migrate`</strong>：
    * データベースに対して、`makemigrations`で作成したマイグレーションファイルを適用するためのコマンド。
* <strong>`$ python3 manage.py runserver`</strong>：
    * 開発環境用のローカルサーバーを起動するためのコマンド。
* <strong>`$ python3 manage.py showmigrations`</strong>：
    * 作成したマイグレーションファイル一覧を表示するためのコマンド。
* <strong>`$ python3 manage.py test`</strong>：
    * 自動でテストを実行するためのコマンド。テスト内容は`startapp`実行時に自動で作成される`test.py`内に記述する。
* <strong>`$ python3 manage.py testserver`</strong>：
    * テスト用サーバーを起動するためのコマンド。

## helpを使ってできること
このようにコマンドはたーくさんあるんですが、他にもまだまだたくさんあります。実際に`help`を使ってみると、現在インストールされているライブラリに応じて、カテゴリごとに利用可能なコマンドが確認できるので見てみましょう。
<script src="https://gitlab.com/-/snippets/2566316.js"></script>
現在"django-cloudinary-storage"というパッケージが入っているので、`[cloudinary_storage]`で利用可能なコマンドが表示されていることが分かりますね。
では次に、helpの後にコマンドを追加してみます。上でも記載しましたが、`help [command name]`とすることで、各コマンドで利用可能なオプションを簡単に説明してくれます。ここでは`createsuperuser`を入力してみます。
<script src="https://gitlab.com/-/snippets/2566348.js"></script>
すると8行目以降に利用可能なオプションが表示されます。

## まとめ・参考
とりあえず"help"を使おうということだけ言っておきます。