PC�̃u���E�U�𗘗p���Ĉʒu�����擾���Ă݂悤�BIP�A�h���X��Wi-Fi�̓d�g���x�𗘗p�������@��Google Maps��JSONP�̊O���T�[�r�X�Ƃ̘A�g���@����������
�@����́APC�̃u���E�U�𗘗p���Ĉʒu�����擾���邽�߂̋�̓I�Ȏ������@�ɂ��āA�\�[�X�R�[�h�𒆐S�ɐ������Ă����܂��B�O���ł�IP�A�h���X�𗘗p�������@�ɂ��āA�㔼�ł�Wi-Fi�̓d�g���x�𗘗p�������@�ɂ��Ă��ꂼ�������܂��B�܂��AGoogle Maps��JSONP�iJSON with padding�j�𗘗p�����A�O���T�[�r�X�Ƃ̘A�g�ɂ��Ă��G��܂��B�Ȃ��A�������\�[�X�R�[�h��lj�����`�Ő������Ă����܂��̂ŁA�擪���珇�ɓǂݐi�߂Ă��������B
�@�O��u�ʒu�����擾����d�g���v�ŐG�ꂽ�悤�ɁA���p�҂�PC�Ɋ��蓖�Ă�ꂽIP�A�h���X���猻�݈ʒu�𐄒�ł��܂��B���̕��@�̓����͎��̂Ƃ���ł��B
�@�]���āA���̕��@�́A�u�ʒu��Ȃ��Ă��\��Ȃ����A��܂��Ȓn��������Α����͗L�p�v�Ƃ������p�r�ɓK���Ă��܂��BIP�A�h���X�𗘗p�����ʒu���̎擾�T�[�r�X�ɂ͂��܂��܂Ȃ��̂�����܂����A����́AGoogle AJAX API��google.loader.ClientLocation���Ɏ��AIP �A�h���X����ʒu�����擾���Ă݂܂��傤�B����API�ł́A�ܓx�E�o�x�̂ق��A�����A�s���{�����A�s�������Ȃǂ��擾�ł��܂��̂ŁA�����Ď擾���Ă݂܂��B
�@Google AJAX API�𗘗p���邽�߂ɂ́A���炩����Web�T�C�g��URL�ɑΉ�����API�L�[���擾����K�v������܂��B�܂��A�ȉ��̎菇��API�L�[���擾���Ă��������B
�@����ł� Google API�𗘗p����IP�A�h���X����ʒu�����擾���Ă݂܂��傤�B�ȉ��ɊȒP�ȃT���v�����L�q���܂����B�{�\�[�X�R�[�h�́AInternet Explorer 8�A Firefox 3.0.10�ł̓�����m�F���Ă��܂��B
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>IP�A�h���X����ʒu�����擾</title> <script type="text/javascript" src="https://www.google.com/jsapi?key=APIkey"></script> <script type="text/javascript"> <!-- google.load("maps", "2", {"language" : "ja_JP"}); function getLocation() { // Google API �̗��p var cl = google.loader.ClientLocation; var message = ""; if(cl !== null){ message = "* �ʒu���̎擾�ɐ������܂��� *"; // HTML�\���̍X�V document.getElementById("latitude").innerHTML = cl.latitude; document.getElementById("longitude").innerHTML = cl.longitude; document.getElementById("country_code").innerHTML = cl.address.country_code; document.getElementById("country").innerHTML = cl.address.country; document.getElementById("region").innerHTML = cl.address.region; document.getElementById("city").innerHTML = cl.address.city; }else{ message = "* �ʒu���̎擾�Ɏ��s���܂��� *"; } document.getElementById("message").innerHTML = message; } google.setOnLoadCallback(getLocation); //--> </script> </head> <body> <h2>IP�A�h���X����ʒu�����擾</h2> Google API�𗘗p���āAIP�A�h���X����ʒu�����擾����T���v���ł��B<br> API�̏ڍׂ́A <a href="http://code.google.com/intl/ja/apis/ajax/documentation/">http://code.google.com/intl/ja/apis/ajax/documentation/</a> �Ŋm�F�ł��܂��B <hr> <div id="message">�l�b�g���[�N�ɐڑ�����Ă��Ȃ��� JavaScript ���L���ł͂���܂���</div> <table summary="�擾�����ʒu���"> <tr><td>�ܓx:</td><td id="latitude">--</td></tr> <tr><td>�o�x:</td><td id="longitude">--</td></tr> <tr><td>ISO 3166-1 �̍����R�[�h:</td><td id="country_code">--</td></tr> <tr><td>����:</td><td id="country">--</td></tr> <tr><td>�e���ŗL�̒n�於:</td><td id="region">--</td></tr> <tr><td>�s�s��:</td><td id="city">--</td></tr> </table> <hr> </body> </html>
�@��L�̃\�[�X�R�[�h�̓�����m�F����ꍇ�ɂ́A�����R�[�h��UTF-8�ŕۑ����Ă��������B
�@����ł́A���Ɍ��Ă����܂��傤�B
8�`11�s�ځF�܂��AGoogle API��ǂݍ��݂܂��B �uAPIkey�v�̕����́A��قǎ擾����API�L�[�ɒu�������Ă��������B
<script type="text/javascript" src="https://www.google.com/jsapi?key=APIkey"></script><script type="text/javascript"><!--google.load("maps", "2", {"language" : "ja_JP"});
13�`15�s�ځF JavaScript�̃R�[�h���L�q���Ă����܂��B�����ł͈ʒu�擾������ getLocation() �Ƃ��܂����B
function getLocation() { // Google API �̗��p var cl = google.loader.ClientLocation;
�@Google API�̈ʒu���擾�I�u�W�F�N�g�́Agoogle.loader.ClientLocation�Ŏ擾�ł��܂��B�擾�ł�����e�͈ȉ��̂Ƃ���ł��B
API | �擾�ł����� |
---|---|
ClientLocation.latitude | �ܓx�i��: 35.678�j |
ClientLocation.longitude | �o�x�i��: 135.678�j |
ClientLocation.address.city | �s�s���i��: ���l�s�j |
ClientLocation.address.country | �����i��: Japan�j |
ClientLocation.address.country_code | ISO 3166-1 �̍����R�[�h�i��: JP�j |
ClientLocation.address.region | �e���ŗL�̒n�於�i��: �_�ސ쌧�j |
16�`18�s�ځF���炩�̗��R�ňʒu��擾�ł��Ȃ������ꍇ�ɂ́Agoogle.loader.ClientLocation �̒l�icl�j��null�ƂȂ�܂��B����𗘗p���āA���b�Z�[�W���ւ���悤�ɂ��܂��B
�@�@�@�@var message = ""; �@�@�@�@if(cl !== null){ �@�@�@�@�@�@message = "* �ʒu���̎擾�ɐ������܂��� *";
19�`25�s�ځF�����ł́A����ꂽ�ʒu����HTML�ɔ��f���鏈�����L�q���Ă��܂��BHTML�Ƃ�id�Ŋ֘A�t���Ă��܂��B
�@�@ // HTML�\���̍X�V document.getElementById("latitude").innerHTML = cl.latitude; ("longitude").innerHTML = cl.longitude; document.getElementById("c�@ountry_code").innerHTML = cl.address.country_code; document.getElementById("country").innerHTML = cl.address.country; document.getElementById("region").innerHTML = cl.address.region; document.getElementById("city").innerHTML = cl.address.city;
43�`48�s�ځF19�`25�s�ڂ̊֘A�t���ɂ��A�ʒu��擾�ł���ƁAHTML�̈ȉ��̕����ɂ��ꂼ��̒l���ݒ肳��܂��B
<tr><td>�ܓx:</td><td id="latitude">--</td></tr> <tr><td>�o�x:</td><td id="longitude">--</td></tr> <tr><td>ISO 3166-1 �̍����R�[�h:</td><td id="country_code">--</td></tr> <tr><td>����:</td><td id="country">--</td></tr> <tr><td>�e���ŗL�̒n�於:</td><td id="region">--</td></tr> <tr><td>�s�s��:</td><td id="city">--</td></tr>
26�`29�s�ځF�ʒu��擾�ł������ǂ����̃��b�Z�[�W��ݒ肵�Ă��܂��B
�@�@ }else{ message = "* �ʒu���̎擾�Ɏ��s���܂��� *"; �@�@ } �@�@document.getElementById("message").innerHTML = message;
�@41�s�ځF29�s�ڂ̏����ɂ��A���L�̕����̃��b�Z�[�W���ύX����܂��B
<div id="message">�l�b�g���[�N�ɐڑ�����Ă��Ȃ��� JavaScript ���L���ł͂���܂���</div>
32�s�ځF�Ō�ɁAgoogle.setOnLoadCallback�𗘗p���āAGoogle API�̏�����������������A13�s�ڈȍ~�ɋL�q������(getLocation)���Ăяo���悤�ɂ��܂��B
google.setOnLoadCallback(getLocation);
�@��L�̂悤�ɁA��r�I�P���ȏ�����IP�A�h���X����ʒu��擾�ł��܂����B
Copyright © ITmedia, Inc. All Rights Reserved.