Gör en enkel ASP-gästbok

En gästbok där besökarna kan skicka en hälsning och visa länk till hemsidan

Här kommer du att lära dig att göra en enkel men funktionell gästbok. Allt som skrivs i gästboken sparas i en vanlig textfil. Du behöver alltså inte kunna hantera en databas för detta.

Observera att funktionen kräver tillgång till ASP-server. Filerna kan inte köras på en vanlig server utan ASP.

Varför göra en egen gästbok?

Det finns påtagliga fördelar med en egen gästbok framför de flesta av de gratisvarianter som finns att hämta på Internet.

  • Så länge din server fungerar, kommer gästboken att finnas tillgänglig. Du riskerar inte att den plötsligt försvinner därför att den tjänst du anlitar läggs ned.
  • Du har fullständig kontroll över gästboken och det är lätt att rensa bort olämpliga inlägg i den.
  • Du slipper helt och hållet den reklam som man oftast tvingas visa när man använder "gratisgästböcker".
  • Beroende på var du placerar textfilen på servern, kan du känna dig hyggligt säker på att besökarnas e-postadresser inte hamnar i något spam-register!
Det finns nackdelar också

Just den här skolan är mest till för att visa att man kan göra en egen gästbok och hur det kan göras. Gästboken är mycket enkel. Det gör att den saknar en del funktioner som man kanske skulle önska sig:

  • Det finns ingen administratörsfunktion. Det betyder att man måste ta hem textfilen för att rensa den för hand. I och för sig är det inte särskilt besvärligt, men å andra sidan känns det inte särskilt proffsigt.
  • Om du låter all validering (kontroll av innehållet i formuläret) göras med bara javaskript, blir gästboken känslig för automatisk spamming. Det beror på att spammarna inaktiverar javaskript i webbläsaren, varpå skriptet som skall validera formuläret inte körs. Den typen av validering kallas "client side validation" och duger oftast. Men när spammarna väl har hittat gästboken, måste man rensa mer eller mindre dagligen.

    Man kan dock göra kontrollen betydligt säkrare genom att utföra den på servern, innan inlägget skrivs in i gästboken. Denna "server side validation" görs med asp-koden och kan inte påverkas av de inställningar spammaren har i sin webbläsare.

Filer som du behöver

Du kommer att behöva sammanlagt tre filer:

  1. gester.txt – det är i denna textfil som besökarnas uppgifter och hälsningar kommer att sparas. Se till att du har läs- och skrivrättigheter till den här filen. Om du måste ändra detta men inte kan själv, ber du supporten på webbhotellet om hjälp! Filen skall placeras antingen i samma mapp som de båda övriga filerna, eller utanför din rotkatalog. Den senare metoden är att föredra, eftersom filen blir mer skyddad på det sättet. Genom webbhotellets support kan du få uppgiften om exakt vilken sökväg du i så fall skall använda.
  2. default.asp – sidan som visas för besökarna. Sidan kommer att innehålla ett formulär och det är dessutom på denna sida som alla tidigare inlägg i gästboken visas.
  3. skriv.asp – filen som innehåller koden som gör det mesta av jobbet. Den här filen kommer aldrig att visas för besökaren.

Till att börja med kan du placera alla tre filerna i samma mapp - det gör att det blir enklare att kontrollera i din Personal Web Server (Windows 98) eller Internet Information Server (Windows XP Pro och Windows 2000) att allt fungerar.

Textfilen

Under Inetpub\wwwroot (i din PWS/IIS) skapar du en ny mapp som du kallar "gestbok". Öppna Anteckningar eller den txt-redigerare du normalt använder och skapa en ny fil. Gör tills vidare ett enda mellanslag och spara filen som gester.txt i den nya mappen.

Senare skall vi fiffa till den här filen en aning, men just nu behöver den bara ett mellanslag.

Gör ytterligare två filer – default.asp och skriv.asp – och spara dem i samma mapp.

Nu har du allt du behöver för att börja skriva koden. Först skall jag helt kort förklara hur det fungerar.

Så här går det till

Besökaren kommer till sidan default.asp, som visar ett formulär och en lista med alla tidigare inlägg. Det nyaste inlägget visas överst i listan. Besökaren fyller i formuläret och klickar på "Skicka".

Nu kontrolleras att formuläret är rätt ifyllt. Därefter tas uppgifterna från formuläret med till filen skriv.asp, där det nya inlägget först kontrolleras – det skall finnas ett namn och ett inlägg, och inlägget skall inte börja med html-kod – och sedan sparas i samma fil som de tidigare inläggen.

Sedan öppnas en uppdaterad version av sidan default.asp, och besökaren ser sitt eget inlägg överst i listan.

Det här låter enkelt men kräver en del kodskrivande. Du kan kopiera all kod direkt från den här skolan.

Här kan du se hur det fungerar i praktiken. Gästboken öppnas i en egen sida, som du bara behöver stänga för att komma tillbaka hit.

Börja med koden

Besökarsidan default.asp – HTML-koden

Först av allt skall du i filen default.asp skriva in den grundläggande HTML-koden. Ta med allt sådant som du normalt har på alla sidor. Glöm inte din eventuella stilmall. Anpassa värdena efter dina egna behov.

Den här "mallen" skall fyllas med en hel del annat, men spara den först som default.asp.

<HTML>
<HEAD>
<TITLE>Gästbok</TITLE>
<LINK REL="stylesheet" HREF="text.css" TYPE="text/css">
</HEAD>
<BODY topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
<TABLE border="0" width="640" cellspacing="0" cellpadding="3">
<TR><TD width="100%">
<H3>Gästbok</H3>

</TD></TR>
</TABLE>
</BODY>
</HTML>


Formuläret

Nästa steg blir formuläret. Placera det i tomrummet under rubriken Gästbok. Koden ser ut så här – jag förklarar under koden.

<P><FORM NAME="frmgestbok" METHOD="POST" ACTION="skriv.asp" onSubmit="return kollaFormulaer();">
<INPUT NAME="mitt_namn" TYPE="TEXT" SIZE=35 onFocus="if (this.value==this.defaultValue) this.value='';"
onBlur="if (this.value=='') this.value=this.defaultValue;" VALUE="Skriv ditt namn"><BR>
Min text:<BR>
<TEXTAREA name="mitt_inlagg" cols="35" rows="5"></TEXTAREA><BR>
<INPUT NAME="e_post" TYPE="TEXT" SIZE=35 onFocus="if (this.value==this.defaultValue) this.value='';"
onBlur="if (this.value=='') this.value=this.defaultValue;" VALUE="E-postadress"><BR>
<INPUT NAME="hemsida" TYPE="TEXT" SIZE=35 onFocus="if (this.value==this.defaultValue) this.value='';"
onBlur="if (this.value=='') this.value=this.defaultValue;" VALUE="Hemsida (uteslut http://)"><BR>
<INPUT TYPE="SUBMIT" VALUE="Skicka">
</FORM></P>


Förklaringar till formuläret

Formuläret har fått ett namn, frmgestbok. Vilket annat namn som helst duger, men det är praktiskt att använda "prefixet" frm på formulär som skall anropas av ASP-skript, eftersom man då lätt ser att det är just ett formulär som anropas. Undvik att använda å, ä, ö eller mellanslag i namn som skall utnyttjas i ASP-skript.

Formuläret har också en metod – post – och en action. Den senare säger att uppgifterna från formuläret skall tas med till sidan skriv.asp.

Slutligen innehåller FORM-raden en händelsehanterare – onSubmit – som anropar ett javaskript. Vi återkommer till detta alldeles strax.

I formuläret finns vidare tre INPUT-rader och en TEXTAREA. Samtliga har fått unika namn, vilket är viktigt litet längre fram.

Slutligen finns en knapp, på vilken det står "Skicka".

Titta på de tre INPUT-raderna av typen TEXT. Alla tre innehåller händelsehanterarna onFocus och onBlur, och alla har ett defaultvärde (VALUE). Dessa VALUE kommer vi att utnyttja.

Genom att använda händelsehanterarna på det här sättet, behöver vi inte skriva förklarande texter till de tre textraderna. Denna text syns redan i respektive rad när sidan laddas. När besökaren klickar i en rad, försvinner den ursprungliga texten. Om han klickar utanför raden utan att skriva någonting, kommer ursprungstexten tillbaka.

Den text som finns i respektive rader och textarean när besökaren klickar på "Skicka", följer med till först javaskriptet och sedan sidan skriv.asp.

Javaskriptet

Vi vill inte att besökarna skickar inlägg utan att ange något namn, eller utan att skriva något i textarean. Därför skall vi kontrollera att det finns något skrivet i dessa delar av formuläret.

Däremot gör vi inte denna kontroll när det gäller e-postadress eller hemsida – det bör ju stå var och en fritt att avgöra om han vill ange dessa uppgifter eller inte.

Med javaskriptet skall vi kontrollera att det inte står "Skriv ditt namn" i första raden och att textarean inte är tom. Därför skickar vi iväg uppgifterna till javaskriptet i sidans HEAD-element, innan de får fortsätta till skriv.asp.

Den här första kontrollen är mycket enkel – på sidan skriv.asp kommer vi senare att göra en grundligare kontroll, en så kallad server side-validering. Det beror på att en besökare som har kopplat bort javaskriptfunktionen i webbläsaren lätt går förbi den enkla kontrollen via javaskript. Att ta sig förbi kontrollen som sker på servern är betydligt svårare.

Javaskriptet ser ut så här – placera skriptet i HEAD-elementet, till exempel omedelbart före den avslutande HEAD-taggen:

<!-- Kontrollera att besökaren har skrivit ett namn och ett inlägg -->
<SCRIPT language="JavaScript">
<!-- Copyright: Karin Andersson, www.supportdata.net

function kollaFormulaer () {
//Namn
if (document.frmgestbok.mitt_namn.value=="Skriv ditt namn"){
   alert("Skriv in ditt namn");
   document.frmgestbok.mitt_namn.focus();
   return false;
}
//Inlägg
if (document.frmgestbok.mitt_inlagg.value==""){
   alert("Skriv ett inlägg");
   document.frmgestbok.mitt_inlagg.focus();
   return false;
}
   return true
}
// -->
</SCRIPT>


Förklaringar till javaskriptet

När besökaren klickar på "Skicka" vaknar formulärets onSubmit="return kollaFormulaer();" till liv.

Först kontrolleras att formulärets "mitt_namn" inte innehåller "Skriv ditt namn". I så fall öppnas en meddelanderuta som uppmanar besökaren att skriva in sitt namn. När besökaren stänger denna ruta får formulärets namnrad fokus.

Sedan undersöks om textarean "mitt_inlagg" är tom. I så fall öppnas en annan meddelanderuta och när denna stängs har formulärets textarea fått fokus.

Om både namnraden och textarean är ifyllda (det räcker i och för sig med ett mellanslag) går kodkörningen tillbaka till formuläret och fortsätter därifrån till sidan skriv.asp.

Spara default.asp

Därmed är all HTML-kod färdig i sidan default.asp. Vi skall fylla på med ASP-kod litet senare, men för att det hela skall bli lättare att förstå fortsätter vi först till filen skriv.asp. Glöm inte att spara filen default.asp.

  Nästa: Filen skriv.asp >>

© SupportData.Net