ทำความรู้จักกับ มัลแวร์ไอเฟรม จะได้ไม่ตกเป็นเหยื่อ

HTML <iframe> Tag (Reference)

นิยาม

An inline frame is used to embed another document within the current HTML document.

คือคำสั่ง <iframe> ใช้ในการฝังอะไรซักอย่างไว้ในหน้า html ของเราอีกที

ตัวอย่างการใช้งาน

    <iframe src="http://www.w3schools.com"></iframe>

ซึ่งนับว่าเป็นคำสั่งที่มีประโยชน์ไม่ใช่น้อย เมื่อใช้ในทางที่ถูกต้อง

แต่ก็มีการนำมาใช้ในทางที่ผิด คือเป็นการฝังโค๊ดของหน้าเว็บเพจที่มีมัลแวร์ไว้ในหน้า html

โดยการฝังไว้ตรงๆ ก็คงสังเกตุได้ไม่ยาก แต่ถ้าฝังโค๊ดด้วย JavaScript นี่สิ! ยุ่งเลย

วิธีสังเกตุในโค๊ดว่ามีโค๊ดแปลกปลอมมั๊ย วิธีง่ายๆเลย ให้ดูว่าในโค๊ดมี คำสั่ง JavaScript ต่อไปนี้หรือไม่

<script>
    eval(unescape('xxx'));
</script>

ถ้ามีก็เตรียมใจไว้เลย

โดย ‘xxx’ ในที่นี้คือ uri หรือ url ของหน้าเว็บเพจที่มีมัลแวร์อยู่นั่นเอง

เช่นเข้ารหัส url ด้วยคำสั่ง  escape จะได้ตัวอักษรที่อ่านไม่รู้เรื่อง เช่น

<script>
    document.write(escape("Need tips? Visit W3Schools!"));
</script>

จะได้

    Need%20tips%3F%20Visit%20W3Schools%21

ดูรหัส url ทั้งหมดได้ที่นี่ HTML URL Encoding Reference

เวลาที่ web browser อ่านจึงต้องใช้คำสั่ง unescape  มาถอดรหัส และใช้คำสั่ง eval มาสั่งให้โค๊ดดังกล่าวทำงาน

ถ้าติดเข้าแล้วจะทำยังไง??

นั่งลบเองทีละบรรทัด หรือใช้ FizScript โดยอ่านได้ที่นี่ www.thaiseoboard.com

PHP : การทำ redirect ด้วยฟังก์ชั่น header()

ฟังก์ชั่น header ใช้ได้กับทั้ง (PHP 4, PHP 5) (php.net)

นิยาม header — Send a raw HTTP header

void header ( string $string [, bool $replace = true [, int $http_response_code ]] )

ฟังก์ชั่น header ในภาษา PHP นำมาประยุกต์ใช้ได้หลากหลาย หนึ่งในนั้นคือการทำ redirect

<?php
	header('Location: http://www.phaisarn.com/');
?>

ที่มา : www.devsolution.net

PHP: แสดง thumbnail ของภาพแรกใน Post

นำภาพแรกใน post (ในที่นี้สมมุติข้อความใน post ไว้ใน $post ในบรรทัดที่ 10) มาแสดง (บรรทัดที่ 22)

<!DOCTYPE html>
<html>
<head>
    <meta charset=UTF-8">
    <title>ทดสอบ Create thumbnail</title>
</head>
<body>
<?php 
function catch_that_image() {
	$post = 'some text with two pictures: <img src="http://www.example.com/image1.jpg" /> <img src="http://www.example.com/image2.png" />';
	$first_img = '';
	$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post, $matches);
	$first_img = $matches[1][0];
	/*$second_img = $matches[1][1];*/

	if(empty($first_img)){ //Defines a default image
		$first_img = "/images/default.jpg";
	}
	return $first_img;
}
?>
<p><img src="<?php echo catch_that_image() ?>" width="110"></p>
</body>
</html>

ดัดแปลงโค๊ดมาจาก http://www.wprecipes.com, http://css-tricks.com

สร้างแผนที่ไว้ในเว็บไซต์ ด้วย Google map

กำหนดตำแหน่งของเราให้แสดงในแผนที่ Google Map

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>วิทยาลัยเฉลิมกาญจนา</title>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
         
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
        <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true"></script>
    </head>
    <body>
        <div id="map_canvas" style="background: #f5f5f5; width: 600px; height:550px;"></div>
         
        <script type="text/javascript">

			var ckc_pcb = new google.maps.LatLng( 16.3416218, 101.0902424 );	/* default location*/

            function initialize() {
                var myOptions = {
                    zoom: 12,
                    //center: latlng,
                    mapTypeControl: false,
                    navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
                    mapTypeId: google.maps.MapTypeId.ROADMAP,
					/*center: new google.maps.LatLng(13.741620721743634, 100.53290683890078),*/
					disableDefaultUI: false,
					streetViewControl: false,
					navigationControl: true,
					mapTypeControl: false
                };
                var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
                 
                defaultGeolocation();
                 
                function defaultGeolocation() {
                    map.setCenter(ckc_pcb);
                    setMarker(ckc_pcb);
                }
                 
                function setMarker(initialLatLng) {

					var opts = new Object;
					opts.title = "วิทยาลัยเฉลิมกาญจนาเพชรบูรณ์ เลขที่ 333 หมู่ 8 ตำบลบ้านโตก อำเภอเมือง จังหวัดเพชรบูรณ์ 67000";
					opts.position = initialLatLng;
					opts.map = map;
					var marker = new google.maps.Marker(opts);
                }
            }
             
            $(document).ready(function() {
                initialize();
            });
        </script>
    </body>
</html>

ตัวอย่าง : ckc_map_pcb

แผนที่แสดงตำแหน่งปัจจุบันของคุณใน google map

  1. กำหนดให้ sensor (เช่น GPS) ทำงาน
  2. อ่านตำแหน่งปัจจุบันเพื่อนำมาแสดงบนแผนที่
  3. ถ้าอ่านตำแหน่งปัจจุบันไม่ได้ ให้ใช้ค่า Default (ในที่นี้คือ กรุงเทพ)
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>ทดสอบ geolocation + google map</title>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
         
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
        <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true"></script>
    </head>
    <body>
            ตำแหน่งของฉัน:
        <div id="geo_data"></div>
        <div id="map_canvas" style="background: #f5f5f5; height:300px; width: 300px;"></div>
        <script type="text/javascript">
        var initialLocation;
            var bangkok = new google.maps.LatLng(13.755716, 100.501589);
            function initialize() {
                var myOptions = {
                    zoom: 15,
                    //center: latlng,
                    mapTypeControl: false,
                    navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                var map = new google.maps.Map(document.getElementById("map_canvas"),
                myOptions);
                 
                // detect geolocation lat/lng
                if ( navigator.geolocation ) {
                    navigator.geolocation.getCurrentPosition(function(location) {
                        var location = location.coords;
                        $("#geo_data").html('lat: '+location.latitude+'<br />long: '+location.longitude);
                        initialLocation = new google.maps.LatLng(location.latitude, location.longitude);
                        map.setCenter(initialLocation);
                        setMarker(initialLocation);
                    }, function() {
                        handleNoGeolocation();
                    });
                } else {
                    handleNoGeolocation();
                }
                 
                // no geolocation
                function handleNoGeolocation() {
                    map.setCenter(bangkok);
                    setMarker(bangkok);
                    $("#geo_data").html('lat: 13.755716<br />long: 100.501589');
                }
                 
                // set marker
                function setMarker(initialName) {
                    var marker = new google.maps.Marker({
                        draggable: true,
                        position: initialName,
                        map: map,
                        title: "คุณอยู่ที่นี่."
                    });
                    google.maps.event.addListener(marker, 'dragend', function(event) {
                        $("#geo_data").html('lat: '+marker.getPosition().lat()+'<br />long: '+marker.getPosition().lng());
                    });
                }
            }
             
            $(document).ready(function() {
                initialize();
            });
        </script>
    </body>
</html>

ตัวอย่าง : geo-ggmap
ที่มา : http://www.okvee.net

การระบุพิกัดด้วย HTML5

การระบุพิกัด latitude/longitude ด้วย HTML5 สามารถทำได้โดยการใช้ navigator.geolocation
แต่ความแม่นยำขึ้นอยู่กับอุปกรณ์ที่ใช้เปิดเว็บไซต์ เช่น เปิดจาก PC (ไม่มี GPS) หรือเปิดจากโทรศัพท์มือถืออย่าง Android และ iPhone จะมี GPS ทำให้ระบุพิกัดได้อย่างแม่นยำ

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>ทดสอบ geolocation</title>
		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
    </head>
    <body>
        ตำแหน่งของฉัน:
        <div id="geo_data"></div>
        <script type="text/javascript">
         if ( navigator.geolocation ) {
             // ตรงนี้คือรองรับ geolocation
             navigator.geolocation.getCurrentPosition(function(location) {
                 var location = location.coords;
                 $("#geo_data").html('lat: '+location.latitude+'<br />long: '+location.longitude+'<br /> altitude: '+location.altitude+'<br /> accuracy: '+location.accuracy+'<br /> altitude accuracy: '+location.altitudeAccuracy+'<br /> heading: '+location.heading+'<br /> speed: '+location.speed);
             }, function() {
                 alert('มีปัญหาในการตรวจหาตำแหน่ง');
             });
         } else {
             alert('เบราเซอร์นี้ไม่รองรับ geolocation');
         }
         </script>
    </body>
</html>

ค่าที่ได้จากการเรียกใช้ navigator.geolocation ไม่ได้มีแค่ latitude/longitude ค่าอื่นๆสามารถดูได้ที่ http://dev.w3.org/

ตัวอย่าง : geolocation_html5

ที่มา : http://www.okvee.net/

RSVP

English Today วันนี้เสนอคำว่า RSVP เรามักเจอตัวย่อนี้ตามบัตรเชิญต่าง ๆ หมายถึง “กรุณาตอบกลับด้วย (ว่าจะมาหรือไม่มา)” เพื่อความสะดวกในการจัดงาน คำนี้มาจากภาษาฝรั่งเศสคือ “Répondez s’il vous plaît” (ออกเสียงประมาณว่า “เรปงเด้ ซิลวูเปล”) ถ้าแปลเป็นภาษาอังกฤษก็คือ “Please reply” นั่นเอง

http://www.oknation.net/