تصميم المواقع باستخدام isapi

[زكيري عبدالعالي]

المطلوب
1- تثبيت MYSQL و انشاء الجدولين
2- تثبيت IIS
3- بالطبع الدلفي
4- محرر لHTML مثل edit++

كود :

http://www.arabteam2000-forum.com/uploads/monthly_02_2009/post-1034-1233518412.jpg

كود :

http://www.arabteam2000-forum.com/uploads/monthly_02_2009/post-1034-1233518598.jpg

كود :

http://www.arabteam2000-forum.com/uploads/monthly_02_2009/post-1034-1233518904.jpg

المطلوب صنع صفحة HTML اسمها INDEX.HTML
بها المعلومات التالية
بســم الله الـرحمــن الرحيــم
مرحبا بكم اسمي <#NOM>
ثم تجريي الصفحة دون عمل كود الدلفي على جهازك عن طريق
localhost

كود :

http://www.arabteam2000-forum.com/uploads/monthly_02_2009/post-1034-1233519689.jpg

[زكيري عبدالعالي]

اذا كتبنا
localhost
نتحصل على الصفة المطلوبه اي اسمي على
اذا نجحت في ذلك نمر الى

4- وضع متغيرة NOM في الصفحة بالشكل

كود :

اسمي <#NOM>

حيث نقوم بكتابت مشروع دلفي ISAPI يقوم بكتابه (علي علوي)
مكان NOM
كيف ذلك

كود :

file--> new-->other..-->webserverapplication-->ispai === WebModule1

في شريط االدوات نختار المكون

كود :

nternet--->PageProducer === PageProducer1

في الخاصية

كود :

HTMLFile -- > مسار الملف و اسمه

في الحدث

كود :

ONHTMLTag

كود :

Producer1HTMLTag(Sender: TObject; Tag: TTag; const TagString: Strin g; TagParams: TStrings; var ReplaceText: String);BEGIN IF uppercase(TagString)='NOM' THEN ReplaceText:='علي علوي';END;

الان سنضيف اكشن التي ستنفذ لنا عملية عرض الصفحة.
لا حظ الصورة
ثم نكتب الكود التالي في الحدث

كود :

PROCEDURE TWebModule1.WebModule1gotoindexAction(Sender: TObject; Request: TWebRequest; Response : TWebResponse; var Handled: Boolean);BEGIN Response.Content:=PageProducer1.Content;END;

ماعلينا الان الا الكمبيل لكي نتحصل على ملف DLL و ليكن PROJECT1.DLL
نضع هذا الملف في المسار الذي تريده و مثالنا سنضعه في
C:\Apache\htdocs\bin
حيث اضف bin مجلد جديد

[IMG]http://www.arabteam2000-forum.com/uploads/monthly_02_2009/
post-1034-1233862980.jpg[/IMG

كود :

] http://www.arabteam2000-forum.com/uploads/monthly_02_2009/post-1034-1233862986.jpg

كود :

http://www.arabteam2000-forum.com/uploads/monthly_02_2009/post-1034-1233863335.jpg

II- كيفية فتح ملف html بواسطة ACTION ISAPI
---------------------------------------------------------------------------------
*- الان سنقوم بانشاء صفحة اشتامل ولنسميها مثلا
myhtmlfile.html

*-نضع الملف في C:allsourcehtml
نضع المكون
PageProducer1
في الخاصية
HTTPFILE
نكتب

كود :

C:\allsourcehtmlmyhtmlfile.html

في الحدث
PageProducer1HTMLTag
نكتب

كود :

procedure TWebModule1.PageProducer1HTMLTag(Sender: TObject; Tag: TTag; const TagString: String; TagParams: TStrings; var ReplaceText: String);begin IF UpperCase(TagString)='NOM' THEN ReplaceText:='ZEKIRI ABDELALI ISAPI V0.1 ';end;

[زكيري عبدالعالي]

3- مرحلة الثالثة منادات اكشن من رابطة ملف html

فبي المثال الاول تعلمنا كيف نكتب سكريبت اشتمل في داخل الدلفي و عرضه في المستكشف اما المثال الثاني تعلمنا كيف نفتح صفحت اشتمل بواسطة اكشن اما الان سنقوم بعمل رابطة تسمح بمنادات اكشن والتي بدورها تقوم بفتح صفحة جديدة اشتمل .

1- ننشا ملف اشتمل جديد اسمه مثلا

كود :

C:\allsource\html\my2htmlfile.html

نضيف مكون جديد اللى الواب مودب
PageProducer2
نربطه مع الملف الجديد فب الخاصية
HTMLFILE
و في الحدث نكتب

كود :

procedure TWebModule1.PageProducer2HTMLTag(Sender: TObject; Tag: TTag; const TagString: String; TagParams: TStrings; var ReplaceText: String);begin IF UpperCase(TagString)='NOM' THEN ReplaceText:='ZEKIRI'; IF UpperCase(TagString)='PNOM' THEN ReplaceText:='ABDELALI'; IF UpperCase(TagString)='AGE' THEN ReplaceText:='33'; IF UpperCase(TagString)='TEL' THEN ReplaceText:='0609690006';end

ننشا اكشن جدي نسميها Goto2htmlfil
في الخاصية PATHINFO نكتب /GOTO2
وفي الحدث ONACTION نكتب

كود :

procedure TWebModule1.WebModule1Goto2htmlfilAction(Sender: TObject; Request: TWebRequest; Respo nse: TWebResponse; var Handled: Boolean);begin Response.Content := PageProducer2.Content;end;

انشاء الرابطة
نغير في الملف الاشتمل الاول و الذي سميناه
myhtmlfile.html
نكتب
نغير في الكود اسم المتغيرة

كود :

IF UpperCase(TagString)='MSG' THEN ReplaceText:='View file of the student :zekiri abdelali';[/CODE [code]] http://www.arabteam2000-forum.com/uploads/monthly_02_2009/post-1034-1233952433.jpg

[زكيري عبدالعالي]

بســم الله الـرحمــن الرحيــم
بعد هذه المقدمت سنيدا المشروع بحول الله و كما قلت انه لتعليم وبعدها ان كان الوقت و الصحت نعرفه ليصبح احترافي .
اولا انشاء قاعدة البيانات
1- نقوم بتثبيت
mysql-5.1.31-win32.msi
2- ايضا
SQL Manager for MySQL
3-انشاء القاعدة
GEST_COMPTE

كود :

http://www.arabteam2000-forum.com/uploads/monthly_02_2009/post-1034-1233954821.jpg

1- افتح مشروع جديد
1- سمي الواب مودبل باسم
WebM
2-اضف الاكشن التالية
*- Login => /
الاكشن 1 يفتح لنا صفحة واب يطلب فيها ادخال اسم المستخدم و كلمة السر
------------------------------------
*- Admin_OP => /listop
*-AddUpdateOP => /addupop
*-ValidAdupOP =>/validop
2 نعرض فيها قائمة العمليات مرتبة حسب التاريخ
3 اكشن يقوم بعرض صفحة الاضافة و التغيير للعملية الواحدة
4اكشن ياكد التغيير على مستوى القاعدة.

------------------------------------
*-Admin_C => /listc
*-AddUpdateC=>/addupc
*-ValidAdUpc =>/validc

-قاءمت المؤسسات او اي فاعل حدث سحب او ادخال مال الى الرصيد
عرض صفحه الاضافة و التغيير
تاكيد الحفظ
-------------------------------------
3-صفحات الاشتمل HTML
login.html
فيها نجد اسم المستخدم و كلمت السر و زر المزافقه
listop.html
فيه نجد جدول به جميع حقول جدول العمليات في شكل قاءمة
addupop.html
فيه نجد به جميع حقول جدول العمليات في شكل عناصر ادخال
txtbox
listc.html
//
addupc.html
//
-------------------------------------
3-المكونات
ضع مكون الاتصال مع قاعدة اليانات و اجري الربط
SQLConnection1
ضع 5 مكونات ربط صفحات الاشتمل
PageProducer1
تغير الاسم
PgP...... مثال PgPlistc

و اجري الربط

------------------------------------
ملاحظ
نترك CSS et js في الاخير

اذا اصبحت الامور كما في الصورة

اما عن طريقة الربط مع مي اسكل ان افضل مكونات مايداكDAC
و هي كا التالي الصورة 2

كود :

http://www.arabteam2000-forum.com/uploads/monthly_02_2009/post-1034-1234115876.jpg

كود :

http://www.arabteam2000-forum.com/uploads/monthly_02_2009/post-1034-1234115774.jpg

1- الهدف من الكود الاول هو عرض قاءمة comptes في المستكشف
لقد اضفت تسجيلات في الجدول لتضهر النتيجه الصورة تبين دلك

كود :

{==============================================================================}{ UwebmGestC : aaplication ISAPI DELPHI sur APACHE . @ - ZEKIRI ABDELALI . @- 07-02-2009 .{==============================================================================}unit UwebmGestC;{------------------------------------------------------------------------------}interface{------------------------------------------------------------------------------}uses SysUtils, Classes, HTTPApp, DBXpress, DB, SqlExpr, HTTPProd, ADODB,DBAccess, MyAccess;{------------------------------------------------------------------------------}type TWebM = class(TWebModule) PgpLogin : TPageProducer; ConGestCompt: TMyConnection; Pgplistc : TPageProducer; Pgplistop : TPageProducer; Pgpaddupop : TPageProducer; Pgpaddupc : TPageProducer; {------------------------------------------------------------------------------}{################### ALL TAG #################################################{------------------------------------------------------------------------------} procedure PgplistcHTMLTag(Sender: TObject; Tag: TTag;const TagString: String; TagParams: TS trings;var ReplaceText: String); {------------------------------------------------------------------------------}{################### ALL ACTION ################################################{------------------------------------------------------------------------------} procedure WebMAdmin_CAction(Sender: TObject; Request: TWebRequest;Response: TWebResponse; v ar Handled: Boolean); {------------------------------------------------------------------------------} PRIVATE { Private declarations } FUNCTION Get_ListC():string;{------------------------------------------------------------------------------} PUBLIC { Public declarations } {------------------------------------------------------------------------------} END; {------------------------------------------------------------------------------}VAR WebM: TWebM; {------------------------------------------------------------------------------}IMPLEMENTATION {$R *.dfm} {------------------------------------------------------------------------------}{################### ALL FUNCTION ##############################################{------------------------------------------------------------------------------}FUNCTION TWebM.Get_ListC():string;VAR vQueryListC : TMyQuery; str : String;BEGIN str:=''; vQueryListC:=TMyQuery.Create(nil); TRY WITH vQueryListC DO BEGIN Connection:=ConGestCompt; SQL.Text:='SELECT ID_C,LIB_C FROM compte ORDER BY LIB_C'; TRY Open; WHILE NOT (Eof) DO BEGIN str:= str + ' ' + ' ' + FieldByName('ID_C').AsString + ' ' + ' ' + FieldByName('LIB_C').AsString + ' ' + ' ' ; NEXT; END; EXCEPT ON E:exception DO //LOG(''+E.Message); Result:=E.Message; END; END; FINALLYvQueryListC.Close; vQueryListC.Free; Result:=str; END;END; {------------------------------------------------------------------------------}{################### ALL TAG #################################################{------------------------------------------------------------------------------}PROCEDURE TWebM.PgplistcHTMLTag(Sender: TObject; Tag: TTag;const TagString: String; TagParams: TStrings; var ReplaceText: String);BEGIN IF UpperCase(TagString) = 'LISTECOMPTE' THEN BEGIN ReplaceText:= Get_ListC(); END;END; {------------------------------------------------------------------------------}{################### ALL ACTION ################################################{------------------------------------------------------------------------------}PROCEDURE TWebM.WebMAdmin_CAction(Sender: TObject; Request: TWebRequest;Response: TWebResponse; var Handled: Boolean);BEGIN Response.Content:= Pgplistc.Content;END; END.

كود :

<html> <head> <title>Liste des Comptes</title> <head> <body> <table> <#LISTECOMPTE> </table> </body> </html>

ابع
الان سنقوم بانشاء صفحة CSS لتضهر النتيجة في شكل جيد
gestc.css
نضع هذا الملفي في مجلد جديد اسمه css في المسار
C:\allsource\html\css\gestc.css

نظيف في اعلى الملف html

كود :

table.blue { background-color: #DAE6FC; border: 1px; border-collapse: collapse; width:99%; } .row1 { background: #F0F8FF; color : Black; } .row2 { background: White; color : Black; }

------------------------
المطلوب
كتابة الكود في الدلفي كي يعرض الجدول الازرق و الاسطر
ازرق تارة و ابيض تارة اخرا زهنا انتم بحاجة الى MOD
2 = 0 ;
-------------------------
كي تسهل الامور في الوهلة الاولي ضع الملف Css في HTML

ملاحضة--------------------------------
يمكنك سرقت احد اعضاء مبرمجين الواب لمساعدتك في هذه المرحة هم اصحاب الخبرة ولان خبرتي محدودة في الانماط

كود :

http://www.arabteam2000-forum.com/uploads/monthly_02_2009/post-1034-1234220288.jpg

[hasob2000]

اشكرك اخ زكيري على الموضوع الرائع و المهم جدا لمن يريد تشغيل التطبيق عن طريق الانترنت
لكن الموضوع يتطلب المزيد من التوضيح لأنة يحتوي على معلومات كثيرة معتمده على بعضها البعض

بالنسبة الي استخدمت isapi عن طريق Datasnap
و هي اسهل في الاستخدام

[زكيري عبدالعالي]

الحقيقة اني كتبت الموضوع مذوا فترة في منتداي الاخر لكني احببت اك اعيده هنا لافيد به اعضاء المتدي الغالي
اما عن ISAPI و CGI DATASNAP و حتى محركات XML المتتجة بالدلفي وObjet COM ASP كلها ادوات برمج مواقع الويب قديمة جدا .
صح اضيف الكثير في DATASNA لكن مازال يعيد عن البرمجة البسيطة التي يةفرها دلفي بريسم .
سانقل الدروس المتبقة لاحقا كي نناقشها
اما عن ISAPI HTML ابدا ان كنت ترغب تجربة المثال و ان شاء الله اكون هنا لمساعدتك .

[زكيري عبدالعالي]

مواقع من انشائي بهذه التقنية
1-

كود :

http://register.compubase.net/login?part=&lang=E