Pengenalan Pemograman CGI Ver2
-
Upload
reza-darmakusuma -
Category
Documents
-
view
99 -
download
0
description
Transcript of Pengenalan Pemograman CGI Ver2
-
Pengenalan Pemrograman CGI Menggunakan C/C++ Reza Darmakusuma
PENGENALAN PEMOGRAMAN CGIMENGGUNAKAN C/C++
Oleh
Reza Darmakusuma
Email: [email protected]
TEKNOLOGI MEDIA DIGITAL DAN GAME SEKOLAH TEKNIK ELEKTRO DAN INFORMATIKA
INSTITUT TEKNOLOGI BANDUNG 2010
-
Pengenalan Pemrograman CGI Menggunakan C/C++ Reza Darmakusuma
PENDAHULUAN
Tutorial berikut merupakan suplemen untuk pemrograman
Common Gateway Interface (CGI). Penjelasan yang diberikan pada suplemen ini adalah implementasi dasar
dari pemrograman C/C++ yang digunakan untuk melakukan
implementasi perangkat lunak di bagian server. Oleh
sebab itu, pengetahuan pemrograman C/C++ menjadi
dasar yang penting sebelum melakukan implementasi
ini.
Pengetahuan lain, yaitu HTML, juga diperlukan pada
pemrograman CGI. Penggunaan web browser dan aplikasi pendukung lain, membutuhkan pengetahuan-pengetahuan
dasar tersebut. Beberapa aplikasi dan aplikasi
pendukung yang digunakan pada tutorial ini adalah
sebagai berikut:
a. Visual C++ sebagai IDE
b. Mozila Firefox sebagai web browserc. XAMPP 1.7.3 sebagai web serverd. Microsoft Office Frontpage sebagai aplikasi web
page editor
-
Pengenalan Pemrograman CGI Menggunakan C/C++ Reza Darmakusuma
HELLO WORLD Bagian 1
Bagian ini merupakan aplikasi awal yang menjelaskan
cara men-display-kan Hello World dengan menggunakan C/C++ pada aplikasi CGI. Berikut adalah langkah-
langkah yang diperlukan untuk melakukan hal tersebut.
1. Buat aplikasi CGI melalui Visual C++ IDE dengan
source code seperti berikut:
2. Compile file
3. Copy aplikasi ke ...\xampp\cgi-bin\...
4. Buka web browser dengan alamat http://localhost/cgi-bin/.
Berikut adalah tampilan dari implementasi pemrograman
yang dilakukan dengan menggunakan langkah-langkah di
atas.
-
Pengenalan Pemrograman CGI Menggunakan C/C++ Reza Darmakusuma
HELLO WORLD Bagian 2
Aplikasi berikut merupakan pengembangan dari aplikasi
sebelumnya. Seperti yang dapat dilihat, bahwa pada
aplikasi sebelumnya memiliki konten dengan tipe
text/plain. Pada aplikasi berikut akan dilakukan modifikasi dengan format HTTP. Berikut adalah sourcecode dari aplikasi yang diimplementasikan.
Source code aplikasi 1
Source code aplikasi 2
Hasil Aplikasi 1 Hasil Aplikasi 2
-
Pengenalan Pemrograman CGI Menggunakan C/C++ Reza Darmakusuma
Menerima Masukan Web Browser
Pada aplikasi ini akan dilakukanoperasi penjumlahan
dua buah variabel. Website didesain dengan
menggunakan Microsoft Office Frontpage. Sedangkan
website yang merespon aktivitas dari website awal
dibuat menggunakan C++. Berikut ini adalah gambaran
dan langkah-langkah dalam melakukan implementasi ini.
1. Mendesain Website
Berikut adalah langkah-langkah dalam mendesain web.
Gambar Designs View
Gambar Codes View
-
Pengenalan Pemrograman CGI Menggunakan C/C++ Reza Darmakusuma
2. Membuat Website yang merespon
Untuk membuat web yang merespon, di bawah ini adalah
source code yang dipergunakan.
3. Compile aplikasi
4. Tes aplikasi
Dari langkah-langkah yang dilakukan, berikut adalah
gambar yang memperlihatkan hasil implementasi.
Setelah tombol
Jumlahkan! dipencet
-
Pengenalan Pemrograman CGI Menggunakan C/C++ Reza Darmakusuma
Mengontrol Actuator Melalui Web
Pada bagian ini, dilakukan implementasi sebuah
aplikasi sistem pengontrolan menggunakan web. Diagram
sistem yang digunakan pada aplikasi ini adalah
sebagai berikut:
Pada sistem, user (client) dapat mengakses aplikasi
pada server menggunakan web browser. Aplikasi pada
server tersebut, dapat digunakan untuk mengontrol
kondisi lampu (aktuator) sehingga lampu dapat dalam
kondisi ON atau OFF. Kondisi lampu dikontrol oleh
server (PC) menggunakan komunikasi serial (RS232).
Aplikasi untuk mengontrol lampu yang digunakan
merupakan simulator virtual. Spesifikasi dari
simulator ini adalah sebagai berikut:
1. Address : COM40
2. Baudrate : 9600 bps
3. Data bit : 8
4. Stop bit : 1
5. Parity : None
6. Handshaking : None
Pembuatan code website yang dapat menjalankankan
aplikasi untuk mengontrol lampu digunakan Microsoft
Office FrontPage. Source code dan desain website yang
digunakan adalah sebagai berikut:
Client Server AktuatorRS232
-
Pengenalan Pemrograman CGI Menggunakan C/C++ Reza Darmakusuma
Dari desain dan source code di atas, hasil
pemanggilan rancangan website dari web browser dapat
dilihat seperti gambar berikut ini.
Diperhatikan bahwa hingga pada bagian ini, web server
ada pada di komputer yang sama dengan client. Maka
pemanggilan website pada web browser adalah dengan
mengetikkan
file:///.../xampp/cgi-bin/.htm
Perlu untuk disadari bahwa aplikasi yang sekarang
digunakan adalah aplikasi antara file yang berformat
htm dan aplikasi yang berformat cgi.
-
Pengenalan Pemrograman CGI Menggunakan C/C++ Reza Darmakusuma
Sedangkan untuk CGI, aplikasi yang diimplementasikan
menggunakan source code berikut ini:
Aplikasi CGI di atas digunakan untuk mengirim
perintah kepada aktuator sehingga dapat mengontrol
keadaan lampu. Server akan mengirimkan karakter a
untuk mengubah lampu pada kondisi ON melalui
komunikasi RS232. Sedangkan untuk mengubah kondisi
lampu pada kondisi OFF, server mengirimkan sebuah
karakter s melalui komunikasi RS232. Sedangkan
simulator lampu yang digunakan memiliki visual
sebagai berikut:
-
Pengenalan Pemrograman CGI Menggunakan C/C++ Reza Darmakusuma
Pada simulator diatas, button merah mensimulasikan
lampu. Pada keadaan ini lampu dalam kondisi OFF.
Sedangkan pada kondisi ON, lampu kan berubah warna
menjadi merah menyala. Gambar berikut, menggambarkan
aplikasi ketika dijalankan.
Hasil aplikasi lampu dalam kondisi ON
Hasil aplikasi lampu dalam kondisi OFF
-
Pengenalan Pemrograman CGI Menggunakan C/C++ Reza Darmakusuma
Menghubungkan Client-Server dan Aplikasi Pengontrol Lampu
Pada bagian ini, akan dibahas implementasi sistem
secara keseluruhan. Menggunakan dua buah komputer
untuk menghubungkan client dan server, serta
menggunakan simulator lampu dan simulator RS232 untuk
mensimulasikan komunikasi serial dengan protocol
RS232. Berikut adalah langkah-langkah yang diperlukan
untuk dapat menggunakan komputer client sebagai
pengontrol aktuator yang terpasang pada komputer
server menggunakan web browser (simulasi pada LAN).
1. Hubungkan komputer client dan komputer server
pada jaringan LAN. Pastikan kedua buah komputer
terpasang pada jaringan.
2. Set IP address dari komputer client dan
komputer server. Berikut adalah alamat IP yang
digunakan pada aplikasi ini.
IP pada komputer server : 192.168.1.2
IP pada komputer client : 192.168.1.10
-
Pengenalan Pemrograman CGI Menggunakan C/C++ Reza Darmakusuma
3. Ubah aplikasi website di atas (format HTML yang
dibuat menggunakan Microsoft Office FrontPage)
menjadi aplikasi website yang bertipe cgi.
Berikut adalah source code yang digunakan.
4. Ubah alamat localhost pada source code
sebelumnya, menjadi alamat server yang
digunakan. Lingkaran merah di atas
memperlihatkan perubahan yang dilakukan.
5. Pindah aplikasi cgi ke dalam folder
...\xampp\cgi-bin\...
6. Jalankan apache web server, dalam hal ini
adalah XAMPP.
7. Set a pair dari simulator COM pada komputer
server dengan alamat COM4 dan COM40.
8. Jalankan aplikasi simulator lampu pada komputer
server.
9. Buka web browser pada komputer client
10.Pada address, tulis:
http://192.168.1.2/cgi-bin/.cgi
11.Jalankan pengontrol ON dan OFF dari aplikasi
12.Enjoy it!!!!!!!!!!!!! -