
ゲーム攻略サイトをとってきたい
Webページ取得をためしてみた
ゲームのキャラ情報は攻略サイトに載っていて、
・どんなキャラがいるか
・それらのキャラの名前や特性(攻撃力だとか回復量、スキル効果)
が細かく載っている。
なので、それらを自動でひっぱってこれたら、わざわざ入力して保存する必要がないなと思った。
検証その1
AIにWebページの内容を取得する方法を教えてもらった。
方法自体は簡単だが失敗するとのことで、本当なのか試してみた。
try {
const response = await fetch(`ゲーム攻略サイトのWebアドレス`)
} catch (error) {
console.log(error)
}結果はAIがいうとおりで失敗で終わる。
こういうのは「CORS」という仕様で、ブラウザの通常モードでは回避できない仕組みらしい。
回避策の模索
どうしたら回避できそうかをAIに聞いてみた。
もっとも一般的かつ安全な解決策は
①サーバー側でCORSを許可する、または
②開発用プロキシ(Proxy)を利用する方法
です。
②のイメージ
【ブラウザ】(localhost)
│ ▲
│ │ ❶「同じlocalhost内」だから
▼ │ CORSエラーにならない!(⭕️)
【開発サーバーのプロキシ機能】(localhost)
│ ▲
│ │ ❷「サーバー同士」の通信だから
▼ │ そもそもCORSのルールが適用されない!(⭕️)
【外部API】(://example.com)
具体的にどうしたらいいのか?
AIに教えてもらった回答を素直に受け取ると、なんだか専用のPCみたいなのを用意する必要がありそうだが、そういう必要はなく、とにかくブラウザから取得する方法を諦めたらいいという結論で。
代わりの策として、ブラウザを動かしているOS上で取得すればいいことにしようと思った。
その策として、「curl」コマンドを実行してみた。
検証その2
わたくしのPC環境はWinなので、コマンドプロンプトを開いて、とりあえず動かしてみた。
web>curl -help
Usage: curl [options...] <url>
-d, --data <data> HTTP POST data
-f, --fail Fail fast with no output on HTTP errors
-h, --help <subject> Get help for commands
~~~以降、使い方の簡単な説明※「curl -help」の部分を入力した
結果のヘルプ情報だと単にURLを指定し実行すればいいとのこと。
簡単に使うなら、これだけで目的を達成できる(と思った)。
以下、実験結果。
web>curl ゲーム攻略サイトのWebアドレス
<!DOCTYPE html><html lang="ja"><head><meta charset="utf-8" />
~~~(html内容)
</body></html>しっかりHTML内容を取得出来たので、取得内容をファイル保存しWebアプリで利用することにした。
めでたし! ^^) _旦~~