<pre><code>* {
 outline: 1px solid red;
}</code></pre> なんとこれを全体のcssに書くだけ。下記の画像のようにはみ出てる要素が一目瞭然！<img src="https://images.microcms-assets.io/assets/b30d7661c2694503832399a83cea2137/53c8aa53b7174c28bb395fedf0b14963/image.png" alt=""> <code>overflow: hidden</code>をつけて無事修正完了。

みなさんブックマーク必須です

一瞬で原因がわかるcssがある！

スマホ表示で画面が横スクロールする現象の画期的な原因調査方法

とはいえ、自分のマシンで動かすだけの書き捨てスクリプトなら、書き慣れた言語でサクッと作っちゃう方が良いと思います。 僕の場合、メンバーに依頼されて作ることが殆どなので、どんなPCでも動くべきという課題があります。過去にPythonを使ってスクレイピングをしまくってた時期があるので、Pythonが一番サクッと書けるのですが、<blockquote>使うメンバーに、いちいちPythonインストールさせるのはダサすぎない？</blockquote>という問題がありました。 そんな時にGo。バイナリにしちゃえばターミナルで動きます。そしてクロスコンパイルでLinux・Mac・Windowsなんでもこい、強し。方法としても、buildコマンドで実行環境を指定するだけという簡単なもの。（対応している環境もかなり種類があります。よかったら調べてみてください。） これにより、Slack上でバイナリを配布するだけでみんな使えちゃいます。 Goは後発の言語なので、「イマドキ技術でスクレイピングできる」っていう称号も付きます。

クロスコンパイルがいい感じ

言語はGo

スクレイピングを実行するときって、検索ワードを受け入れる必要があるケースが多いです。また、膨大な数のスクレイピングを一気にブン回しちゃうと相手方のサーバーに迷惑をかけることになるので、例えば特定のカテゴリー別に分けて、必要分のデータだけを対象にする必要もあります。 つまり、ターミナル入力の受付を実装する必要があります。 そんな時にSurveyというパッケージが輝きます。<a href="https://github.com/go-survey/survey" target="_blank" rel="noopener noreferrer">go-survey/survey</a> 超簡単に色んなターミナル入力が実装できちゃいます。初めて出会った時は感動しました。。。 Nuxt.jsプロジェクトを立ち上げる<code>npx create-nuxt-app</code>を実行したときに出るような選択式の入力もできて優秀です。（凝った実装をしてるように見えるので、コスパ良く名声を得ることもできます。）<img src="https://images.microcms-assets.io/assets/b30d7661c2694503832399a83cea2137/b3c367c931474500bff81839c9898845/68747470733a2f2f7468756d62732e6766796361742e636f6d2f4772696d46696c746879416d617a6f6e706172726f742d73697a655f726573747269637465642e676966.gif?w=1000&amp;h=179" alt="">

CLIからの入力はSurvey

生のGoでWebサーバー作るときによく使われるアイツです。この<code>net/http</code>パッケージの<code>Client()</code>をスクレイピングで使います。 同じく<code>net/http</code>に入っている<code>cookiejar</code>を併せて使えば、Cookieを持たせることができます。サイトによってはCookieに値を保持できないとリクエストが通らないケースがあるのですが、これで解決です。<pre><code>import (
	"net/http"
 "net/http/cookiejar"
)

func initClient() *http.Client {
		jar, err := cookiejar.New(nil)
		if err != nil {
			log.Fatalln(err)
		}
		return &amp;http.Client{Jar: jar}
}</code></pre>

HTTPクライアントはnet/http

WebAPIから直接JSONとしてレスポンスを受けることができれば、スクレイピングの必要はありません。リクエスト投げて、レスポンスのJSONをGoの構造体にバインドして処理するだけです。（この方法はブラックに近いグレーだと思うけど。） しかし、スクレイピングはHTML形式のレスポンスとの戦い。そんな時にhtmlqueryをよく使います。<a href="https://github.com/antchfx/htmlquery" target="_blank" rel="noopener noreferrer">antchfx/htmlquery</a> レスポンスとして受け取ったHTMLを与えて、そのままHTMLを要素探索するだけです。無駄なくシンプルに、データの取り出しまでを行うことができます。 <a href="https://developer.mozilla.org/ja/docs/Web/XPath" target="_blank" rel="noopener noreferrer">XPath</a>による探索ができるのが有難いです。ブラウザで実際のページで検証しながら、XPathをポチポチ組んでいます。 XPathを使えばハニーポットトラップも回避できます。でも、ハニーポットを仕掛けているサイトはスクレイピングされることを良しとしていないケースが多いので、スクレイピングをする前に、サイトの規約を確認しましょう…！

「Content-Type: text/html」

HTMLパースはhtmlquery

結果として、以下のような構成が出来上がります。至極一般的な構成のような気もしていますが、どうなんでしょうかね？ <ol><li>ターミナル上でGo製のバイナリ実行</li><li><a href="https://github.com/go-survey/survey" target="_blank" rel="noopener noreferrer">Survey</a>でターミナル入力</li><li><a href="https://pkg.go.dev/net/http" target="_blank" rel="noopener noreferrer">net/http</a>のClientでレスポンス受け取り</li><li><a href="https://github.com/antchfx/htmlquery" target="_blank" rel="noopener noreferrer">htmlquery</a>でHTMLから値取得</li><li>CSV形式でファイルを作成して吐き出し</li></ol> （しかしまぁ、そろそろサイトごとに組まずに汎用化しようかな。。）

まとめ

Macにて、Slack上でバイナリを渡したときに出るこれ。検証されていないために、素直には実行できない。<img src="https://images.microcms-assets.io/assets/b30d7661c2694503832399a83cea2137/5c41e2c88a2a4113b7c00492a9ccbb58/image.png?w=350&amp;h=369" alt=""> バイナリに署名とかできるものなのかね？実行する方法はあるから特に調査せず、それで問題なしとしてるけども。良い感じの方法あったらまた記事にします。 読んでいただきありがとうございました！ﾉｼ

課題

Goでスクレイピングするときによく使う構成まとめてみた

みなさん、初めまして！株式会社YOKU 取締役の新井です。 今月からようやくYOKUのメンバーのブログがスタートします。メンバーは全員書いてくれるらしいです！感謝！ 普段、社内Slackのtimesチャンネルで書いてあることをもうちょっと細かく言語化してもらいます。（社内ではGo / TypeScript / AWSを中心に開発をしているのでその辺が中心になるかと！） 今後、最新の技術に関して情報を発信していきますので、よろしくお願いします！

BuildersIO produced by YOKU

スマホ表示で画面が横スクロールする現象の画期的な原因調査方法

Goでスクレイピングするときによく使う構成まとめてみた

YOKUブログ始めました！

機密情報の漏洩を防ごう！～gitleaksの運用方法～

OpenAIとDeeplのAPIを使ってChatGPTのCLIツール作ってみた

単体テストのベストプラクティス