サーバーサイドなし・個人情報なしで「近くの道の駅」検索を作った実践ログ ― 位置情報はブラウザの外に出さない

全国の道の駅1,234駅を、都道府県・地図・現在地から探せる「道の駅全国データベース」を公開しました。目玉は「現在地から近い道の駅を探す」のページで、スマートフォンで開いて位置情報を許可すると、近い道の駅5駅を地図と一覧で表示します。

この記事では作り方の細かい手順には踏み込みません。書きたいのは次の2つです。

• サーバー側のプログラムを一切動かさず、利用者の情報も集めない設計にしたこと
• 国土地理院の無料サービスを中心に、有料APIを使わずにここまで作れたこと

※2026年10月時点の情報です。地理院タイルなど各サービスの利用条件は、利用前に各提供元の最新の規約をご確認ください。

最初に決めたのは「サーバーサイドでは何も処理しない」

「現在地から近い順」と聞くと、多くの人が思い浮かべるのは、位置情報をサーバーに送り、サーバーがデータベースを検索して結果を返す流れでしょう。よくある作りですが、今回はこれをやめました。

サーバーに位置情報が届く作りにした時点で、守るべきものが生まれるからです。アクセスログに座標が残るかもしれないし、データベースが攻撃されるかもしれない。プライバシーポリシーに「位置情報の取り扱い」を書き、それを守り続ける義務も出てきます。道の駅を探すだけの機能に、そこまでの責任とコストは見合いません。

そこでサイト全体を「ただのファイル置き場」にしました。HTML・CSS・JavaScriptのファイルをAWSのS3に置き、CloudFrontで配信しているだけです。配信を受け持つサーバーはありますが、決まったファイルをそのまま返すだけで、サーバーサイドで動くプログラムも、データベースも、ログイン機能も、入力フォームもありません。

位置情報はブラウザの外に出さない

では、どうやって近い順を出しているのか。全駅の座標を、最初に全部ブラウザへ渡してしまいます。

全国1,234駅の名前と緯度経度をまとめたファイルは約100KBで、写真1枚より小さいくらいです。ページを開くとこのファイルを読み込み、位置情報の利用が許可されたら、ブラウザの中で現在地から1,234駅すべてまでの距離を計算して近い順に並べます。計算は一瞬で終わります。

この作りなら、位置情報はスマートフォンやパソコンの中で使われるだけで、どこにも送信されません。保存もしません。Cookieにもブラウザの保存領域にも書き込まず、URLにも座標を入れていないので、ページを閉じれば何も残りません。

もう少し細かいところでは、次の3点に気を配りました。

• 位置情報は「高精度モード」をオフにして取得しています（enableHighAccuracy: false）。道の駅を探すのに、GPSで数メートル単位まで測る必要はありません。おおまかな位置で足りますし、電池の消費も抑えられます。
• 位置情報の利用を断っても使えます。地図上の好きな地点を押せば、そこから近い順に探し直します。旅行の計画で「この町の近くで休憩したい」というときにも使えます。
• 経路案内はGoogleマップに任せました。ボタンを押すと、行き先の道の駅の座標だけを付けてGoogleマップを開きます。現在地がGoogleに渡るのは、利用者がGoogleマップを開いたときだけで、このことはページにも注意書きとして載せています。

正直に書いておくと、このサイトには一般的なサイトと同じく、アクセス解析と広告のタグが入っています。ただし、位置情報をそれらに渡すコードはありません。ここは私自身がコードを確認したうえで書いています。

地図は国土地理院の無料サービスで足りた

地図に何を使うかは最初の悩みどころでした。Googleマップの地図APIはきれいで便利ですが、APIキーが必要で、アクセスが増えると課金が発生します。APIキーを持てば、その管理や漏洩対策も必要になります。

選んだのは国土地理院の「地理院タイル」です。地理院地図と同じ地図画像を、出典を明記すれば申請なしで使えます。今回は道の駅のマーカーが見やすいように、色を抑えた「淡色地図」にしました。国の機関が作っている地図なので、道路や地名の情報もしっかりしています。

地図の表示にはオープンソースの地図ライブラリ「Leaflet」を使っています。全国の地図に1,234駅を点で打つと、さすがに画面が埋まります。そこで近くの駅を「数字入りの丸」にまとめて表示し、押すと拡大する仕組み（マーカークラスタ）も入れました。どれも無料です。

国土地理院には、もう1つ助けられたサービスがあります。住所を入れると緯度経度を返してくれる「住所検索」です。これが次に書く座標の問題を解く鍵になりました。

いちばん苦労したのは「駅の正しい位置」

近い順を出すには、全駅の正確な座標が要ります。ここが想像以上に大変でした。

最初はWikipediaの記事に載っている座標を使おうとしました。ところが確認してみると、実際の場所から30km以上ずれている駅が見つかりました。30kmずれると、「近い道の駅」の順番はまるで変わってしまいます。

そこで、座標の決め方を次のように決めました。

1. 全国「道の駅」連絡会の公式サイトに載っている座標を第一候補にする
2. 国土地理院の住所検索で、駅の住所から求めた座標と突き合わせる
3. 2つが3km以上離れていたら、どちらかがおかしいと判断して別の候補を検討する
4. 都道府県の境界から大きく外れる座標は、どの情報源のものでも採用しない

公式の情報と国の住所検索に「答え合わせ」をさせることで、ずれた座標を機械的に見つけられるようになりました。それでも、地図上の位置はあくまで目安です。ページには「公表情報にもとづく目安の位置」と書いています。

外から読み込むファイルも確かめる

サーバーサイドで何も動かさないとしても、ページが外部から読み込むファイルには気を配る必要があります。今回でいえば地図ライブラリのLeafletです。

Leafletは、cdnjsという公開の配信サービスから読み込んでいます。便利な反面、もし配信元のファイルが何者かに書き換えられたら、私のサイトでも不正なプログラムが動いてしまいます。位置情報を扱うページでそれが起きれば、外に出さないはずの現在地が抜き取られかねません。

そこで、読み込むファイルごとに「中身の指紋」（ハッシュ値）をHTMLに書いておきました。ブラウザは読み込んだファイルの指紋を計算し、書いておいた値と一致しなければ実行しません。サブリソース完全性（SRI）と呼ばれる仕組みで、実際のHTMLでは次のような形になります。

<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/leaflet.min.js"
  integrity="sha512-puJW3E/qXDqYp9IfhAI54BJEaWIfloJ7JWs7OeD5i6ruC9JZL1gERT1wjtwXFlh7CjE7ZJ+/vcRZRkIYIb6p4g=="
  crossorigin="anonymous" referrerpolicy="no-referrer" defer></script>

バージョンも1.9.4に固定しているので、ある日突然ライブラリが新しくなって動かなくなる、ということもありません。

地図のデータも、必要なものだけを読み込むようにしました。都道府県のページでは県境の線を地図に重ねていますが、この線のデータは県ごとのファイルに分けてあり、そのページの県の分しか読みません。全駅の座標ファイルはどの地図でも共通ですが、前に書いたとおり約100KBなので、スマートフォンの回線でも待たされることはほとんどありません。

静的サイトならではの落とし穴

運用で1つ引っかかったことがあります。このサイトの配信設定では、データ形式としてよく使うJSONファイルを配信しないようにしていました。非公開のデータを誤って公開しないための安全策です。

そのため、駅の座標データはJSONではなくJavaScriptのファイル（stations.js）として出力することにしました。安全策を外すのではなく、安全策に合わせて作り方のほうを変えたわけです。地味な判断ですが、こういう積み重ねが「事故が起きにくいサイト」につながると考えています。

有料APIはゼロ

使ったものを並べると、有料のAPIは1つも入っていません。

サーバーサイドのプログラムがないので、その運用費もメンテナンスもほぼ発生しません。APIキーがないので、キーの漏洩を心配する必要もありません。費用の面でも安全の面でも、「持たない」ことがいちばん効いています。

なお、約1,300ページ分の文章や生成スクリプトの大半は、AI（Claude Code）に書かせました。人間がやったのは、ここまで書いてきた「何をしないか」を決めることと、出てきた結果の確認です。

割り切ったこと

この作りには、当然できないこともあります。

• 距離は直線距離です。海や山を挟む場所では、実際の道のりと大きく違うことがあります。道路の距離を出すには経路計算のサービスが必要になり、今回の方針と合わないので割り切りました。
• 営業時間や休業日の最新情報は持っていません。お出かけ前に各駅の公式情報を見てもらう前提です。

それでも、「近くに道の駅はあるか」「どっちの方向に何kmくらいか」を知りたい場面には十分だと考えています。

おわりに

位置情報を使うサービスは、つい「サーバーで処理するもの」と考えがちです。でも、データが小さければ、全部ブラウザに渡して計算させるほうが速くて安全です。地図も、国土地理院の無料サービスとオープンソースのライブラリを組み合わせれば、有料APIなしで実用的なものが作れます。

個人情報を集めない、サーバーサイドで何も動かさない。この2つを最初に決めたことで、作るのも運用するのも、ずっと楽になりました。道の駅に限らず、「近くの〇〇を探す」ようなサービスを考えている方の参考になればうれしいです。

確認した資料

• 現在地から近い道の駅を探す — 位置情報の取得設定（高精度モードなし）、Leaflet・markerclusterのSRI指定、地理院タイル（淡色地図）の利用を2026年10月12日に確認。
• 国土地理院 地理院タイル一覧 — 淡色地図を含むタイルの種類と、出典明記による利用条件。
• MDN：サブリソース完全性 — SRIの仕組み。