วันอาทิตย์ที่ 27 มิถุนายน พ.ศ. 2564

ค้นหา UDID บนอุปกรณ์มือถือ ไอโฟน(iphone) หรือ ไอแพด(ipad)

กลายเป็นเรื่องไม่เป็นเรื่องกันอีกครั้ง เมื่อต้องทำการค้นหาหมายเลขเครื่อง UDID บนอุปกรณ์มือถือ ไอโฟนหรือไอแพดกัน เพราะว่าต้องใช้เพื่อลงทะเบียน Devices สำหรับการพัฒนาของ Apple Developer ค้นหาหลายเอกสารพบว่า เอกสารแรกให้ติดตั้ง iTunes  หรือค้นหาจาก Device manager บนวินโดร์ หากเรื่องนี้เรามีอุปกรณ์ MacOS คงไม่มีปัญหาใด ๆ ทั้งสิ้น แต่เราเป็นเครื่อง Windows ทำให้การทำงานเรื่องนี้เป็นสิ่งยุ่งยากมาก 

เพื่อเป็นการไม่เสียเวลาไปกว่านี้ ผู้เขียนขอแนะนำวิธีง่าย ๆเลยก็แล้วกัน ให้ติดตั้งโปรแกรม iFunbox จากนั้นก็เปิดไปดูรายละเอียดอุปกรณ์ เพื่อดูค่าหมายเลข UDID ตามตัวอย่างในรูป

                รูปแสดงการอ่านค่าหมายเลข UDID บนอุปกรณ์ไอแพด 7 โดยใช้เครื่องวินโดร์

 สำหรับเนื้อหาในวันนี้คงไม่มีอะไรไปกว่าการแนะนำเครื่องมือสำหรับ Windows 10 ในการค้นหาหมายเลข UDID บนอุปกรณ์ไอโฟน หรือ ไอแพด กัน บางทีการทำงานบางครั้งเราต้องแข่งขันกันกับเวลา ปรากฏว่าติดปัญหาหนึ่งเรื่องอาจทำให้เราเสียเวลาไปหลายชั่วโมงในการค้นหา ก็เป็นเรื่องที่ต้องมีการแนะนำกัน ฝากไว้ด้วยสำหรับการพัฒนาระบบ แอปเรียกรถ บนอุปกรณ์ไอโอเอส ของแวนวีไอพี ที่กำลังอยู่ในช่วงของการคอมไพล์บนเครื่องแมคโอเอส คิดว่าคงไม่นานเกินไป   


 

วันอาทิตย์ที่ 20 มิถุนายน พ.ศ. 2564

ใช้งานคุ๊กกี้(cookies)กัน ทำเรื่องเหลือเชื่อให้เป็นสิ่งเป็นไปได้

ก่อนอื่นมาทำความรู้จักกับคุ๊กกี้กันก่อน คุ๊กกี้เป็นไฟล์ข้อมูลแบบตัวอักษรเล็กๆ ที่จัดเก็บบนฝั่งเครื่องลูก เช่นหากเราใช้เวบบราวเซอร์เปิดเวบไซต์ หากฝั่งเซิร์ฟเวอร์เขียนโปรแกรมให้จัดเก็บคุ๊กกี้ไว้ หากเราเข้าไปใช้งานซ้ำยังเวบไซต์เดิมอีกครั้ง ฝั่งเซิร์ฟเวอร์ก็จะทราบและแสดงคำพูดต้องรับ "ยินดีที่กลับมาเยี่ยมเยียนกันอีกครั้ง"

พอเราเห็นประโยชน์ของคุ๊กกี้กันแล้ว ที่นี้มาดูงานของผู้เขียนว่าทำไมต้องใช้ประโยชน์ในเรื่องนี้ โจทย์ก็คือเมื่อเครื่องลูกเข้ามาครั้งแรกให้ไปเปิดหน้ารับค่า url สำหรับทำการรีไดเรค(redirect) ไปยังเวบอื่น

ตัวอย่างการใช้งานคุ๊กกี้

ตามตัวอย่าง หากเครื่องลูกเข้ามาครั้งแรก ก็จะผลักให้เข้าไปหน้าป้อนค่า url หรือ landing.html เพื่อกำหนดว่าจะไปยังไซต์ 1 หรือไซต์อื่น ๆ ตามที่ต้องการ หากเครื่องลูกเครื่องเดิมเข้ามาที่หน้าคุ๊กกี้อีกครั้งคราวนี้ไม่ต้องเข้ามาหน้า landing.html แล้วให้ทำการเปลี่ยนหน้า(redirect)ไปยังไซต์ที่ได้ป้อนข้อมูลไว้เพียงครั้งแรกเลย เราไปเริ่มต้นกันเลย

ขั้นตอนที่ 1 สร้างไฟล์ landing.html เอาไว้สำหรับรับค่าเท็กบ็อก(textbox)เมื่อเครื่องลูกป้อนข้อมูลเรียบร้อยแล้วจะได้ทำการเปลี่ยนหน้าไปยังไซต์ที่ต้องการ 


<!DOCTYPE html>
<html lang="en">
<head>
<title>GPS-Vehicle Tracking system</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

<script language="javascript" type="text/javascript">
function buttonClick(){
var url = document.getElementById("inputURL").value;
setCookie("redirectUrl", url, 30);
window.location = url;
}
function setCookie(cname,cvalue,exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires=" + d.toGMTString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}

</script>
</head>
<body>
<div class="container">
<div class="jumbotron">
<h1>GPS-VEHICLE Tracking Login:</h1>
<p>The best gps tracking system in Thailand!</p>
</div>
<div class="row">
<label style="font-size:12pt;" for="lname">Edit URL:</label>
<input style="width:100%;font-size:12pt;"type="text" id="inputURL" name="inputURL" value="http://tavl2.gps-vehicle.com/gpsvehicleserver"><br>
<input style="font-size:12pt;"type="button" value="click" OnClick="buttonClick()"/>
</div>
</div>

</body>
</html>

 

ขั้นตอนที่ 2 สร้างไฟล์ index.html หรือหน้าคุ๊กกี้ หน้านี้จะทำการตรวจสอบว่าเคยเข้ามาไหม หากเคยเข้ามาแล้วให้ดึงข้อมูลคุ๊กกี้ขี้นมาแล้วทำการเปลี่ยนหน้าไปเลย แต่หากยังไม่เคยเข้ามาก็ให้ย้อนกลับไปหน้า landing.html ก่อน

<!DOCTYPE html>
<html>
<head>
<script>
function setCookie(cname,cvalue,exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires=" + d.toGMTString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}

function getCookie(cname) {
var name = cname + "=";
var decodedCookie = decodeURIComponent(document.cookie);
var ca = decodedCookie.split(';');
for(var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}

function checkCookie() {
var theUrl=getCookie("redirectUrl");
if (theUrl != "") {
//alert("Welcome again " + theUrl);
window.location.href = theUrl;
} else {
theUrl = "http://tavl2.gps-vehicle.com/gpsvehicleserver";
if (theUrl != "" && theUrl != null) {
//setCookie("redirectUrl", theUrl, 30);
window.location.href = "landing.html";
}
}
}
</script>
</head>

<body onload="checkCookie()"></body>

</html>

 

จากการทดลองของผู้เขียน ระบบก็สามารถทำงานได้ตามที่เราต้องการ แต่จะมีข้อผิดพลาดอยู่บ้างเช่น หากป้อนข้อมูล url ผิดในครั้งแรกครั้งต่อไปก็ไม่สามารถเข้าไปหน้านั้นได้แล้ว ยกเว้นรู้ว่าต้องพิมพ์หน้า landing.html ต่อท้ายไปด้วยอย่างนี้ก็สามารถแก้ไขหน้าที่ผิดพลาดได้ ขอบคุณพื้นที่เวบไซด์ดีๆ จากบริการ GPS ติดตามรถ สินค้าดีมีคุณภาพ ราคาถูกกว่าที่อื่นๆ พลาดไม่ได้ด้วยประการทั้งปวง เลือกจีพีเอสไทย





วันอาทิตย์ที่ 13 มิถุนายน พ.ศ. 2564

Flutter เริ่มต้นดีก็ไปได้สวย หลังจากเริ่มประสบความสำเร็จในการรัน Flutter แรกได้สำเร็จเรามาดูกันเลย


 

Flutter เริ่มต้นดีก็ไปได้สวย หลังจากเริ่มประสบความสำเร็จในการรัน Flutter แรกได้สำเร็จเรามาดูกันเลย สิ่งที่เราต้องรู้จัก PATH อยู่ไหนเพื่อจะกำหนดค่าให้  ENV มองเห็น การติดต่อกับอุปกรณ์ Emulators, ตำแหน่งของโปรแกรม JAVA ,ตำแหน่งของ Android Studio SDK เป็นต้น ว่าเทคนิคขั้นตอนมันยุ่งยากมากอย่างไรกัน ขอบอกเลยว่ายุ่งยากมากของจริง


ขั้นตอนที่ 1 เป็นการติดตั้ง Flutter ก็ดาวน์โหลดตามลิงค์ที่แปะไว้ให้จากนั้น ก็แตกไฟล์ไปยังโฟลเดอร์ที่ต้องการ https://storage.googleapis.com/flutter_infra_release/releases/stable/windows/flutter_windows_2.2.2-stable.zip


ขั้นตอนที่ 2 ติดตั้ง Android Studio เพื่อให้โปรแกรม Flutter เชื่อมต่อกับ Android Studio และ Android toolchain


ขั้นตอนที่ 3 ติดตั้ง Visual Studio เพื่อให้โปรแกรม Flutter เชื่อมต่อกับ Visual Studio ได้ ขั้นตอนนี้ก็สำคัญและใช้เวลามาก ต้องเลือก Desktop C++ ขณะติดตั้ง


ขั้นตอนที่ 4 ติดตั้ง Emulator devices เพื่อติดต่อกับอุปกรณ์สำหรับทดสอบการทำงาน ขั้นตอนนี้ต้องใช้ Android Studio สร้างขึ้นมา และต้องไปกำหนดค่า Images แบบ Cold Boot ไม่เช่นนั้นจะมีปัญหาการติดต่อกับโปรแกรม Flutter

ทั้งหมดทั้งปวงก็ขอให้โชคดี สำคัญกว่านั้น Android Studio ไม่สามารถรันโปรแกรมทดสอบตามตัวอย่างได้ด้วย งานนี้ต้องพึ่งพา CLI ผสมกันไป 

E:\Android\Projects>flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel master, 2.3.0-17.0.pre.337, on Microsoft Windows [Version 10.0.19041.1052], locale th-TH)
[√] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
[√] Chrome - develop for the web
[√] Visual Studio - develop for Windows (Visual Studio Community 2019 16.10.1)
[√] Android Studio (version 4.2.0)
[√] Connected device (4 available)



ขั้นตอนที่ 5 สร้างโปรแกรมแรกสำหรับทดสอบ Flutter กัน ไปเริ่มต้นที่ CLI ดีที่สุด

flutter create myapp
cd myapp

 


ขั้นตอนที่ 6 ก่อนจะรันโปรแกรมได้ ต้องไปเปิดใช้งาน Emulator ก่อน

flutter emulators
E:\Android\Projects\myapp>flutter emulators
1 available emulator:

Pixel_2_API_30 • Pixel 2 API 30 • Google • android

To run an emulator, run 'flutter emulators --launch <emulator id>'.
To create a new emulator, run 'flutter emulators --create [--name xyz]'.

 


ขั้นตอนที่ 7 การเรียกเปิดใช้งาน Emulator ต้องมือไวพอควร ในการเลือกอนุญาต Allow USB debugging? ทำไม่ทันก็ต้องกลับไปเริ่มต้นใหม่ สำคัญทีเดียวต้องกำหนด

อิมเมจที่จะเปิดใช้งานเป็นแบบ Cold Boot เท่านั้น หากตั้งแบบ Warm Boot รับรองปัญหาไม่รู้จักจบสิ้น ยืนยัน

flutter emulators --launch Pixel_2_API_30




ขั้นตอนที่ 8 ตรวจสอบว่ามี Emulators ตัวใดบ้างพร้อมทำงานได้

E:\Android\Projects\myapp>flutter devices
5 connected devices:

sdk gphone x86 (mobile) • emulator-5554 • android-x86     • Android 11 (API 30) (emulator)
Windows (desktop)       • windows       • windows-x64     • Microsoft Windows [Version 10.0.19041.1052]
Windows (UWP) (desktop) • winuwp        • windows-uwp-x64 •
Chrome (web)            • chrome        • web-javascript  • Google Chrome 91.0.4472.77
Edge (web)              • edge          • web-javascript  • Microsoft Edge 91.0.864.48

 


ขั้นตอนที่ 9 บรรทัดบนสุดจะพบว่ามี sdk gphone x86(mobile) พร้อมใช้งาน แต่การจะเรียกใช้ได้ต้องใช้คอลัมภ์ที่ 2 เลือก "emulator-5554" แล้วเริ่มรันโปรแกรมกันเลย

flutter run -d "emulator-5554"

 


จากนั้นจะเห็นผลลัพธ์ของโปรแกรมตัวอย่าง ตามรูปแรกที่แสดงนี้เลย ฟังดูเหมือนง่าย ๆ แต่ไม่ง่ายเวลาทำจริง แต่อย่างไรก็แล้วแต่ ปัญหาที่ผู้เขียนพบเจอก็คืออย่าพยายามใช้การรันบนเครื่องมือ Android Studio เด็ดขาด หมดเวลาไปตามแก้หลายๆ วันก็ไม่สำเร็จ รันบนคอมมานไลน์ ง่ายๆ รวดเร็ว สำเร็จแน่นอนครับ สุดท้ายฝากแนะนำเวบไซต์ Toyota Majesty เช่า ขับเอง ได้บริการดีๆ จากแวนวีไอพี เตรียมเอกสารเพียงแค่ บัตรประชาชน ใบขับขี่และบัตรเครดิต จะเดินทางไปไหนเป็นหมู่คณะสะดวกปลอดภัย

วันพุธที่ 2 มิถุนายน พ.ศ. 2564

Yii Framework V1 เฟรมเวิร์คสำหรับ PHP5.3.1-7.4 มาลองกันฟังดูไม่น่ายาก

ผู้เขียนมีโจทย์ใหม่ต้องติดตั้งระบบที่ทำงานด้วย PHP + MYSQL + Framework Yii Version 1 ฟังดูไม่น่ายาก ใช้เวลาหมดเป็นวัน ๆ ไม่คืบ จนเป็นที่มาของการบันทึกเรื่องราวการทำงานในคร้้งนี้เก็บเอาไว้ สำหรับหลายๆ ท่านที่ต้องการใช้งานมองหาเอกสารแนะนำไม่ค่อยมี บางทีอาจจะมีประโยชน์

ว่ากันด้วยครึ่งวันเช้า หาวิธีติดตั้งค้นหาในเน็ตดูแล้วลองทำตามจนสำเร็จกลายเป็น Yii Framework V2 อีกติดตั้งด้วย Composer จนเปิดระบบด้วยคำสั่ง php yii serve ทำงานที่ port 8080 ได้สำเร็จด้วย ทำตามเอกสารติดตั้งทุกประการ เพิ่มแค่ดาวน์โหลดไฟล์มาด้วย เพราะเครื่องมือดาวน์โหลดมาไม่ครบ

ครึ่งวันบ่ายก็ยังเจอปัญหาเดิม ๆ คือ "PHP Fatal error:  Uncaught CDbException: CDbConnection failed to open the DB connection." เอายังไงต่อดี ต้องกลับไปหาเอกสารทำงานใหม่จนได้มา เพื่อไม่ให้เสียเวลาเราไปเริ่มต้นกันเลยดีกว่า


 

ขั้นตอนที่ 1 ดาวน์โหลดเฟรมเวิร์ค Yii เวอร์ชั่น 1 ตามตัวอย่างข้างล่างนี้เลย

wget https://github.com/yiisoft/yii/releases/download/1.1.23/yii-1.1.23.445827.tar.gz

 

ขั้นตอนที่  2 แตกไฟล์ออก แล้วทำงานตรวจสอบความพร้อมของเซิร์ฟเวอร์ว่าติดตั้งซอฟต์แวร์ครบถ้วนหรือยัง โดยเปิดเวบไซต์ไปที่โฟลเดอร์ http://localhost/yii-test/requirements/ หากตัวไหนยังขาดก็ลงให้ครบ รอบแรกผู้เขียนติดตั้งด้วย PHP8.0 แต่ไม่สำเร็จ อาจจะใช้งานได้ก็ได้ เพราะหลงไปหลงมา ท้ายสุดกลับมาใช้ PHP7.4 แทน สำหรับโอเอสเป็น Ubuntu 18.04LTS

 

sudo tar xzvf yii-1.1.23.445827.tar.gz
sudo a2dismod php8.0
sudo a2enmod php7.4
sudo systemctl restart apache2
sudo apt-cache search php7.4
sudo apt-cache search php7.4-mcrypt
sudo apt install php7.4-mcrypt
sudo apt-cache search php7.4
sudo apt install php7.4-odbc
sudo apt install php7.4-memcache

 

ขั้นตอนที่ 3 เป็นตัวอย่างของหน้าจอที่ตรวจสอบได้แล้วว่าการทำงานของ PHP7.4 และโมดูลต่าง ๆทำงานได้ครบถ้วนสมบูรณ์ ก็ไปถึงขั้นตอนการทดสอบ http://localhost/yii-test/demos/helloworld
 


ขั้นตอนที่ 4 สร้างฐานข้อมูลสำหรับทดสอบการเชื่อมต่อ PHP7.4, OBDC และ MYSQL 

CREATE TABLE tbl_lookup
(
        id INTEGER NOT NULL PRIMARY KEY AUTO_INCREMENT,
        name VARCHAR(128) NOT NULL,
        code INTEGER NOT NULL,
        type VARCHAR(128) NOT NULL,
        position INTEGER NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

CREATE TABLE tbl_user
(
        id INTEGER NOT NULL PRIMARY KEY AUTO_INCREMENT,
        username VARCHAR(128) NOT NULL,
        password VARCHAR(128) NOT NULL,
        email VARCHAR(128) NOT NULL,
        profile TEXT
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

CREATE TABLE tbl_post
(
        id INTEGER NOT NULL PRIMARY KEY AUTO_INCREMENT,
        title VARCHAR(128) NOT NULL,
        content TEXT NOT NULL,
        tags TEXT,
        status INTEGER NOT NULL,
        create_time INTEGER,
        update_time INTEGER,
        author_id INTEGER NOT NULL,
        CONSTRAINT FK_post_author FOREIGN KEY (author_id)
                REFERENCES tbl_user (id) ON DELETE CASCADE ON UPDATE RESTRICT
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

CREATE TABLE tbl_comment
(
        id INTEGER NOT NULL PRIMARY KEY AUTO_INCREMENT,
        content TEXT NOT NULL,
        status INTEGER NOT NULL,
        create_time INTEGER,
        author VARCHAR(128) NOT NULL,
        email VARCHAR(128) NOT NULL,
        url VARCHAR(128),
        post_id INTEGER NOT NULL,
        CONSTRAINT FK_comment_post FOREIGN KEY (post_id)
                REFERENCES tbl_post (id) ON DELETE CASCADE ON UPDATE RESTRICT
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

CREATE TABLE tbl_tag
(
        id INTEGER NOT NULL PRIMARY KEY AUTO_INCREMENT,
        name VARCHAR(128) NOT NULL,
        frequency INTEGER DEFAULT 1
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

INSERT INTO tbl_lookup (name, type, code, position) VALUES ('Draft', 'PostStatus', 1, 1);
INSERT INTO tbl_lookup (name, type, code, position) VALUES ('Published', 'PostStatus', 2, 2);
INSERT INTO tbl_lookup (name, type, code, position) VALUES ('Archived', 'PostStatus', 3, 3);
INSERT INTO tbl_lookup (name, type, code, position) VALUES ('Pending Approval', 'CommentStatus', 1, 1);
INSERT INTO tbl_lookup (name, type, code, position) VALUES ('Approved', 'CommentStatus', 2, 2);

INSERT INTO tbl_user (username, password, email) VALUES ('demo','$2a$10$JTJf6/XqC94rrOtzuF397OHa4mbmZrVTBOQCmYD9U.obZRUut4BoC','webmaster@example.com');
INSERT INTO tbl_post (title, content, status, create_time, update_time, author_id, tags) VALUES ('Welcome!','This blog system is developed using Yii. It is meant to demonstrate how to use Yii to build a complete real-world application. Complete source code may be found in the Yii releases.

Feel free to try this system by writing new posts and posting comments.',2,1230952187,1230952187,1,'yii, blog');
INSERT INTO tbl_post (title, content, status, create_time, update_time, author_id, tags) VALUES ('A Test Post', 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.', 2,1230952187,1230952187,1,'test');

INSERT INTO tbl_comment (content, status, create_time, author, email, post_id) VALUES ('This is a test comment.', 2, 1230952187, 'Tester', 'tester@example.com', 2);

INSERT INTO tbl_tag (name) VALUES ('yii');
INSERT INTO tbl_tag (name) VALUES ('blog');


ขั้นตอนที่ 5 เข้าไปแก้ไขคอนฟิก /blog/protected/config/mainconfig.php เปลี่ยนในส่วนติดต่อกับ MYSQL เป็นอันจบพิธี


ผ่านไปได้ดีอีกเรื่องหนึ่งสำหรับการติดตั้ง APACHE2, MYSQL, PHP7.4 และ Framework Yii เวอร์ชั่น 1 ทำได้เองไม่ยาก ผู้เขียนยังมีเรื่องราวดี ๆที่จะมานำเสนอกันอีกมากมายเพราะช่วงนี้กำลังอยู่ในขั้นตอนการพัฒนาซอฟต์แวร์เล็ก ๆ ทรงประสิทธิภาพอยู่นั่นเอง อย่าลืมเข้าไปแวะชมสินค้าอุปกรณ์ GPS TRACKER ได้ที่จีพีเอสไทย จีพีเอสไทย ฉับไว พร้อมบริการ