Installera en egen webbserver för utveckling

By . Latest revision .

Se till att du har en egen lokal utvecklingsmiljö för dina webbsidor. I dbwebb-kurserna så använder vi alltid en driftsserver dit vi laddar upp resultatet när vi är klara. Men det underlättar om man har en egen utvecklingsmiljö så att man inte är beroende av studentservern.

#Webbserver Apache httpd med PHP och databas

Det finns ett antal sätt att installera Apache och PHP. Välj ett som du känner dig bekväm med.

Som rekommenderad miljö på Windows och Mac OS används XAMPP.

När du väljer miljö på Mac så välj den som inte heter VM i namnet. Det står för virtual machine och den vill vi undvika. Du kan läsa mer om detta i forumet.

Jag har valt att använda XAMPP eftersom den är open source och fungerar bra. XAMPP är lätt att installera och komma igång med och den har ett trevligt och enkelt gränssnitt. Dessutom finns den både till Windows, Mac OS och Linux.

Tidigare användes WAMPServer (Windows) och MAMP (Mac). Alla tre fungerar för kurserna och du kan välja vilken du vill. Får du problem så kommer jag troligen be dig använda XAMPP.

#Installera XAMPP

Så här installerade jag:

1) Gå till hemsidan för XAMPP och ladda ned det paketet du vill ha (Windows, Mac).

2) Kör en ren installation, se till att du är Administratör på din Windows-maskin (för att undvika problem).

3) Ändra så att Apache kör på 8080 (för att undvika problem när någon annan redan kör på port 80, typ Skype eller befintlig webserver). I Mac klickar du på “Configure” och ändrar port i rutan som poppar upp. I Windows är det lite krångligare, du gör så här.

3.1) Öppna Apaches konfigfil httpd.conf genom att klicka på knappen “Config” och väljer sedan “Apache (httpd.conf)” i den menyn som kommer upp.

Öppna konfigfilen till Apache.

Öppna konfigfilen till Apache.

3.2) En texteditor öppnar filen httpd.conf. Leta reda på raden som säger:

Listen 80

Ändra den raden så att Apache lyssnar på port 8080 istället för port 80.

Listen 8080
Byt port som Apache kör på för att undvika krockar med andra program.

Byt port som Apache kör på för att undvika krockar med andra program.

4) Klar. Starta Apache

Starta Apache webbserver.

Starta Apache webbserver.

Apache har startat.

Nu snurrar Apache webbserver på din lokala maskin.

Nu snurrar Apache webbserver på din lokala maskin.

5) Peka webbläsaren till http://localhost:8080/ eller http://127.0.0.1:8080 (kopiera in länkarna till din webbläsare). Så här kan det se ut när XAMPPs standard hemsida visas.

XAMPPs hemsida på din lokala maskin visas.

XAMPPs hemsida på din lokala maskin visas.

6) Xampp installeras i C:\xampp och webrooten ligger i C:\xampp\htdocs på Windows och i Mac OS gäller /Applications/XAMPP/htdocs. Gör följande steg för att testa din installation genom att skapa en HTML-sida och en PHP-sida.

6.1) Skapa en katalog test i din htdocs-katalog (din webroot).

Katalogen `test` skapas i filväljaren.

Katalogen test skapas i filväljaren.

6.2) Öppna samma katalog i din webbläsare. Länken dit är http://localhost:8080/test eller http://127.0.0.1:8080/test. Katalogen är tom för tillfället.

Katalogen `test` öppnad i webbläsaren via webbservern.

Katalogen test öppnad i webbläsaren via webbservern.

6.3) Skapa två filer i katalogen och döp dem till test.html (en HTML-sida) och test.php (en HTML -sida med PHP-kod).

Två filer skapade i katalogen test via filväljaren.

Två filer skapade i katalogen test via filväljaren.

Kontrollera att du även ser filerna i din webbläsare genom att ladda om sidan (ctrl-r eller F5).

De nyskapade filerna är synliga via webbservern.

De nyskapade filerna är synliga via webbservern.

6.4) Öppna de båda filerna i din texteditor och lägg in följande kod i dem.

Kod till HTML-sidan test.html.

<!doctype html>
<meta charset="utf-8">
<title>My test page</title>
<h1>My nice test page for PHP</h1>
Filen `test.html` skapas i texteditorn.

Filen test.html skapas i texteditorn.

Kod till PHP-sidan test.php.

<!doctype html>
<meta charset="utf-8">
<title>My test page</title>
<h1>My nice test page for PHP</h1>
<p>
<?php echo "Hello Wold from PHP!"; ?>
</p>
Filen `test.php` skapas i texteditorn.

Filen test.php skapas i texteditorn.

6.5) Öppna de båda filerna i din webbläsare för att se hur de ser ut.

  • http://127.0.0.1:8080/test
Filerna ligger i katalogen och är synliga via webbläsaren.

Filerna ligger i katalogen och är synliga via webbläsaren.

  • http://127.0.0.1:8080/test/test.html
Visa filen `test.html` i webbläsaren.

Visa filen test.html i webbläsaren.

  • http://127.0.0.1:8080/test/test.php
Visa filen `test.php` i webbläsaren.

Visa filen test.php i webbläsaren.

Nu fungerar din installation av XAMPP tillsammans med HTML- och PHP-sidor.

Det finns en forumtråd där du kan få hjälp om installationen krånglar.

Säg att du har en katalog i din hemmakatalog, som du vill skall synas via webbservern. Lös det med en symbolisk länk från webbkatalogen till den katalog du vill visa.

Som exempel, säg att du har en katalog dbwebb-kurser i din hemmakatalog och du vill öppna den via webblänken http://localhost/dbwebb/ (eller http://localhost:8080/dbwebb/ om du har valt en annan port). Du behöver då en länk dbwebb, som ligger i webbkatalogen och som pekar på katalogen dbwebb-kurser som ligger i din hemmakatalog.

Följ nedan instruktioner för att skapa länken på Windows eller på Mac OS.

#Skapa länk på Windows

I Windows ligger din webbkatalog ofta under c:\xampp\htdocs. Du kan länka till en katalog med kommandot mklink i kommandoprompten. Öppna “Command Prompt” som administratör och kör följande kommando.

mklink /D c:\xampp\htdocs\dbwebb %USERPROFILE%\dbwebb-kurser

Konstruktionen %USERPROFILE% motsvarar din hemmakatalog. Du kan även ange hela sökvägen till din hemmakatalog. I mitt fall hade det varit följande.

mklink /D c:\xampp\htdocs\dbwebb c:\Users\Mikael\dbwebb-kurser

Nu är länken skapad.

För att få hjälp med kommandot skriver du följande.

mklink /?

#Skapa länk på Mac OS

I Mac OS heter kommandot ln och en vanlig plats för webbkatalogen är /Applications/XAMPP/htdocs. Öppna din terminal och skapa länken på följande sätt.

cd /Applications/XAMPP/htdocs
ln -s $HOME/dbwebb-kurser dbwebb
ls -l dbwebb

Så kan du skapa länken och testa att den skapades.

#Apache på Linux och andra plattformar?

Det finns många andra plattformar att köra webbserver med PHP och databas på. Använder du Linux kan du köra XAMPP eller installera det på egen hand med en pakethanterare.

#Äldre installationsbeskrivningar

Dessa användes tidigare som installationsinstruktioner.

Felsökning på Windows med WAMPServer.

Möjliga problem vid installation på Windows:

  • Klicka på “Put Online” i menyn (nedre högra hörnet) för WAMPServer.

  • Det finns en konflikt mellan WAMP och Skype. Vid problem vid installation av WAMP; testa att först stänga av Skype.

  • Finns det redan en webbserver på din maskin, tex IIS?

  • Har du sedan tidigare installerat MySQL?

  • Vid problem, kontrollera alltid vad det står i loggfilerna för Apache, MySQL och PHP?

#Revision history

  • 2018-08-21: (F, mos) Information om Mac och inte VM.
  • 2015-08-17: (E, mos) La till info om symboliska länkar.
  • 2015-04-10: (D, mos) Tog bort referens till jEdit.
  • 2015-01-21: (C, mos) Ändrade hur man byter port på Apache i Windows.
  • 2014-09-15: (B, mos) Bytte till XAMPP och lade hit instruktionen från forumtråd.
  • 2012-08-29: (A, mos) Första versionen, flyttad från annat dokument och uppdaterad.

Document source.

Category: labbmiljo.