ทดลองสร้าง RESTful services โดยใช้ Slim PHP Framework

ทดลองสร้าง RESTful services โดยใช้ Slim PHP Framework

จากบทความ REST (Representational State Transfer) คืออะไร? ที่ผมได้อธิบายถึง สถาปัตยกรรมการสื่อสารข้อมูล ซึ่งเป็นแนวทางใหม่ในการสร้าง Web Service แบบเรียบง่าย โดยเรียกใช้งานผ่านทาง HTTP Method GET / POST / PUT / DELETE และส่งข้อมูลออกมาในรูปของ XML วันนี้มีโอกาสได้เขียนบทความ จึงจะเขียนบทความแนะนำ และยกตัวอย่าง แนวทางการพัฒนาเว็บแอพพลิเคชั่นแบบ RESTful Services ซึ่งในปัจจุบันมีผู้ให้ความสนใจมากเลยทีเดียวในเรื่องของ RESTful Services จากการตรวจสอบข้อมูล และความสนใจของผู้ใช้งานที่ค้นหาบทความเรื่อง RESTful Services จาก Google ซึ่งจากบทความ REST (Representational State Transfer) คืออะไร? ก็มีผู้ใช้งานจำนวนมากที่ให้ความสนใจในเรื่องนี้ ซึ่งผมดูจากปริมาณการค้นหาจากเว็บไซต์ SiamHTTP ใน Google Analytics ก็มีผู้ใช้งานที่ความสนใจในเรื่องนี้มากเลยทีเดียว วันนี้จึงจะมาแนะนำแนวทางการพัฒนาเว็บแอพพลิเคชั่นแบบ RESTful Services โดยใช้ Slim PHP Framework กันครับ

การออกแบบฐานข้อมูล

Users Table

CREATE TABLE `users` (
`user_id` int(11) AUTO_INCREMENT,
`username` varchar(50),
`password` varchar(100),
`name` varchar(100),
`profile_pic` varchar(200),
PRIMARY KEY (`user_id`)
);

Updates Table

CREATE TABLE `updates` (
`update_id` int(11) AUTO_INCREMENT,
`user_update` text,
`user_id_fk` int(11), 
`created` int(11),
`ip` varchar(50),
PRIMARY KEY (`update_id`)
);


Slim Framework

api/index.php

<?php
require 'db.php';
require 'Slim/Slim.php';
\Slim\Slim::registerAutoloader();

$app = new \Slim\Slim();

$app->get('/users','getUsers');
$app->get('/updates','getUserUpdates');
$app->post('/updates', 'insertUpdate');
$app->delete('/updates/delete/:update_id','deleteUpdate');
$app->get('/users/search/:query','getUserSearch');

$app->run();

// GET http://www.yourwebsite.com/api/users
function getUsers() {
$sql = "SELECT user_id,username,name,profile_pic FROM users ORDER BY user_id DESC";
try {
$db = getDB();
$stmt = $db->query($sql); 
$users = $stmt->fetchAll(PDO::FETCH_OBJ);
$db = null;
echo '{"users": ' . json_encode($users) . '}';
} catch(PDOException $e) {
//error_log($e->getMessage(), 3, '/var/tmp/phperror.log'); //Write error log
echo '{"error":{"text":'. $e->getMessage() .'}}';
}
}

// GET http://www.yourwebsite.com/api/updates
function getUserUpdates() {
$sql = "SELECT A.user_id, A.username, A.name, A.profile_pic, B.update_id, B.user_update, B.created FROM users A, updates B WHERE A.user_id=B.user_id_fk  ORDER BY B.update_id DESC";
try {
$db = getDB();
$stmt = $db->prepare($sql);
$stmt->execute();
$updates = $stmt->fetchAll(PDO::FETCH_OBJ);
$db = null;
echo '{"updates": ' . json_encode($updates) . '}';
} catch(PDOException $e) {
echo '{"error":{"text":'. $e->getMessage() .'}}';
}
}

// DELETE http://www.yourwebsite.com/api/updates/delete/10
function deleteUpdate($update_id)
{
$sql = "DELETE FROM updates WHERE update_id=:update_id";
try {
$db = getDB();
$stmt = $db->prepare($sql); 
$stmt->bindParam("update_id", $update_id);
$stmt->execute();
$db = null;
echo true;
} catch(PDOException $e) {
echo '{"error":{"text":'. $e->getMessage() .'}}';
}
}

// POST http://www.yourwebsite.com/api/updates
function insertUpdate() {
//....
//....
}

function getUserUpdate($update_id) {
//.....
//.....
}

// GET http://www.yourwebsite.com/api/users/search/sri
function getUserSearch($query) {
//.....
//....
}
?>

โปรเจคนี้ผมใช้ PDO ในการติดต่อระบบฐานข้อมูล ***อย่าลืม เปิดการใช้งาน php_pdo extension ใน php.ini ด้วยนะครับ การเปิดการใช้งาน PDO สามารถอ่านได้จากบทความนี้ได้เลยครับ สร้างระบบ Login PHP กับ MySQL ด้วย PDO

db.php

<?php
function getDB() {
$dbhost="localhost";
$dbuser="username";
$dbpass="password";
$dbname="database";
$dbConnection = new PDO("mysql:host=$dbhost;dbname=$dbname", $dbuser, $dbpass); 
$dbConnection->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
return $dbConnection;
}
?>

ในการทดสอบระบบ และดูการทำงานของระบบเว็บไซต์ที่เราพัฒนา ผมแนะนำให้ใช้ Google chrome developer tools ในการตรวจสอบ สามารถอ่านได้จากบทความนี้ครับ การใช้งาน Google chrome developer tools ในการพัฒนาเว็บแอพพลิเคชั่น  

Cross Domain Access

สร้างไฟล์ .htaccess เพื่อกำหนดการทำงาน กรณีเราต้องการสร้าง Web Service ที่ต่างโดเมนเนม หรือข้ามโดเมนเนม หรือที่เรียกว่า Cross-Domain 

.htaccess

RewriteEngine On

# Some hosts may require you to use the `RewriteBase` directive.
# If you need to use the `RewriteBase` directive, it should be the
# absolute physical path to the directory that contains this htaccess file.
#
# RewriteBase /

# Cross domain access
Header add Access-Control-Allow-Origin "*"
Header add Access-Control-Allow-Headers "origin, x-requested-with, content-type"
Header add Access-Control-Allow-Methods "PUTGETPOSTDELETEOPTIONS"

RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.*)$ index.php [QSA,L]


jQuery

ในโปรเจคนี้ผมจะใช้ jQuery Ajax ในการทำงานส่วนของการติดต่อสื่อสารระหว่าง Client และ Server ครับ

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="js/ajaxGetPost.js"></script>
<script>
$(document).ready(function()
{

var base_url="http://www.yourwebsite.com/project_name/";
var url,encodedata;
$("#update").focus();

/* Load Updates */
url=base_url+'api/updates';
ajax_data('GET',url, function(data)
{
$.each(data.updates, function(i,data)
{
var html="<div class='stbody' id='stbody"+data.update_id+"'><div class='stimg'><img src='"+data.profile_pic+"' class='stprofileimg'/></div><div class='sttext'><strong>"+data.name+"</strong>"+data.user_update+"<span id='"+data.update_id+"' class='stdelete'>Delete</span></div></div>";
$(html).appendTo("#mainContent");
});
});

/* Insert Update */
$('body').on("click",'.stpostbutton',function()
{
var update=$('#update').val();
encode=JSON.stringify({
        "user_update": update,
        "user_id": $('#user_id').val()
        });
url=base_url+'api/updates';
if(update.length>0)
{
post_ajax_data(url,encode, function(data)
{
$.each(data.updates, function(i,data)
{
var html="<div class='stbody' id='stbody"+data.update_id+"'><div class='stimg'><img src='"+data.profile_pic+"' class='stprofileimg'/></div><div class='sttext'><strong>"+data.name+"</strong>"+data.user_update+"<span id='"+data.update_id+"' class='stdelete'>Delete</span></div></div>";
$("#mainContent").prepend(html);
$('#update').val('').focus();
});
});
}

});

/* Delete Updates */
$('body').on("click",'.stdelete',function()
{
var ID=$(this).attr("id");
url=base_url+'api/updates/delete/'+ID;
ajax_data('DELETE',url, function(data)
{
$("#stbody"+ID).fadeOut("slow");
});
});

});
</script>

จากการทดสอบโดยใช้ Firebug ในการ Debug การทำงาน จะได้ผลดังภาพครับ 



HTML Code

สร้างไฟล์ HTML และใช้ function ของ jQuery ในการส่งข้อมูลจาก Input Form โดยอ้างอิงจาก ID $("body").on('click','.stpostbutton', function(){} ซึ่งจะแปลงข้อมูลให้อยู่ใน Format ของ JSON

<div>
<textarea id="update" class="stupdatebox"></textarea>
<input type="hidden" id="user_id" value="User Session Value">
<input type="submit" value="POST" class="stpostbutton">
</div>

<div id="mainContent"></div>

ajaxGetPost.js

สร้าง Function สำหรับกำหนดการทำงานของ Form โดยใช้ jQuery Ajax

//POST Ajax
function post_ajax_data(url, encodedata, success)
{
$.ajax({
type:"POST",
url:url,
data :encodedata,
dataType:"json",
restful:true,
contentType: 'application/json',
cache:false,
timeout:20000,
async:true,
beforeSend :function(data) { },
success:function(data){
success.call(this, data);
},
error:function(data){
alert("Error In Connecting");
}
});
}

//GET and DELETE Ajax
function ajax_data(type, url, success)
{
$.ajax({
type:type,
url:url,
dataType:"json",
restful:true,
cache:false,
timeout:20000,
async:true,
beforeSend :function(data) { },
success:function(data){
success.call(this, data);
},
error:function(data){
alert("Error In Connecting");
}
});
}


จากบทความ และตัวอย่าง Source Code ข้างต้น หากทดลองทำตามตัวอย่างที่ผมได้อธิบายแล้ว จะเห็นว่าการพัฒนาระบบ RESTful Services โดยใช้ Slim PHP Framework เป็นเรื่องที่ง่ายมากๆ และสามารถที่จะนำไปใช้ในการพัฒนา Web Service แบบ RESTful Services ตามความต้องการของผู้อ่าน หรือตามระบบงานที่ต้องการ หวังว่าจะมีประโยชน์สำหรับโปรแกรมเมอร์ หรือผู้ที่สนใจนะครับ^^



Siamhttp สยามเอชทีทีพี, บริการรับทำเว็บไซต์, บริการออกแบบเว็บไซต์, บริการออกแบบเว็บไซต์รองรับสมาร์ทโฟน, Responsive Website Design, SEO, พัฒนาโปรแกรมบนเว็บ ราคาเบาๆ

แชร์บทความ

Facebook Twitter Google Digg Reddit LinkedIn StumbleUpon Email
กำลังโหลด ...