pl/sql üzerinden web sayfası üretmek

Turkey Oracle Applications Users Group

PL/SQL üzerinden Web Sayfası üretmekTemel HTML özellikleri

Oracle PL/SQL ile web sayfası ve formları üretmek

Ümit Varol / Diveya Bilgi Sistemleri

Xx/11/2010 - İstanbul

İstanbul'11 14 Mayıs 2011

2

Web Sayfası Nedir?• Web sayfası, bir bilgisayar ağı üzerinde belirli bir metin ve görseller içeren

bir dokümanın paylaşılmasını sağlayan, özel bir formatı olan bir doküman biçimidir.

• Web sayfaları HTML dili ile oluşturulur.

• HTTP – Hyper Text Markup Language, Zengin Metin Biçimlendirme Dili

• HTML bir programlama dili değildir, bir biçimlendirme dilidir.

• İçeriği oluşturan metin içine yerleştirilen biçimlendirme etiketleri (tag) ile dokümana çeşitli biçim özellikleri kazandırılmasını sağlar.

• HTML ile biçimlendirilmiş dokümanları, istene biçimde görüntülebilmesi için bir görüntüleme uygulaması (tarayıcı-browser) gereklidir. Bu uygulama tag’ları yorumlayarak dokümanın planlanan biçimde görüntülenmesini sağlar.

• Browser uygulamaları artık her türlü cihaz üzerinde standart olarak sağlanmaktadır. En popüler olanları Internet Explorer, Firefox, Chrome, Safari olan bu uygulamaların birçok farklı marka ve sürümü vardır.


3

İçerik• Web Sayfası nedir, nasıl çalışır?

• Örnek Web Sayfası.

• Örnek Web Formu ve SQL tablosu.

• PL/SQL Tablo ve Fonksiyon işlemlerine bakış.

• Örnek Senaryo.

• Bir yorumlayıcı sayfa oluşturmak (örnek JSP kod).

• Senaryo’ya devam.

• Kodlara Genel Bakış.

• Notlar.


4

Web Sayfası Nasıl Çalışır?• HTTP – Hyper Text Transfer Protocol – Zengin Metin Aktarım Kuralları

• URL – Uniform Resource Locator – Tektipleştirilmiş Kaynak Bulucu

• Tipik bir URL örneği :

– http://www.world.com

– ftp://www.store.com

• HTML - Hyper Text Markup Language, Zengin Metin Biçimlendirme Dili

– Bu metinde <strong>bu bölüm</strong> koyu tonda görüntülenecektir.

Web Sayfasıİsteği

Web Sayfasıİsteği

Tarayıcı

Internet ServiceProvider

PublicInternet

HTTP

HTML

URL

Address

X

Web Page

X

Örnek Web Sayfası<html>

<body><form method=“get”>

<table border=“0”><tr>

<td>İsim :

</td><td>

<input type=“text” name=“field1” id=“field1” size=“20”></td>

</tr><tr>

<td>Telefon :

</td><td>

<input type=“text” name=“field2” id=“field2” size=“10”></td>

</tr><tr>

<td colspan=“2”><input type=“submit” value=“kaydet”>

</td></tr>

</table></form>

</body></html>

İsim :

Tel :

kaydet


5

Örnek Web Sayfası

<td><tr>

<table border=“0”>

</table>

</tr>

<tr>

</tr>

İsim :</td>

<td>Tel :

</td>

<td>

<td>

</td>

</td>

<input type=“text” name=“field1” id=“field1” size=“20”>


<tr>

</tr>

<td>

</td>

<form method=“get”>

</form>

<input type=“submit” value=“kaydet”>

İsim :

Tel :

kaydet


6

Örnek Web Formu ve SQL Tablosu

İsim :

Tel :

kaydet

CREATE TABLE XX_WEB_FORM_TEST_TBL ( F_NAME VARCHAR2(50 BYTE),

F_PHONE VARCHAR2(50 BYTE),S_INSERT_DATE DATE DEFAULT sysdate

)

XX_WEB_FORM_TEST_TBL

F_NAME VARCHAR2(50 BYTE)F_PHONE VARCHAR2(50 BYTE)S_INSERT_DATE DATE (sysdate)

<html><body>

<form method=“get”><table border=“0”>

<tr><td>

İsim :</td><td>


</td></tr><tr>

<td>Telefon :

</td><td>


</td></tr><tr>

<td colspan=“2”><input type=“submit” value=“kaydet”>

</td></tr>

</table></form>

</body></html>


7

PL/SQL Tablo ve Fonksiyon İşlemlerine Bakış


8

• Bir tabloya veri yazmak için INSERT komutu kullanılır.• INSERT INTO XX_WEB_FORM_TEST_TBL (F_NAME, F_PHONE) VALUES (‘Ali’,’123’);

• Ancak çoğu zaman bu komutu doğrudan kullanmak yerine bir fonksiyon ile çağırmak daha avantajlı olmaktadır.

• CREATE OR REPLACE FUNCTION XX_WEB_FORM_TEST_ INS_FNC (P_NAME VARCHAR2, P_PHONE VARCHAR2) RETURN VARCHAR2 IS

retVal VARCHAR2(200);BEGIN retVal := 'Kayıt Başarılı.'; INSERT INTO XX_WEB_FORM_TEST_TBL (F_NAME, F_PHONE) VALUES (P_NAME, P_PHONE ); RETURN retVal; EXCEPTION

WHEN NO_DATA_FOUND THEN RETURN 'Veri Yok!';

WHEN OTHERS THEN RETURN 'Hata:'||sqlerrm;

END;

• Bu sayede birçok kontrol, ek işlemler ve hata kontrolü olanakları sağlanabilir.


9

Örnek Senaryo• Tüm planlama ve yazılım kısmı PL/SQL üzerinde olan bir Web Form ortamı

oluşturalım. Tüm gerekli tanımlamalarda tablolarımızda olsun.

• HTML ile bir Web Formu tasarlayalım.• Bir SQL tablosu içine Web form sayfalarımızı ve temel tanımlarımızı

kaydedelim.• Bu formdan dönecek verinin saklanacağı tablomuzu oluşturalım.• Formdan dönecek veriyi kaydetmek için de bir fonksiyon yazalım.

• Bize bir de SQL tablomuzdan Web Form bilgilerimizi okuyacak, web sayfamızı oluşturup, kullanıcıya sunacak ve dönen veriyide ilgili fonksiyona gönderecek “Yorumlayıcı Sayfa” gerekiyor.

– Bu uygulama birçok ortamda hazırlanabilir.– Bizim örneğimiz Oracle dünyasına en yakın ortam olan JSP tabanlı.– Bu uygulama bir kez yazılıp çalıştırıldıktan sonra hiçbir değişikliğe uğramadan

çalışacaktır. Yeni web sayfaları ile ilgili tüm tanımlamalar kesinlikle PL/SQL tarafında kalmalıdır.


10

Bir Yorumlayıcı Sayfa Oluşturmak• HTML ile bir Web Formu tasarlayalım.• Sistematik bir yapı için,

– Formun adını : ff– Veri alanlarının adını : f1, f2, f3, ..., fn– Submit düğmesinin adını : ss

<html><body> <form method=“post” name=“ff“ id=“ff”>

İsim: <input type=“text” name=“f1” id=“f1”><br>Telefon: <input type=“text” name=“f2” id=“f2”><br><input type=“submit” name=“ss” id=“ss”>

</form></body>

</html>

İsim :

Tel efon:

kaydet


11

Bir Yorumlayıcı Sayfa Oluşturmak• Bir SQL tablosu içine Web form sayfalarımızı ve temel tanımlarımızı

kaydedelim.– Tablomuzun adı XX_WEB_FORM_SETUP_TBL olsun– Web Formumuz için bir CLOB alan– Bir ID– Geri dönüşte çağrılacak fonksiyonumuzu tanımlamak için bir alan– ve Web form Sayfamızı adı için bir alan

CREATE TABLE XX_WEB_FORM_SETUP_TBL( F_CLOB CLOB, F_ID NUMBER, F_FUNCTION VARCHAR2(100 BYTE), F_URL_NAME VARCHAR2(100 BYTE));

– Örnek bir kayıt oluşturalım,

INSERT INTO XX_WEB_FORM_SETUP_TBL VALUES (‘<html....’, 1, ‘XX_WEB_FORM_TEST_ INS_FNC’, ‘Telefon_Rehberi’);

XX_WEB_FORM_SETUP_TBL

F_CLOB CLOBF_ID NUMBERF_FUNCTION VARCHAR2(100 BYTE)F_URL_NAME VARCHAR2(100 BYTE)


12

Bir Yorumlayıcı Sayfa Oluşturmak• Bu formdan dönecek verinin saklanacağı tablomuzu oluşturalım.

– Daha önce örnek olarak oluşturduğumuz tabloyu kullanabiliriz.

CREATE TABLE XX_WEB_FORM_TEST_TBL ( F_NAME VARCHAR2(50 BYTE),

F_PHONE VARCHAR2(50 BYTE),S_INSERT_DATE DATE DEFAULT sysdate

)

XX_WEB_FORM_TEST_TBL

F_NAME VARCHAR2(50 BYTE)F_PHONE VARCHAR2(50 BYTE)S_INSERT_DATE DATE (sysdate)


13

Bir Yorumlayıcı Sayfa Oluşturmak• Formdan dönecek veriyi kaydetmek için de bir fonksiyon yazalım.

– Daha önce örnek olarak oluşturduğumuz fonksiyonu kullanabiliriz.

CREATE OR REPLACE FUNCTION XX_WEB_FORM_TEST_ INS_FNC (P_NAME VARCHAR2, P_PHONE VARCHAR2) RETURN VARCHAR2 IS

STATUS VARCHAR2(200);BEGIN STATUS := 'Kayıt Başarılı.'; INSERT INTO XX_WEB_FORM_TEST_TBL (F_NAME, F_PHONE) VALUES (P_NAME, P_PHONE ); RETURN STATUS; EXCEPTION

WHEN NO_DATA_FOUND THEN RETURN 'Veri Yok!';

WHEN OTHERS THEN RETURN 'Hata:'||sqlerrm;

END;

XX_WEB_FORM_TEST_INS_FNC

P_NAME VARCHAR2P_PHONE VARCHAR2

STATUS VARCHAR2

f(x)

• Bize bir de SQL tablomuzdan Web Form bilgilerimizi okuyacak, web sayfamızı oluşturup, kullanıcıya sunacak ve dönen veriyide ilgili fonksiyona gönderecek “Yorumlayıcı Sayfa” gerekiyor.

– Bizim örneğimiz Oracle dünyasına en yakın ortam olan JSP tabanlı.

• Bu uygulama sayfasını çalıştırmak için JSP sayfalarını gösterebilen bir web sunucusuna ihtiyacımız olacaktır.

– Çok yaygın olarak Apache & Tomcat ikilisi olabilir,

– Oracle’ın son zamanlarda kullandığı WebLogic olabilir,

– Ve benzeri bir başka sunucu da olabilir.

• Sunucunuzun tipine göre web sunucusu kök dizininde bir yeni dizin açalım ve yorumlayıcı JSP sayfamızı buraya koyalım.

– Apache için : c:/apache/webapps/ROOT/web_form/web_form.jsp


14

Bir Yorumlayıcı Sayfa Oluşturmak

• Apache web sunucusu üzerinde veri tabanı erişimi için JDBC oluşturmak gerekir.– JDBC : Java Database Connector

• Örnek olarak Oracle 10g veritabanına erişim ve Oracle kütüphanelerini kullanmak için,

– classes12.jar ve ojdbc14.jar dosyalarını \lib dizini altına koymanız gerekir.

– \conf dizini altınde yer alan context, web ve server dosyalarında güncelleme yapılmalıdır.

– context.xml dosyasında <context> etiketi içinde

• <ResourceLink global="jdbc/webForm" name=" jdbc/webForm " type="oracle.jdbc.pool.OracleDataSource"/>

– web.xml dosyası <web-app> etiketi içinde

• <resource-ref>

<description>Oracle Development Datasource</description>

<res-ref-name> jdbc/webForm</res-ref-name>

<res-type>oracle.jdbc.pool.OracleDataSource</res-type>

<res-auth>Container</res-auth>

</resource-ref>

– server.xml dosyası <GlobalNamingResources> etiketi içinde

• <Resource name=" jdbc/webForm “

auth="Container“

type="oracle.jdbc.pool.OracleDataSource“

driverClassName="oracle.jdbc.driver.OracleDriver”

factory="oracle.jdbc.pool.OracleDataSourceFactory“

url="jdbc:oracle:thin:@10.0.0.1:1521:TEST“

user=“xxxx“

password=“pppp“

maxActive="20“

maxIdle="10“

maxWait="-1" />


15

Bir Yorumlayıcı Sayfa Oluşturmak


16

Bir Yorumlayıcı Sayfa Oluşturmak• Örnek yorumlayıcı sayfamız : webForm.jsp

<%@page language="java" %><%@page import="oracle.jdbc.pool.OracleDataSource" %><%@page import="javax.naming.Context" %><%@page import="javax.naming.InitialContext" %><%@page import="java.io.Serializable" %><%@page import="java.io.File" %><%@page import="java.sql.*" %><%@page import="java.util.*" %><%@page import="java.util.regex.*" %><%@page import="java.io.*" %>

<%@ page contentType="text/html; charset=UTF-8" pageEncoding="ISO-8859-9" %><%request.setCharacterEncoding("UTF-8");%><%

Connection conn = null;ResultSet rst = null;Statement stmt = null;PreparedStatement pstmt = null;String queryStr = null;String message = "Not Connected";

String ParameterNames = "";String f_url_name = "";String f_submit = "no";

for(Enumeration e = request.getParameterNames();e.hasMoreElements(); ) {

ParameterNames = (String)e.nextElement();//out.println(ParameterNames + " : " + request.getParameter(ParameterNames) + "<br/>");if (ParameterNames.equals("fname")) { f_url_name=request.getParameter(ParameterNames); }if (ParameterNames.equals("ss")) { f_submit="yes"; }

}

(1/4)

Forma doldurularak gönderilen verilerin alındığı

ve değişkenlere yerleştirildiği bloktur.

Çağrılan Web Form’un adını alacağımız parametre “fname” olsun.

(Önceki örnekte “ff” olarak bırakmıştık.)


17


try {Context initContext = new InitialContext();Context envContext = (Context) initContext.lookup("java:/comp/env");OracleDataSource ds = (OracleDataSource) envContext.lookup("jdbc/webForm");

if (envContext == null) throw new Exception("Error: No Context");if (ds == null) throw new Exception("Error: No DataSource");if (ds != null) conn = ds.getConnection();if (conn != null) {

message = "Got Connection " + conn.toString() + ", ";stmt = conn.createStatement(ResultSet.TYPE_SCROLL_SENSITIVE, ResultSet.CONCUR_READ_ONLY);

}

queryStr = " select * from XX_WEB_FORM_SETUP_TBL ";if (f_url_name.length()>0) { queryStr = queryStr + " where F_URL_NAME='" + f_url_name + "' "; }

pstmt= conn.prepareStatement(queryStr);rst = pstmt.executeQuery();

String formVal = null;String formID = null;String formFnc = null;String formFncPrm = " ";String formPrm = null;String formName = null;String formStatus = " ";

rst.next();formVal = rst.getString(1);formID = rst.getString(2);formFnc = rst.getString(3);formPrm = rst.getString(4);formName = rst.getString(5);

rst.close();rst = null;

(2/4)

Veritabanı bağlantısının sağlandığı bloktur.

Web Formumuz ile ilgili tanımlamaların veritabanından

okunduğu bloktur.


18


if (f_submit.equals("yes")) {for(Enumeration e = request.getParameterNames();

e.hasMoreElements(); ) {ParameterNames = (String)e.nextElement();if (ParameterNames.substring(0,1).equals("f") && ParameterNames.length()<5) {

formFncPrm = formFncPrm + "?, ";}

}

if (formFncPrm.length()>2) { formFncPrm=formFncPrm.substring(0,formFncPrm.length()-2); }

queryStr = "begin ? := "+formFnc+“ ("+formFncPrm+"); end; ";CallableStatement cstmt = conn.prepareCall(queryStr);

cstmt.setQueryTimeout(1800); cstmt.registerOutParameter(1, Types.VARCHAR); for(Enumeration e = request.getParameterNames();

e.hasMoreElements(); ){ParameterNames = (String)e.nextElement();if (ParameterNames.substring(0,1).equals("f") && ParameterNames.length()<5) { cstmt.setString(Integer.parseInt(ParameterNames.substring(1))+1,request.getParameter(ParameterNames));}

}cstmt.executeUpdate();formStatus=cstmt.getString(1);

}

formVal = formVal.replace("<#return#>",formStatus);formVal = formVal+"<script>document.getElementById('fname').value='"+formName+"';</script>";

out.println ( formVal );

stmt.close();stmt = null;conn.close(); // Return to connection poolconn = null;

(3/4)

Formdan gelen verinin veritabanındaki fonksiyona

gönderildiği bloktur.

Veritabanındaki fonksiyondan geri dönen cevabın web sayfasında belirlenen yerde ve formatta yazdırılabilmesi için özel bir

etiket eklenmiştir.<#return#>

Bu etiket standart değildir ve sadece bu yorumlayıcı sayfa tarafından yorumlanır.

Oluşturulan nihai HTML içerik, görüntülenecek Web

Formu olarak sayfaya yazılır.


19


} catch(Exception e) {out.println("Form Exception : " + e);

} finally {if (rst != null) {

try {rst.close();

} catch (SQLException e) {;}rst = null;

}

if (stmt != null) {try {

stmt.close();} catch (SQLException e) {;}

stmt = null;}

if (conn != null) {try {

conn.close();} catch (SQLException e) {;}

conn = null;}

}

%>

(4/4)Catch ve Finally bölümleri olası hatalara karşı hata mesajları ve veritabanı bağlantılarını kapatma

bloğudur.


20

Bir Yorumlayıcı Sayfa Oluşturmak• HTML ile bir Web Formu tasarlayalım demiştik, bunu tekrar gözden

geçirelim.– Önceden olanlar,

• Formun adını : ff• Veri alanlarının adını : f1, f2, f3, ..., fn• Submit düğmesinin adını : ss

– Yeni gelenler,• Görüntülenecek Web Formun seçimi için bir alan ekledik : fname• Veritabanından dönen cevabı sayfada göstermek için eklediğimiz yeni etiket:

<#return#>

<html><body>

<span style="color:blue">Telefon Rehberi</span><br><#return#><br>

<form method=“post” name=“ff“ id=“ff”> <input type=“hidden” name=“fname” id=“fname”>

İsim: <input type=“text” name=“f1” id=“f1”><br>Telefon: <input type=“text” name=“f2” id=“f2”><br><input type=“submit” name=“ss” id=“ss” value=“Kaydet”>

</form></body>

</html>


21

Senaryo’ya Devam!• Yeni bir Web Form oluşturalım !

İsim :

Şehir :

Üye Ol

XX_WEB_FORM_TEST2_TBL

F_NAME VARCHAR2(50 BYTE)F_EMAIL VARCHAR2(50 BYTE)F_CITY VARCHAR2(50 BYTE)

e-Posta :

e-Bültene üye olun!

CREATE TABLE XX_WEB_FORM_TEST2_TBL (

F_NAME VARCHAR2(50 BYTE),F_EMAIL VARCHAR2(50 BYTE),F_CITY VARCHAR2(50 BYTE),S_INSERT_DATE DATE DEFAULT sysdate

)

<html><body>

<span style="color:red; font-weight:bolder;">e-Bültene üye olun!

</span><br><#return#><br><form method=“post” name=“ff“ id=“ff”>

<input type=“hidden” name=“fname” id=“fname”> İsim : <input type=“text” name=“f1” id=“f1”><br> e-Posta : <input type=“text” name=“f2” id=“f2”><br> Şehir : <input type=“text” name=“f3” id=“f3”><br> <input type=“submit” name=“ss” id=“ss” value=“Üye Ol”>

</form></body></html>


22

Senaryo’ya Devam!• Yeni tablo için bir de fonksiyon oluşturalım.





)

CREATE FUNCTION XX_WEB_FORM_TEST2_ INS_FNC(P_NAME VARCHAR2, P_EMAIL VARCHAR2, P_CITY VARCHAR2) RETURN VARCHAR2 IS

STATUS VARCHAR2(200);BEGIN

STATUS := 'Kayıt Başarılı.'; INSERT INTO XX_WEB_FORM_TEST2_TBL

(F_NAME, F_EMAIL, F_CITY ) VALUES (P_NAME, P_EMAIL, P_CITY);

RETURN STATUS;EXCEPTION WHEN NO_DATA_FOUND THEN

RETURN 'Veri Yok!'; WHEN OTHERS THEN RETURN 'Hata:'||sqlerrm;END;


P_NAME VARCHAR2P_EMAIL VARCHAR2

P_CITY VARCHAR2

STATUS VARCHAR2

f(x)


23

Senaryo’ya Devam!• Oluşturduğumuz bileşenleri XX_WEB_FORM_SETUP_TBL tablomuzda

tanımlayalım.




P_NAME VARCHAR2P_EMAIL VARCHAR2

P_CITY VARCHAR2

STATUS VARCHAR2

f(x)

İsim :

Şehir :

Üye Ol

e-Posta :


INSERT INTO XX_WEB_FORM_SETUP_TBL VALUES (‘<html....’, 2, ‘XX_WEB_FORM_TEST2_ INS_FNC’, ‘e_bulten’);

Bu alanda Web Formumuzun tğm HTML kodu yer

almalı.


24

Senaryo’ya Devam!

İsim :

Şehir :

Üye Ol

e-Posta :


http://localhost/web_form.jsp?fname=e_bultenAddress

XTarayıcı

• Sonucu tarayıcı içinde görelim.– web_form.jsp?fname=e_bulten


25

Kodlara Genel Bakış<html><body>

<span style="color:red; font-weight:bolder;">e-Bültene üye olun!

</span><br><#return#><br><form method=“post” name=“ff“ id=“ff”>

<input type=“hidden” name=“fname” id=“fname”> İsim : <input type=“text” name=“f1” id=“f1”><br> e-Posta : <input type=“text” name=“f2” id=“f2”><br> Şehir : <input type=“text” name=“f3” id=“f3”><br> <input type=“submit” name=“ss” id=“ss” value=“Üye Ol”>

</form></body></html>



)

CREATE FUNCTION XX_WEB_FORM_TEST2_ INS_FNC(P_NAME VARCHAR2, P_EMAIL VARCHAR2, P_CITY VARCHAR2) RETURN VARCHAR2 IS

STATUS VARCHAR2(200);BEGIN

STATUS := 'Kayıt Başarılı.'; INSERT INTO XX_WEB_FORM_TEST2_TBL

(F_NAME, F_EMAIL, F_CITY ) VALUES (P_NAME, P_EMAIL, P_CITY);

RETURN STATUS;EXCEPTION WHEN NO_DATA_FOUND THEN

RETURN 'Veri Yok!'; WHEN OTHERS THEN RETURN 'Hata:'||sqlerrm;END;

INSERT INTO XX_WEB_FORM_SETUP_TBL VALUES (‘<html....’, 2, ‘XX_WEB_FORM_TEST2_ INS_FNC’, ‘e_bulten’);

web_form.jsp?fname=e_bulten


26

Notlar

• HTML ile ilgili W3 sitelerini inceleyebilirsiniz,

– http://www.w3schools.com/html/default.asp

– http://www.w3.org/TR/html-markup/

• Apache için,

– http://www.apache.org

• Tomcat için,

– http://tomcat.apache.org

• JAVA ile ilgili Oracle/SUN sitesini inceleyebilirsiniz,

– http://www.oracle.com/technetwork/java/index.html

– http://java.sun.com/products/jsp/syntax/2.0/syntaxref20.html

• PL/SQL ile ilgili Oracle sitesini inceleyebilirsiniz,

– http://download.oracle.com/docs/cd/B10500_01/appdev.920/a96624/toc.htm

pl/sql üzerinden web sayfası üretmek

Documents