- Jesteś tutaj: Portal -> Artykuły -> Tworzenie stron -> Tworzenie dynamicznej strony w asp.NET
Wykonamy strony dla firm, osób prywatnych, klubów sportowych, itp. Od prostej wizytówki dla firmy, przez hobbystyczny wortal po bardziej skomplikowane portale, choćby społecznościowe. Oferumy również wykonanie profesjonalnej grafiki. Kontakt gg: 6025719, email: lukiradom@gmail.com. Portfolio: freelancemedia.pl.
Tworzenie dynamicznej strony w asp.NET
1. Wprowadzenie
- a) Co to jest asp.NET?
- b) Jakie narzędzia są potrzebne?
- c) Hosting asp.NET
2. Zaczynamy!
- a) Zapoznanie się ze środowiskiem
- b) Tworzymy Master Page
- c) Tworzymy nowe strony (pliki .aspx)
- d) Wracamy do Master Page (trzeba zrobić linki)
- e) Konfiguracja strony i tworzenie nowej bazy
- f) Łączymy się z bazą danych
- g) Ulepszamy stronę
- h) Wgrywamy pliki na serwer
1. Wprowadzenie
- a) Co to jest asp.NET?
Są różne języki programowania, dzięki którym stworzymy stronę www. Zapewne znacie HTML, służący do opisu stron www, może znacie PHP, który często jest używany do budowy portali. Dziś chcę Wam przedstawić inne środowisko, jakim jest asp.NET.
ASP (ang. Active Server Pages) to technologia firmy Microsoft służąca do tworzenia dynamicznych stron www z wykorzystaniem języków VBS i VC#. Tyle informacji powinno
wystarczyć.
- b) Jakie narzędzia są potrzebne?
Aby móc tworzyć stronę w asp.NET, musimy pobrać darmowe narzędzia:
I. Visual Studio 2005 Web Developer - aplikacja służaca do tworzenia i zarządzania witrynami asp.NET, do
pobrania tutaj
II. MS SQL Server 2005 - serwer baz danych, do pobrania tutaj
III. Microsoft Framework 2.0, instalator w paczce wraz z Visual Studio 2005 Web Developer
IV. System Windows XP Professional z dodatkiem Servic Pack 2, sp2 do pobrania
tutaj
- c) Hosting asp.NET
Będziemy używać hostingu HostedWindows.pl. Należy się tam zarejestrować. Po otrzymaniu loginu i hasła
możemy przystąpić do tworzenia naszej strony.
2. Zaczynamy!
-
a) Zapoznanie się ze środowiskiem.
Po instalacji programu otwieramy go. Ukazuje nam się jego okno:
rys.1
Klikamy File > New Website. Zostawiamy wzystko tak, jak jest i klikamy OK. Pokazuje nam się kod strony.
Narazie plik Default.aspx nie będzie nam potrzebny. Usuńmy go, klikając na niego w oknie Solution Explorer (po
prawej) i wsickając klawisz delete. Klikamy OK i plik został usunięty.
- b) Tworzymy Master Page
Teraz stworzymy stronę wzorcową. W tym celu klikamy PPM na folder główny strony (WebSite1 w Solution
Explorer) i wybieramy z menu kontekstowego Add New Item.... Ukazuje nam się okno, gdzie wybieramy, co
chcemy dodać do swojej witryny. Wybieramy MasterPage i klikamy OK. I ukazał się nam kod Master Page.
Przechodzimy do trybu Projektu. W tym celu klikamy na Desing (pod oknem kodu). Widzimy już projekt Master
Page. Obiekt, który widzimy, czyli ContentPlaceHolder1 będzie zawierał zawartość stron. Klikamy na niego i
wciskamy klawisze CTRL+X. Wytniemy go na chwilę. Z okna ToolBox (po lewej) z kategorii HTML przenosimy
na stronę obiekt Table. Na stronie widzimy tabelę. Rozciągnijmy ją wszerz.
rys.2
Teraz ustalimy wymiary tabeli i scalimy odpowiednie komórki. Najpierw może scalimy je.
rys.3
Z naciśniętym klawiszem ALT zaznaczamy 4 komórki (jak na rysunku). Klikamy na Layout (u góry okna
programu) i Merge Cells. Klikamy na tej dużej komórce i wklejamy wcześniej wycięty obiekt. Tabela trochę się
nam zdeformowała, ale nie przejmujmy się tym. Teraz zaznaczamy trzy komórki na górze (tym samym sposobem,
co wcześniej) i scalamy je. W nowoutworzonej komórce będzie logo naszej stronki. Jeszcze scalamy dwie komórki,
które nam zostały. Znajdują się po lewej stronie. Tam będzie nawigacja. Teraz można by już wstawić logo naszej
stronki, bo to logo ustali wymiary górnej komórki. Logo powinno mieć wymiary 500x100 px. Jego plik kopiujemy
do katalogu Moje dokumenty\Visual Studio 2005\WebSites\WebSite1. Aby logo było widoczne w programie
musimy odświeżyć w nim folder ze stroną. W tym celu klikamy prawym przyciskiem myszy na folder ze stroną i
wybieramy Refresh Folder. Na liście widzimy plik z obrazkiem. Przenosimy go na komórkę, w której będzie logo.
Już strona nabiera kształtów. Pustą komórkę, w ktorej będzie nawigacja, możemy trochę poszerzyć. Po wykonaniu
powyższych operacji strona powinna wyglądać mniej więcej tak:
rys.4
Właśnie skończyliśmy tworzyć Master Page, teraz zajmiemy się podstronami (.aspx).
- c) Tworzymy nowe strony (pliki .aspx)
Aby dodać nową stronę, należy w tym celu kliknąć PPM na główny folder strony i wybrać Add New Item... i
wybieramy Web Form i zaznaczamy dwie opcje, jak na rysunku:
rys.5
Potem wybieramy Master Page (mamy tylko 1 do wyboru) i klikamy OK. Mamy przed oczami stronę główną naszej
witryny. Można by coś tutaj napisać, np. powitanie. Jednak ta strona nie będzie wyświetlona po wejściu na stronę, a
będzie wyświetlona strona z oknem logowania lub rejestracji. Po zalogowaniu się użytkownik zobaczy stronę
główną.
Jeśli już napisaliśmy coś na naszej stronie, utworzymy kolejne podstrony dla naszych użytkowników. Te strony
będą się znajdować w folderze Member_Pages. Musimy go stworzyć; klikamy PPM na folder główny witryny i
wybieramy New Folder i nazywamy go Member_Pages. Po utworzeniu folderu, dodamy do niego podstrony i
koniecznie musimy skopiować elementy graficzne naszej strony, czyli logo, obrazy tła, itp (to, co jest w folderze
głównym). Inaczej te elementy nie zostaną wyświetlone. Po skopiowaniu możemy przystąpić do dodawania
podstron. Klikamy PPM na folder Member_Pages i klikamy Add New Item... i dodajemy, np. plik galeria.aspx. Tu
możemy wstawić swoje fotki, itp. Jakie te podstrony dodacie, to zależy od Was. Ja dodałem jeszcze artykuly.aspx i
download.aspx. I wygląda u mnie to tak:
rys.6
Jeszcze stworzymy stronę z logowaniem i rejestracją. Trzeba dodać pliki .aspx: login.aspx i register.aspx, nie można
podawać innych nazw. Na stronę login.aspx przeciągamy obiekt Login z kategorii Login w ToolBox oraz obiekt
CreateUserWizard z tej same kategorii. CreateUserWizard dodamy też do pliku register.aspx.
Teraz możemy uzupełnić zawartość pozostałych podstron. Po tej czynności zrobimy do nich linki.
- d) Wracamy do Master Page (trzeba zrobić linki)
Aby zrobić nawigację na stronie musimy stworzyć plik Web.sitemap. W tym celu klikamy PPM na główny folder
witryny i klikamy Add New Item... i wyieramy obiekt Site Map. Widzimy kod pliku Web.sitemap. Tutaj dodamy
adresy stron i ich nazwy. Naszą uwagę zwróci: <siteMapNode url="" title="" description="" />, bo to będziemy
uzupełniać. Takich kodów będziemy potrzebowali tyle, ile jest naszych stron. Jeżeli jest ich za mało, możemy je
skopiować.
url= "adres pliku .aspx"
title="tytuł podstrony"
description="wyjaśnienie, opis podstrony"
Jeżeli plik .aspx znajduje się w głównym folderze, podjemy tylko jego nazwę, np. url="Default.aspx". A jeżeli nasza
podstrona znajduje się w jakimś folderze, np. Member_Pages, wtedy wygląda to tak:
url="Member_Pages/galeria.aspx". Po uzupełnieniu powinno wyglądać to mniej więcej tak:
rys.7
Dodamy teraz nawigację. Otwieramy MasterPage i do komórki po lewej stronie przenosimy obiekt TreeView z
ToolBox, z kategorii Navigation. Klikamy na strzałkę nad tym obiektem i z rozsuniętego okna klikamy na menu
kontekstowe z Choose Data Source i klikamy New DataSource.... W wyświetlonym oknie wybieramy ikonkę Site
Map i klikamy OK. Mamy nawigację, ale te zwykłe linki nie wyglądają zbyt ładnie. Program oferuje kilka wzorów
Tree View. Aby wybrać jeden z nich klikamy na tą strzałkę nad Tree View i wybieramy Auto Format. Widzimy
galerię wzorów:
rys.8
Wybieramy jakiś fajny wzór i klikamy OK. Nasza strona jest już prawie gotowa, trzeba teraz przygotować bazę
danych na serwerze i stronę.
-
e) Konfiguracja strony i tworzenie nowej bazy
Aby skonfigurować stronę musimy otworzyć specjalne okno konfiguracyjne. W tym celu klikamy na WebSite i
na ASP.NET Configuration. Konfigurcja wyświetla się w oknie przeglądarki. Po załadowaniu się aplikacji klikamy
na Security i na Use the security Setup Wizard to configure security step by step. Klikamy next, potem zaznaczamy
From the Internet i next, next, tutaj nie zaznaczamy, role damy później, klikamy next, i mamy tworzenie konta. To
będzie nasze konto, przyda nam się to przetestowania strony. UWAGA!!! Hasło musi zawierać jakiś znam
niealfanumeryczny, czyli np. kropkę. Klikamy Create User, Continue i next. Tutaj damy zasady. Niezalogowani nie
będą mieli dostępu do zasobów strony, zalogowani owszem. Wybieramy Anymous User, Deny i Add This Rule.
Zasada została dodana. Klikamy next i finish. Strona została skonfigurowana. Aby ją przetestować otwieramy stronę
Default.aspx, klikamy na jej zawartości i klikamy View in Browser. Strona wyświetliła się w przeglądarce. Teraz
można sprawdzić, czy działa logowanie i linki. Jeżeli wszystko jest poprawne, możemy się zająć bazą danych.
Wchodzimy na stronę: ssl.hostedwindows.pl i logujemy się używając loginu i hasła, które otrzymaliśmy wcześniej
e-mailem. widzimy panel administracyjny. Klikamy na domeny, potem na adres swojej strony i na database
manager. Klikamy na Dodaj nowy, wybieramy Microsoft SQL Server 2005 i podajemy nazwę naszej bazy. Nie
mamy jeszcze żadnego użytkownika naszej bazy. Na dole klikamy na Dodaj nowy, podajemy login i hasło.
rys.9
Teraz uruchomimy narzędzie, które skonfiguruje naszą bazę, aby obsługiwała aplikacje asp.NET. W tym celu
przechodzimy do folderu C:\WINDOWS\Microsoft.NET\Framework\v2.0.50727 i uruchamiamy program
aspnet_regsql.exe. Gdy program się już uruchomił klikamy next i wybieramy Configure SQL Server for application
services. W miejscu "server" wpisujemy sql2005.hostedwindows.pl, wybieramy opcję SQL Server authentication i
podajemy swój login i hasło, które wpisywaliśmy podczas dodawania użytkownika bazy, gdy ją stworzyliśmy. W
miejscu database wpisujemy nazwę naszej bazy. Klikamy next, znowu next i program rozpocznie konfigurację.
Nasza baza została skonfigurowana. Teraz skonfigurujemy połączenie z nią.
-
f) Łączymy się z bazą danych
Przechodzimy do programu Visual Studio 2005 Web Developer, gdzie skonfigurujemy połączenie z nową bazą
na serwerze. Aby tego dokonać, musimy otworzyć naszą witrynę w programie i z menu View wybrać pozycję
Database Explorer.Widzimy drzewo przedstawiające połączenia z bazami. Klikamy PPM na Data Connections i
wybieramy Add Conection.... W oknie podajemy dane bazy. W Server name wpisujemy
sql2005.hostedwindows.pl, zaznaczamy opcję Use SQL Server Authentication i wpisujemy login i hasło do naszej
bazy. W polu Connect to a database wpisujemy nazwę naszej bazy, u mnie wygląda to tak:
rys.10
Klikamy OK i połączenie zostało nawiązane.
Teraz wystarczy jeszcze stworzyć plik Web.config (jeżeli go nie ma), dodajemy go w Add New Item i wybieramy
Web Configuration File.... Jeżeli plik już mamy stworzony widzimy jego kod. tutaj dodamy tzw. connection string.
Usuwamy zawatrosc pomiedzy <connectionStrings> </connectionStrings>I w to miejsce wklejamy ten kod:
<remove name="LocalSqlServer"/>
<add name="LocalSqlServer" connectionString="Data Source=sql2005.hostedwindows.pl; Initial
Catalog=nazwa_twojej_bazy; User ID=nazwa_uzytkownika_bazy; Password=twoje_haslo;"
providerName="System.Data.SqlClient"/>
I uzupełniamy odpowiednie miejsca, czy Initial Catalog, User ID i Password.
Nasza strona jest już skończona, możemy jeszcze ją ulepszyć kilkoma drobiazgami.
-
g) Ulepszamy stronę
Nasza strona jest skonfigurowana, ale możemy jeszcze dodać kilka przydatnych elementów, które powinna mieć
każda dobra strona dynamiczna.
I. Moja nazwa na stronie, czyli LoginName:
Zalogowany użytkownik może widzieć swoją nazwę, np. na stronie może widnieć napis: Witaj, janek_145! Jest
to bardzo proste w zrealizowaniu. Wystarczy jedna kontrolka na stronie, a jej nazwa to LoginName. Znajduje się
ona w ToolBox, w kategorii Login. Przenieśmy ją pod nawigację na MasterPage. Przed LoginName napiszemy
Witaj i po "Witaj" spacja, aby nasza nazwa nie zlewała się s tym słowem, a po LoginName damy wykrzyknik. I to
wszystko, jeżeli chodzi o LoginName.
II. Jeżeli się zalogowałem na sronie, to jak się wyloguję?
Tu również użyjemy prostej kontrolki. Ta kontrolka nazywa się LoginStatus i znajduję się też w kategorii Login
w ToolBox. Przenieśmy ją pod LoginName. Jak widzimy, kontrolka jest w języku angielskim. Możemy ją łatwo
spolszczyć. Klikamy na tę kontrolkę i szukamy w Properties (po prawej) tabel: Login text i Logout text. W Login
text zamieniamy słowo "Login" na "Zaloguj", a w Logout text na "Wyloguj".
To powinno wystarczyć na początek. Nasza strona jest już w pełni gotowa i tylko czeka, aż wgramy ją na serwer
:)
-
h) Wgrywamy pliki na serwer
Wgranie strony na serwer nie jest rzeczą trudną. Musimy użyć jakiegoś klienta ftp. Polecam program SmartFTP.
Jest darmowy i prosty w użyciu. Po pobraniu programu i jego instalacji musimy zalogować się do serwera. W
SmartFTP klikamy na menu File i wybieramy pozycję New Remote Browser. W polu Host wpisujemy adres naszej
strony, w UserName miałem kiedyś problemy. Otóż jeżeli mam adres strony dobryportal.winweb.pl, to zywkle login
jest taki sam. Zauważyłem w panelu administracyjnym, że login nie zawiera ostatniej literki "l", czyli jeżeli mam
adres strony dobryportal.winweb.pl, to login, czyli UserName powinienem mieć dobryportal.winweb.p.
Nie wiem, czy jest to już zmienione, ale można spróbować z "l". Hasło podajemy takie, jakie podawaliśmy podczas
rejestracji w hostedwindows.pl. Po zalogowaniu się do serwera widzimy foldery. Nasza strona będzie się
znajdowała w folderze wwwroot, więc otwieramy folder z naszą stroną, którą mamy na dysku i przenosimy całą
zawartość tego folderu do wwwroot. Po kilku minutach strona jest już na serwerze. Teraz sprawdzamy, czy
wszystko się udało. W przeglądarce wpisujemy adres naszej strony i jeśli się wyświetliła, spróbujmy się na niej
zarejestrować i zalogować. Jeśli się zalogowaliśmy, to znaczy, że wszystko jest OK. Brawo! Właśnie stworzyliśmy
stronę dynamiczną w technologii asp.NET!
Jest to mój stary artykuł, może zawierać jakieś błędy, jeżeli ktoś znajdzie jakieś, proszę pisać w komentarzech.
luki, [23.11.2009 14:29] Czytań: 929
Zaloguj się, aby komentować artykuły.
Brak komentarzy.
- Jesteś tutaj: Portal -> Artykuły -> Tworzenie stron -> Tworzenie dynamicznej strony w asp.NET
1. Wprowadzenie
- a) Co to jest asp.NET?
- b) Jakie narzędzia są potrzebne?
- c) Hosting asp.NET
- a) Zapoznanie się ze środowiskiem
- b) Tworzymy Master Page
- c) Tworzymy nowe strony (pliki .aspx)
- d) Wracamy do Master Page (trzeba zrobić linki)
- e) Konfiguracja strony i tworzenie nowej bazy
- f) Łączymy się z bazą danych
- g) Ulepszamy stronę
- h) Wgrywamy pliki na serwer
- a) Co to jest asp.NET? Są różne języki programowania, dzięki którym stworzymy stronę www. Zapewne znacie HTML, służący do opisu stron www, może znacie PHP, który często jest używany do budowy portali. Dziś chcę Wam przedstawić inne środowisko, jakim jest asp.NET. ASP (ang. Active Server Pages) to technologia firmy Microsoft służąca do tworzenia dynamicznych stron www z wykorzystaniem języków VBS i VC#. Tyle informacji powinno wystarczyć.
- b) Jakie narzędzia są potrzebne? Aby móc tworzyć stronę w asp.NET, musimy pobrać darmowe narzędzia: I. Visual Studio 2005 Web Developer - aplikacja służaca do tworzenia i zarządzania witrynami asp.NET, do pobrania tutaj II. MS SQL Server 2005 - serwer baz danych, do pobrania tutaj III. Microsoft Framework 2.0, instalator w paczce wraz z Visual Studio 2005 Web Developer IV. System Windows XP Professional z dodatkiem Servic Pack 2, sp2 do pobrania tutaj
- c) Hosting asp.NET Będziemy używać hostingu HostedWindows.pl. Należy się tam zarejestrować. Po otrzymaniu loginu i hasła możemy przystąpić do tworzenia naszej strony.
-
a) Zapoznanie się ze środowiskiem.
Po instalacji programu otwieramy go. Ukazuje nam się jego okno:
rys.1
Klikamy File > New Website. Zostawiamy wzystko tak, jak jest i klikamy OK. Pokazuje nam się kod strony.
Narazie plik Default.aspx nie będzie nam potrzebny. Usuńmy go, klikając na niego w oknie Solution Explorer (po
prawej) i wsickając klawisz delete. Klikamy OK i plik został usunięty.
- b) Tworzymy Master Page
Teraz stworzymy stronę wzorcową. W tym celu klikamy PPM na folder główny strony (WebSite1 w Solution
Explorer) i wybieramy z menu kontekstowego Add New Item.... Ukazuje nam się okno, gdzie wybieramy, co
chcemy dodać do swojej witryny. Wybieramy MasterPage i klikamy OK. I ukazał się nam kod Master Page.
Przechodzimy do trybu Projektu. W tym celu klikamy na Desing (pod oknem kodu). Widzimy już projekt Master
Page. Obiekt, który widzimy, czyli ContentPlaceHolder1 będzie zawierał zawartość stron. Klikamy na niego i
wciskamy klawisze CTRL+X. Wytniemy go na chwilę. Z okna ToolBox (po lewej) z kategorii HTML przenosimy
na stronę obiekt Table. Na stronie widzimy tabelę. Rozciągnijmy ją wszerz.
rys.2
Teraz ustalimy wymiary tabeli i scalimy odpowiednie komórki. Najpierw może scalimy je.
rys.3
Z naciśniętym klawiszem ALT zaznaczamy 4 komórki (jak na rysunku). Klikamy na Layout (u góry okna
programu) i Merge Cells. Klikamy na tej dużej komórce i wklejamy wcześniej wycięty obiekt. Tabela trochę się
nam zdeformowała, ale nie przejmujmy się tym. Teraz zaznaczamy trzy komórki na górze (tym samym sposobem,
co wcześniej) i scalamy je. W nowoutworzonej komórce będzie logo naszej stronki. Jeszcze scalamy dwie komórki,
które nam zostały. Znajdują się po lewej stronie. Tam będzie nawigacja. Teraz można by już wstawić logo naszej
stronki, bo to logo ustali wymiary górnej komórki. Logo powinno mieć wymiary 500x100 px. Jego plik kopiujemy
do katalogu Moje dokumenty\Visual Studio 2005\WebSites\WebSite1. Aby logo było widoczne w programie
musimy odświeżyć w nim folder ze stroną. W tym celu klikamy prawym przyciskiem myszy na folder ze stroną i
wybieramy Refresh Folder. Na liście widzimy plik z obrazkiem. Przenosimy go na komórkę, w której będzie logo.
Już strona nabiera kształtów. Pustą komórkę, w ktorej będzie nawigacja, możemy trochę poszerzyć. Po wykonaniu
powyższych operacji strona powinna wyglądać mniej więcej tak:
rys.4
Właśnie skończyliśmy tworzyć Master Page, teraz zajmiemy się podstronami (.aspx).
- c) Tworzymy nowe strony (pliki .aspx)
Aby dodać nową stronę, należy w tym celu kliknąć PPM na główny folder strony i wybrać Add New Item... i
wybieramy Web Form i zaznaczamy dwie opcje, jak na rysunku:
rys.5
Potem wybieramy Master Page (mamy tylko 1 do wyboru) i klikamy OK. Mamy przed oczami stronę główną naszej
witryny. Można by coś tutaj napisać, np. powitanie. Jednak ta strona nie będzie wyświetlona po wejściu na stronę, a
będzie wyświetlona strona z oknem logowania lub rejestracji. Po zalogowaniu się użytkownik zobaczy stronę
główną.
Jeśli już napisaliśmy coś na naszej stronie, utworzymy kolejne podstrony dla naszych użytkowników. Te strony
będą się znajdować w folderze Member_Pages. Musimy go stworzyć; klikamy PPM na folder główny witryny i
wybieramy New Folder i nazywamy go Member_Pages. Po utworzeniu folderu, dodamy do niego podstrony i
koniecznie musimy skopiować elementy graficzne naszej strony, czyli logo, obrazy tła, itp (to, co jest w folderze
głównym). Inaczej te elementy nie zostaną wyświetlone. Po skopiowaniu możemy przystąpić do dodawania
podstron. Klikamy PPM na folder Member_Pages i klikamy Add New Item... i dodajemy, np. plik galeria.aspx. Tu
możemy wstawić swoje fotki, itp. Jakie te podstrony dodacie, to zależy od Was. Ja dodałem jeszcze artykuly.aspx i
download.aspx. I wygląda u mnie to tak:
rys.6
Jeszcze stworzymy stronę z logowaniem i rejestracją. Trzeba dodać pliki .aspx: login.aspx i register.aspx, nie można
podawać innych nazw. Na stronę login.aspx przeciągamy obiekt Login z kategorii Login w ToolBox oraz obiekt
CreateUserWizard z tej same kategorii. CreateUserWizard dodamy też do pliku register.aspx.
Teraz możemy uzupełnić zawartość pozostałych podstron. Po tej czynności zrobimy do nich linki.
- d) Wracamy do Master Page (trzeba zrobić linki)
Aby zrobić nawigację na stronie musimy stworzyć plik Web.sitemap. W tym celu klikamy PPM na główny folder
witryny i klikamy Add New Item... i wyieramy obiekt Site Map. Widzimy kod pliku Web.sitemap. Tutaj dodamy
adresy stron i ich nazwy. Naszą uwagę zwróci: <siteMapNode url="" title="" description="" />, bo to będziemy
uzupełniać. Takich kodów będziemy potrzebowali tyle, ile jest naszych stron. Jeżeli jest ich za mało, możemy je
skopiować.
url= "adres pliku .aspx"
title="tytuł podstrony"
description="wyjaśnienie, opis podstrony"
Jeżeli plik .aspx znajduje się w głównym folderze, podjemy tylko jego nazwę, np. url="Default.aspx". A jeżeli nasza
podstrona znajduje się w jakimś folderze, np. Member_Pages, wtedy wygląda to tak:
url="Member_Pages/galeria.aspx". Po uzupełnieniu powinno wyglądać to mniej więcej tak:
rys.7
Dodamy teraz nawigację. Otwieramy MasterPage i do komórki po lewej stronie przenosimy obiekt TreeView z
ToolBox, z kategorii Navigation. Klikamy na strzałkę nad tym obiektem i z rozsuniętego okna klikamy na menu
kontekstowe z Choose Data Source i klikamy New DataSource.... W wyświetlonym oknie wybieramy ikonkę Site
Map i klikamy OK. Mamy nawigację, ale te zwykłe linki nie wyglądają zbyt ładnie. Program oferuje kilka wzorów
Tree View. Aby wybrać jeden z nich klikamy na tą strzałkę nad Tree View i wybieramy Auto Format. Widzimy
galerię wzorów:
rys.8
Wybieramy jakiś fajny wzór i klikamy OK. Nasza strona jest już prawie gotowa, trzeba teraz przygotować bazę
danych na serwerze i stronę.
-
e) Konfiguracja strony i tworzenie nowej bazy
Aby skonfigurować stronę musimy otworzyć specjalne okno konfiguracyjne. W tym celu klikamy na WebSite i
na ASP.NET Configuration. Konfigurcja wyświetla się w oknie przeglądarki. Po załadowaniu się aplikacji klikamy
na Security i na Use the security Setup Wizard to configure security step by step. Klikamy next, potem zaznaczamy
From the Internet i next, next, tutaj nie zaznaczamy, role damy później, klikamy next, i mamy tworzenie konta. To
będzie nasze konto, przyda nam się to przetestowania strony. UWAGA!!! Hasło musi zawierać jakiś znam
niealfanumeryczny, czyli np. kropkę. Klikamy Create User, Continue i next. Tutaj damy zasady. Niezalogowani nie
będą mieli dostępu do zasobów strony, zalogowani owszem. Wybieramy Anymous User, Deny i Add This Rule.
Zasada została dodana. Klikamy next i finish. Strona została skonfigurowana. Aby ją przetestować otwieramy stronę
Default.aspx, klikamy na jej zawartości i klikamy View in Browser. Strona wyświetliła się w przeglądarce. Teraz
można sprawdzić, czy działa logowanie i linki. Jeżeli wszystko jest poprawne, możemy się zająć bazą danych.
Wchodzimy na stronę: ssl.hostedwindows.pl i logujemy się używając loginu i hasła, które otrzymaliśmy wcześniej
e-mailem. widzimy panel administracyjny. Klikamy na domeny, potem na adres swojej strony i na database
manager. Klikamy na Dodaj nowy, wybieramy Microsoft SQL Server 2005 i podajemy nazwę naszej bazy. Nie
mamy jeszcze żadnego użytkownika naszej bazy. Na dole klikamy na Dodaj nowy, podajemy login i hasło.
rys.9
Teraz uruchomimy narzędzie, które skonfiguruje naszą bazę, aby obsługiwała aplikacje asp.NET. W tym celu
przechodzimy do folderu C:\WINDOWS\Microsoft.NET\Framework\v2.0.50727 i uruchamiamy program
aspnet_regsql.exe. Gdy program się już uruchomił klikamy next i wybieramy Configure SQL Server for application
services. W miejscu "server" wpisujemy sql2005.hostedwindows.pl, wybieramy opcję SQL Server authentication i
podajemy swój login i hasło, które wpisywaliśmy podczas dodawania użytkownika bazy, gdy ją stworzyliśmy. W
miejscu database wpisujemy nazwę naszej bazy. Klikamy next, znowu next i program rozpocznie konfigurację.
Nasza baza została skonfigurowana. Teraz skonfigurujemy połączenie z nią.
-
f) Łączymy się z bazą danych
Przechodzimy do programu Visual Studio 2005 Web Developer, gdzie skonfigurujemy połączenie z nową bazą
na serwerze. Aby tego dokonać, musimy otworzyć naszą witrynę w programie i z menu View wybrać pozycję
Database Explorer.Widzimy drzewo przedstawiające połączenia z bazami. Klikamy PPM na Data Connections i
wybieramy Add Conection.... W oknie podajemy dane bazy. W Server name wpisujemy
sql2005.hostedwindows.pl, zaznaczamy opcję Use SQL Server Authentication i wpisujemy login i hasło do naszej
bazy. W polu Connect to a database wpisujemy nazwę naszej bazy, u mnie wygląda to tak:
rys.10
Klikamy OK i połączenie zostało nawiązane.
Teraz wystarczy jeszcze stworzyć plik Web.config (jeżeli go nie ma), dodajemy go w Add New Item i wybieramy
Web Configuration File.... Jeżeli plik już mamy stworzony widzimy jego kod. tutaj dodamy tzw. connection string.
Usuwamy zawatrosc pomiedzy <connectionStrings> </connectionStrings>I w to miejsce wklejamy ten kod:
<remove name="LocalSqlServer"/>
<add name="LocalSqlServer" connectionString="Data Source=sql2005.hostedwindows.pl; Initial
Catalog=nazwa_twojej_bazy; User ID=nazwa_uzytkownika_bazy; Password=twoje_haslo;"
providerName="System.Data.SqlClient"/>
I uzupełniamy odpowiednie miejsca, czy Initial Catalog, User ID i Password.
Nasza strona jest już skończona, możemy jeszcze ją ulepszyć kilkoma drobiazgami.
- g) Ulepszamy stronę Nasza strona jest skonfigurowana, ale możemy jeszcze dodać kilka przydatnych elementów, które powinna mieć każda dobra strona dynamiczna. I. Moja nazwa na stronie, czyli LoginName: Zalogowany użytkownik może widzieć swoją nazwę, np. na stronie może widnieć napis: Witaj, janek_145! Jest to bardzo proste w zrealizowaniu. Wystarczy jedna kontrolka na stronie, a jej nazwa to LoginName. Znajduje się ona w ToolBox, w kategorii Login. Przenieśmy ją pod nawigację na MasterPage. Przed LoginName napiszemy Witaj i po "Witaj" spacja, aby nasza nazwa nie zlewała się s tym słowem, a po LoginName damy wykrzyknik. I to wszystko, jeżeli chodzi o LoginName. II. Jeżeli się zalogowałem na sronie, to jak się wyloguję? Tu również użyjemy prostej kontrolki. Ta kontrolka nazywa się LoginStatus i znajduję się też w kategorii Login w ToolBox. Przenieśmy ją pod LoginName. Jak widzimy, kontrolka jest w języku angielskim. Możemy ją łatwo spolszczyć. Klikamy na tę kontrolkę i szukamy w Properties (po prawej) tabel: Login text i Logout text. W Login text zamieniamy słowo "Login" na "Zaloguj", a w Logout text na "Wyloguj". To powinno wystarczyć na początek. Nasza strona jest już w pełni gotowa i tylko czeka, aż wgramy ją na serwer :)
- h) Wgrywamy pliki na serwer Wgranie strony na serwer nie jest rzeczą trudną. Musimy użyć jakiegoś klienta ftp. Polecam program SmartFTP. Jest darmowy i prosty w użyciu. Po pobraniu programu i jego instalacji musimy zalogować się do serwera. W SmartFTP klikamy na menu File i wybieramy pozycję New Remote Browser. W polu Host wpisujemy adres naszej strony, w UserName miałem kiedyś problemy. Otóż jeżeli mam adres strony dobryportal.winweb.pl, to zywkle login jest taki sam. Zauważyłem w panelu administracyjnym, że login nie zawiera ostatniej literki "l", czyli jeżeli mam adres strony dobryportal.winweb.pl, to login, czyli UserName powinienem mieć dobryportal.winweb.p. Nie wiem, czy jest to już zmienione, ale można spróbować z "l". Hasło podajemy takie, jakie podawaliśmy podczas rejestracji w hostedwindows.pl. Po zalogowaniu się do serwera widzimy foldery. Nasza strona będzie się znajdowała w folderze wwwroot, więc otwieramy folder z naszą stroną, którą mamy na dysku i przenosimy całą zawartość tego folderu do wwwroot. Po kilku minutach strona jest już na serwerze. Teraz sprawdzamy, czy wszystko się udało. W przeglądarce wpisujemy adres naszej strony i jeśli się wyświetliła, spróbujmy się na niej zarejestrować i zalogować. Jeśli się zalogowaliśmy, to znaczy, że wszystko jest OK. Brawo! Właśnie stworzyliśmy stronę dynamiczną w technologii asp.NET!
luki, [23.11.2009 14:29] Czytań: 929
Zaloguj się, aby komentować artykuły.
Brak komentarzy.
