質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

87.95%

入力フォームのセキュリティ

解決済

回答 3

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 855

score 55

前提・実現したいこと

「Creating a Store Locator on Google Maps」を作成しようとしています。
(google map上で半径を設定して、その半径内の店だけが表示されるしくみ)
半径を計算するため、入力フォームに住所を入力します。
その住所文字列に、サニタイジング・エスケープする必要があるのか、確認したいです。

発生している問題

上記の住所を入力する入力フォームに対して、セキュリティ対策がされているのか分からなく不安です。

不特定多数の方が入力フォームに入力できるため、悪意ある方が悪意あるコードを入力フォームに入力し
クロスサイトスクリプティング(XSS)、クロスサイトリクエストフォージュリ(CSRF)などが実行されてしまわないか、
という不安です。

今回の入力フォームの場合、住所入力文字列に対し、サニタイジング・エスケープする必要があるのかな、という不安でした。

ただ、今回は、"searchButton"をクリックすることで、addressに、住所文字列を挿入するだけの仕組みなので、
住所文字列に対するサニタイジング・エスケープを考える必要はないという事になるのでしょうか?

初心者で、また、的を得ないことを述べていたら、また、スイマセン、、、

※
以前、google apiでのサンプルコードに対して、ざっくり感を感じた事があり、
google api様様と何でも(入力文字列のセキュリティも)崇めることはできないかな、
との思いがあり、今回、入力の文字列へのセキュリティが気になりました。

(google apiのサンプルコードざっくり感)
 同一ページの下記サンプルコードで、mysqli_*関数を使わず古いmysql_*の関数が使われていて、
エラーが出まくり、戸惑ったことがありました。
(google apiのサンプルコードの更新日が2019/5/16なのに)

<?php
require("phpsqlsearch_dbinfo.php");
// Get parameters from URL
・
・
・
// Opens a connection to a mySQL server
$connection=mysql_connect (localhost, $username, $password);
if (!$connection) {
die("Not connected : " . mysql_error());
}
// Set the active mySQL database
$db_selected = mysql_select_db($database, $connection);
if (!$db_selected) {
die ("Can\'t use db : " . mysql_error());
}
// Search the rows in the markers table

該当のソースコード

https://developers.google.com/maps/solutions/store-locator/clothing-store-locator

上記サイトの該当部分の抜粋

<!DOCTYPE html >
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <title>Creating a Store Locator on Google Maps</title>
  <style>
    /* Always set the map height explicitly to define the size of the div
     * element that contains the map. */
    #map {
      height: 100%;
    }
    /* Optional: Makes the sample page fill the window. */
    html, body {
      height: 100%;
      margin: 0;
      padding: 0;
    }
 </style>
  </head>
  <body style="margin:0px; padding:0px;" onload="initMap()">
    <div>
         <label for="raddressInput">Search location:</label>
         <input type="text" id="addressInput" size="15"/>  <!-- ここが、住所入力箇所-->
        <label for="radiusSelect">Radius:</label>
        <select id="radiusSelect" label="Radius">
          <option value="50" selected>50 kms</option>
          <option value="30">30 kms</option>
          <option value="20">20 kms</option>
          <option value="10">10 kms</option>
        </select>

        <input type="button" id="searchButton" value="Search"/> <!-- ここが、検索ボタン-->
    </div>
    <div><select id="locationSelect" style="width: 10%; visibility: hidden"></select></div>
    <div id="map" style="width: 100%; height: 90%"></div>
    <script>
      var map;
      var markers = [];
      var infoWindow;
      var locationSelect;

        function initMap() {
          var sydney = {lat: -33.863276, lng: 151.107977};
          map = new google.maps.Map(document.getElementById('map'), {
            center: sydney,
            zoom: 11,
            mapTypeId: 'roadmap',
            mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}
          });
          infoWindow = new google.maps.InfoWindow();

          searchButton = document.getElementById("searchButton").onclick = searchLocations; <!-- 検索ボタンがクリックされるとsearchLocationsを実行-->

          locationSelect = document.getElementById("locationSelect");
          locationSelect.onchange = function() {
            var markerNum = locationSelect.options[locationSelect.selectedIndex].value;
            if (markerNum != "none"){
              google.maps.event.trigger(markers[markerNum], 'click');
            }
          };
        }

       function searchLocations() {
         var address = document.getElementById("addressInput").value;  <!-- 住所を取得-->

         var geocoder = new google.maps.Geocoder();
         geocoder.geocode({address: address}, function(results, status) {
           if (status == google.maps.GeocoderStatus.OK) {
            searchLocationsNear(results[0].geometry.location);
           } else {
             alert(address + ' not found'); <!-- 取得した住所の緯度経度を計算-->
           }
         });
       }    
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • dreamers

    2019/08/17 15:32

    「コメント欄はデフォルト非表示です」
    の意味は、コメント欄は、通常状態では、非表示になっている、という意味なのでしょうか?

    キャンセル

  • m.ts10806

    2019/08/17 15:41 編集

    はい。コメントの件数だけ表示されていてクリックしてようやく中を確認できます(それも最初は最新3件のみ)
    それに「質問への追記修正依頼」なので、質問本文に編集して返すのが通例です。

    キャンセル

  • dreamers

    2019/08/17 15:50

    ありがとうございます

    キャンセル

回答 3

+1

同一ページの下記サンプルコードで、mysqli_*関数を使わず古いmysql_*の関数が使われていて、
エラーが出まくり、戸惑ったことがありました。

懸念されている通り、PHP7環境ではそもそも動かないコードなのでその部分は修正しておいたほうが良いでしょうね。
mysqliへ、というよりPDOへ。

「PHP7対応」を謳う書籍にも似たようなところはあります。「PHP7ではこう書けるよ!」という紹介のみで根っこは古いコードとか「PHP7移行では廃止されています」という注意書だけとか。

ロジックのみ参考にして細かいところは環境に合わせた機能に差し替えましょう。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/08/17 16:22

    本題からそれるかもしれませんが、mysqliが使いやすく(mysqlとほぼ同じ)、mysqliで書き直し運用してます。
    mysqli、より、PDO、を選択すべきなのでしょうか、
    mysqli、は今後廃止され、PDO、が生きていく、、、などとかの理由でしょうか?

    キャンセル

  • 2019/08/17 18:53

    というより、案外そのまま移植できないので、書式としては安定しているPDOを使うのが通例となってますね。過去質問も参考にしてください。
    https://teratail.com/questions/40450

    キャンセル

0

基本的には質問者さんではなくGoogleが対処しています。しかし、掲示板+GoogleMAPとかだったらXSS対策としてエスケープが必要です。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/08/17 14:05 編集

    掲示板+GoogleMAP とは、掲示板の中にgoogleMAPが埋め込まれている状態、ということになるのでしょうか、

    キャンセル

  • 2019/08/17 14:20

    まあイレギュラーな例だと思いますがそうですね。
    正しくは掲示板自体にエスケープ処理が必要なのですが、、、

    キャンセル

  • 2019/08/17 14:23

    iframeで、サイト上にgoogleMAPを表示している場合はどうなるのでしょうか、

    キャンセル

  • 2019/08/17 14:25

    どっちかっていうとフォームでどのような値を入力されるのが正しくて入力された値をどうするかによります。

    キャンセル

checkベストアンサー

-1

常識的に考えてGoogleが提供しているサービスで
セキュリティ対策がされていないということはないので
初心者ならそこまで考えなくて良いです。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 87.95%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る