單的 ASP.NET 頁面看上去就像普通的 HTML 頁面。
Hello RUNOOB.COM
在開始學習 ASP.NET 之前,我們先來構建一個簡單的 HTML 頁面,該頁面將在瀏覽器中顯示 "Hello RUNOOB.COM":
Hello RUNOOB.COM! |
用 HTML 編寫的 Hello RUNOOB.COM
下面的代碼將以 HTML 頁面的形式顯示實例:
<html>
<body bgcolor="yellow">
<center>
<h2>Hello RUNOOB.COM!</h2>
</center>
</body>
</html>
如果您想親自嘗試一下,請保存上面的代碼到一個名為 "firstpage.htm" 的文件中,并創建一個到該文件的鏈接:firstpage.htm。
用 ASP.NET 編寫的 Hello RUNOOB.COM
轉換 HTML 頁面為 ASP.NET 頁面最簡單的方法是,直接復制一個 HTML 文件,并把新文件的擴展名改成 .aspx 。
下面的代碼將以 ASP.NET 頁面的形式顯示實例:
<html>
<body bgcolor="yellow">
<center>
<h2>Hello RUNOOB.COM!</h2>
</center>
</body>
</html>
如果您想親自嘗試一下,請保存上面的代碼到一個名為 "firstpage.aspx" 的文件中,并創建一個到該文件的鏈接:firstpage.aspx。
它是如何工作的?
從根本上講,ASP.NET 頁面與 HTML 是完全相同的。
HTML 頁面的擴展名是 .htm。如果瀏覽器向服務器請求一個 HTML 頁面,服務器可以不進行任何修改,就直接發送頁面給瀏覽器。
ASP.NET 頁面的擴展名是 .aspx。如果瀏覽器向服務器請求個 ASP.NET 頁面,服務器在將結果發回給瀏覽器之前,需要先處理頁面中的可執行代碼。
上面的 ASP.NET 頁面不包含任何可執行的代碼,所以沒有執行任何東西。在下面的實例中,我們將添加一些可執行的代碼到頁面中,以便演示靜態 HTML 頁面和動態 ASP 頁面的不同之處。
經典 ASP
Active Server Pages (ASP) 已經流行很多年了。通過 ASP,可以在 HTML 頁面中放置可執行代碼。
之前的 ASP 版本(在 ASP.NET 之前)通常被稱為經典 ASP。
ASP.NET 不完全兼容經典 ASP,但是只需要經過少量的修改,大部分經典 ASP 頁面就可以作為 ASP.NET 頁面良好地運行。
如果您想學習更多關于經典 ASP 的知識,請訪問我們的 ASP 教程。
用經典 ASP 編寫的動態頁面
為了演示 ASP 是如何顯示包含動態內容的頁面,我們將向上面的實例中添加一些可執行的代碼(紅色字體標識):
<html>
<body bgcolor="yellow">
<center>
<h2>Hello RUNOOB.COM!</h2>
<p><%Response.Write(now())%></p>
</center>
</body>
</html>
<% --%> 標簽內的代碼是在服務器上執行的。
Response.Write 是用來向 HTML 輸出流中寫東西的 ASP 代碼。
Now() 是一個返回服務器當前日期和時間的函數。
如果您想親自嘗試一下,請保存上面的代碼到一個名為 "dynpage.asp" 的文件中,并創建一個到該文件的鏈接:dynpage.asp。
用 ASP .NET 編寫的動態頁面
下面的代碼將以 ASP.NET 頁面的形式顯示實例:
<html>
<body bgcolor="yellow">
<center>
<h2>Hello RUNOOB.COM!</h2>
<p><%Response.Write(now())%></p>
</center>
</body>
</html>
如果您想親自嘗試一下,請保存上面的代碼到一個名為 "dynpage.aspx" 的文件中,并創建一個到該文件的鏈接:dynpage.aspx。
ASP.NET 對比經典 ASP
上面的實例無法演示 ASP.NET 與經典 ASP 之間任何的不同之處。
正如最后的兩個實例中,您看不出 ASP 頁面和 ASP.NET 頁面兩者之間的不同之處。
在下一章中,您將看到服務器控件是如何讓 ASP.NET 比經典 ASP 更強大的。
SP全稱Active Server Pages,是微軟推出的用以取代CGI的動態服務器網頁技術,由于ASP簡單易學,又有微軟的強大支持,所以目前ASP使用非常廣泛,很多大型的站點都是用ASP開發的。
ASP文件就是在普通的HTML文件中嵌入VBScript或JavaScript腳本語言。當客戶請求一個ASP文件時,服務器就把該文件解釋成標準的HTML文件發過去。在服務器端運行的好處是:第一,因為發出的是標準的HTML文件,所以不會存在瀏覽器兼容的問題;第二,可以很方便地和服務器交換數據,如讀取數據庫或操作服務器上的文件;第三因為在客戶端僅可以看到由ASP輸出的HTML文件,可以保護源代碼不被泄露。
ASP提供了幾個內部對象和內部組件,利用它們可以很方便地實現表單上傳,存取數據庫,操作服務器上的文件的基本功能。除此之外,還可以使用第三方提供的專用組件解決如發送E-mail,文件上傳等功能。如果還有特殊的需要,可以利用VC或VB開發自己的組件。因此,理論上ASP幾乎可以實現任何功能。
由于ASP所使用的VBScript腳本語言直接來源于VB語言,秉承了VB簡單易學的特點,所以學習起來非常容易。不過ASP也有它的缺點,就是兼容性不太好,一般用ASP開發的Web程序只能運行在windows系列的操作系統上。微軟目前已經推出了ASP的升級版ASP.NET,與ASP相比,它增加了很多特性,功能也更為強大。之所以還要學習ASP,主要有以下原因。
ASP簡單易學,ASP.NET學起來畢竟復雜些,如果希望快速掌握動態程序設計技術,ASP是首選。
2.ASP運行環境簡單,ASP.NET運行環境要求較高。
3.雖然也可以直接學習ASP.NET,但學完ASP以后,再學ASP.NET就更容易了。
一個學期前小編也是對前端知之甚少,現在嘛,差不多弄懂了一些,來講講自己的理解吧ヽ( ̄▽ ̄)? 因為學習的深度不是很深,有錯誤的地方歡迎指正~如果沒有學會建站,小編教你如何簡單快速搭建網站,喜歡的收藏哦~~不要錯過
首先我們要知道訪問網站的流程是什么?大家每天也訪問。
假設大家在瀏覽器地址欄輸入這個問題的地址
https://www.頭條.com/question/22689579
當自己的電腦得到一個 html頁面 (圖中HTTP 響應中 body 里的內容)之后,就會對它進行解析。HTML 就是一種超文本標記語言。給大家舉一些實例看看:
[img]圖片[/img] 用來粘貼圖片
[url]超鏈接[/url] 用來粘貼地址
服務器返回給你的html文件,寫的是一些代碼,大概是這樣的:
瀏覽器拿到這些代碼之后,將分析渲染好頁面顯示出來,如果不用css,效果如下圖,按照瀏覽器默認的樣式顯示出表格,超鏈接等。
大家有么有覺得默認樣式有點ε(┬┬﹏┬┬)3……所以很多情況我們需要自定義這些樣式,目前通用的樣式語言就是CSS,我們用CSS寫一些自定義樣式的代碼,之后在 HTML 文件里用一個<link>標簽把這些規定樣式的 CSS 與表達內容語義的 HTML 代碼鏈接起來,然后大家就能看到以往所謂的正常的頁面,是不是很厲害呢~~~
屬性:值
比如頭條的分布框架排版,它的 CSS ,截圖大體如下
把第一個屬性對應的代碼翻譯一下的話,背景圖像位置偏移量(background - position)在圖像距離頁面內左上角水平1px垂直2px處,瀏覽器會規規矩矩的地實現代碼要求的效果,所以當大家在頁面上下滾動時,頂上那個導航條都會牢牢地黏在窗口頂部固定的位置,不發生偏移。
再講講其他幾個屬性解釋一下:
left 為240px 說明這個模塊需緊貼著窗口的左240px處
width 和 height 指定模塊的寬和高
border 指明這個模塊的邊界范圍
換句話說,就是瀏覽器就會根據這些 CSS 代碼,自動描繪出對應的樣式。
像語言一樣,大家在網頁里的 發現的HTML 代碼也不一定是標準的,就好比有時候發音不太標準,別人就會去猜測你說的是什么一樣,sometimes,程序猿不小心寫錯了一個 HTML代碼,瀏覽器也會試圖猜測這些人類原來到底想寫什么,之后做出對應的處理,而這里的猜是要有一個常識做依據的。加上有些瀏覽器的功能不一,有的支持一些標簽,有一些又不支持,還有一些混亂的情況。
為了防止大家混淆,我們要對 HTML 代碼里的標簽,標簽how寫,標簽可以hava屬性這些東西,建立一個符合的標準,HTML5 就是其中一個比較新的標準。其中新加了很多可以用的標簽和屬性,然后各大瀏覽器也大刀闊斧的按這個標準去實現了很多新標簽和屬性。
本來前端程序員要寫一堆代碼去實現的效果,現在瀏覽器都給實現了,只需程序猿寫兩三行,調用一下瀏覽器就給搞定了,十分簡單,所以很多人都愿意去推廣這個標準~(當然新標準也不可能是完美的,也會有一些問題,有興趣的朋友可以去查查)
至于 XHTML,就是 HTML 的表親,XML 和 HTML 自己的雜交系列,對語法要求十分的嚴格,為了兼容 XML,在語法上與 HTML 有一些不同。
有了表示內容和語義的 HTML,規定樣式的 CSS,得到的是靜態的頁面,沒什么動畫,雖然用 CSS 可以有一些動畫,需要刷新數據才可以,這么呆板單調的網頁怎么能展現我大智人種族的創造性!于是我們創造了 Javascript(JS) 來給頁面添加一些動態的效果,比如頭條的發表的標簽,鼠標移上去會彈出一個小窗口,這個就是 JS 實現的效果啦。
瀏覽器都會幫大家實現一些Javascript可以用的工具(函數,對象等),只要寫一些 JS 的代碼,保存在 xxx.js 里,在 html 文件中用 <script> 關聯進來就可以用了,像上圖這個效果應該就包括了
鼠標懸停到標簽上時創建一個新的 <div> 小窗口
用 JS 向頭條服務器發送一個請求,得到這個小窗口應該顯示的數據,放在這個小窗口里(這就是所謂的AJAX,不用刷新就能與服務器進行交互,更新頁面的一小部分~)
瀏覽器拿到這樣的代碼,就會解析并實現出相應的效果。其實用來寫瀏覽器腳本的,也不是非得JavaScript 不可,不過是各大瀏覽器都默認了:請用 JS 寫這些動態效果的代碼給我解析~
以上就是前端部分的內容,下面簡述一下后端的東西吧> <
瀏覽器給服務器發一個請求,服務器不是一看就知道怎么響應的。首先這些請求和響應要有一個通用的寫法,也就是要有一個協議,常用的是 HTTP 協議。
像最前面的圖,服務器的響應寫了一個狀態碼 200 OK ,是 HTTP 協議里約定俗成的一個東西,服務器寫 200 OK 在響應里,表示“你請求的這個東西我有”,如果是404 Not Found,就是“你請求的這個東西我這里沒有”。
HTTP 響應里還包括很多東西,比如 Content-type 表示服務器發過來的文件類型是什么(文本?動畫?圖片?音頻?),這樣發過去了人家瀏覽器好知道怎么展示給用戶看。人家服務器怎么知道按協議要寫什么東西進去呢,這就是 Web Server 干活的時候了。
形象化一下HTTP響應,大概就長這樣:
再上個錘子,瀏覽器和服務器之間請求響應的過程大致是長這樣的,右下角的那些東西就是由 Web Server 生成的(服務器腳本可以做一些改動,但這些一般是 Web Server 的份內活):
再比如說很多時候你訪問一個網站,瀏覽器里輸的地址并沒有寫明你請求的文件,比如這個問題的地址是:
http://www.頭條.com/question/22689579
但頭條的服務器其實返回了一個html給你,服務器怎么知道這個地址對應要返回什么樣的 html 代碼給你的?也是 Web Server 干的活。
除了瀏覽器輸地址敲回車這種赤裸裸的訪問,客戶端與服務器的交互還有很多種,比如:
前面提到的用 JS 完成的 AJAX,有點像瀏覽器和服務器之間的悄悄話~
還有其他應用軟件與服務器的交互,比如:
微信、QQ 與騰訊的服務器的交互
網游客戶端與網游公司服務器的交互
搜索引擎用來搜集網頁信息的程序(爬蟲)與各種各樣的網站服務器的交互
只要你知道用什么地址訪問、怎樣訪問人家的服務器,并且有相應權限,你也可以自己寫一些程序去和他們的服務器交互(比如用微博API - 新浪微博API獲取微博,開發第三方應用或者做數據分析)。
從這些例子里可以看出,客戶端與服務器的交互的主體、客體、載體是五花八門的:
服務器可以是大型機也可以是個人電腦,只要能跑相應的程序就行
客戶端像前面舉的栗子里一樣,可以是各種軟件,而且這些軟件不一定運行在個人電腦上,也可以是手機、平板、智能穿戴設備等等
有時候不是傳生成好的 HTML 或者其他服務器上已經有的文件,而是傳輸經過一定邏輯處理后生成的字符串或者其他各種封裝好的數據
像前面提到的 HTML 需要有一定標準一樣,為了防止混亂和雞同鴨講,我們又需要先對這些機器需要怎么交互達成一定共識,再讓它們進行交流。人與人之間通信,需要先有一種大家都認識的寫法(比如簡體字/繁體字)和一種彼此都懂的語言(比如普通話/廣東話)。
要讓這些形形色色的機器能夠通過網絡進行交互,我們就需要指明一種協議(比如 HTTP/HTTPS)和一種數據封裝格式(比如 HTML/XML),Web Server 提供的 Web Service,指的就是這種協議+格式的交流體系。不過 Web Service 的生態系統和 HTML 的標準不一樣,用戶可以選擇的協議和數據封裝格式更多,普通的網站訪問用的 HTTP + HTML 只是其中一種,一些封閉系統內的交流還可以自己定義一個協議和格式來用(比如 QQ)。
Web Service 傳輸的數據再經由本地客戶端(瀏覽器、QQ/微信,網游客戶端等)的分析渲染,就能夠以普通人能夠理解的形式展現出來。此外還有一些 Web Service 并不是為普通用戶設計的,像前面提到的微博API,是用來給程序猿進行二次開發的~
除了提供 Web Service, Web Server 還會兼顧很多功能,包括提供緩存,平衡負載,這樣在訪問量比較大的時候能有有條不紊地接客。常見的現成的 Web Server 有開源的 Apache、Nginx和微軟的IIS,你也可以用一些工具(比如 Node.js )自己定制一個。因為 Web Server 需要比較好的性能,所以投產時用的 Web Server 通常是C/C++/Java寫的,但是其實很多語言都可以寫,而且配合上語言底層的優化和好的模型,其他語言寫的 Web Server也可以有不錯的表現。
開頭那張圖里服務器接到請求之后可以給訪客發送對應的文件,但21世紀的服務器怎么可能只會“接請求-發文件”這么弱智的一招呢,人家還可以處理你上傳來的文件的!還可以接受你發過來的各種請求,去操作服務器本地的文件or數據庫的!要干這些事,自然服務器那邊也少不了要有代碼了,這些代碼就是服務器腳本。前面說的 Web Service 傳輸的數據,主要也是由服務器腳本生成,再交由 Web Server ,按照某種協議套好整個響應的格式,返回給客戶端的。
同一個網址,每個人看到的頁面不一定是一樣的,比如頭條的網址都是
http://www.toutiao.com/
但是沒登陸和登陸之后看到的東西不一樣,登陸之后每個人看到的導航欄的用戶信息,關注的動態,都不一樣。服務器腳本可以對這些不同的狀態,生成不同的頁面,交給 Web Server 返回給瀏覽器。
知乎的主頁給大家看到的 html 整體來說是差不多的,都有導航欄,左邊是關注的動態,右邊是廣告和邊欄,每一塊的整體構造大同小異,只是一些地方內容有所區別。服務器腳本就是利用已知的數據,在這些因人而異的地方填入相應的內容,生成給每個人看的頁面。
比如我的主頁,導航欄右邊的頭像和名字跟別人看到的不一樣,就是因為這塊地方有一個放圖片的<img>標簽和一個寫名字的<span>標簽,服務器腳本在查詢本地的數據之后給我返回的頁面里<img>的標簽填了我頭像的圖片鏈接,<span>標簽里填了我的頭條名,給別人的頁面就填其他鏈接、其他名字,這樣每個人看到的頁面就不一樣了。
PHP 就是一種常見的用來寫服務器腳本的語言,其實只要是能拿來寫大家傳輸數據的通用接口(CGI)的語言都可以用來寫服務器腳本(也就是說幾乎所有編程語言都可以寫 = =b),只是因為現成工具的豐富程度和專攻程度不一樣,所以有一些語言在寫服務器端腳本的時候會比較熱門。
為了方便,我們在寫服務器腳本的時候,通常還會用個同語言寫的 Web Framework 來處理各種細節,防御一些常見的攻擊,提供跨站認證(比如用已有的微博賬號注冊其他網站)的接口,利用cookie處理登陸狀態和用戶設置,生成網頁模版之類的。如果你用 C# 或者 Visual Basic 寫服務器腳本,就可以用 http://ASP.NET 這個框架實現這些功能,幫你省點麻煩。不過現在不少人是反過來為了一個好用的 Web Framework 去選擇它對應的服務器腳本語言的。
簡單概括一下,對于我們普通的網站訪問,涉及到的技術就是:
用戶操作瀏覽器訪問,瀏覽器向服務器發出一個 HTTP 請求;
服務器接收到 HTTP 請求,Web Server 進行相應的初步處理,使用服務器腳本生成頁面;
服務器腳本(利用Web Framework)調用本地和客戶端傳來的數據,生成頁面;
Web Server 將生成的頁面作為 HTTP 響應的 body,根據不同的處理結果生成 HTTP header,發回給客戶端;
客戶端(瀏覽器)接收到 HTTP 響應,通常第一個請求得到的 HTTP 響應的 body 里是 HTML 代碼,于是對 HTML 代碼開始解析;
解析過程中遇到引用的服務器上的資源(額外的 CSS、JS代碼,圖片、音視頻,附件等),再向 Web Server 發送請求,Web Server 找到對應的文件,發送回來;
瀏覽器解析 HTML 包含的內容,用得到的 CSS 代碼進行外觀上的進一步渲染,JS 代碼也可能會對外觀進行一定的處理;
用戶與頁面交互(點擊,懸停等等)時,JS 代碼對此作出一定的反應,添加特效與動畫;
交互的過程中可能需要向服務器索取或提交額外的數據(局部的刷新,類似微博的新消息通知),一般不是跳轉就是通過 JS 代碼(響應某個動作或者定時)向 Web Server 發送請求,Web Server 再用服務器腳本進行處理(生成資源or寫入數據之類的),把資源返回給客戶端,客戶端用得到的資源來實現動態效果或其他改變。
注意這只是小網站里比較常見的模型,大網站為了解決規模問題還會有很多處理,每個環節都會有一些細微的差異,中間還會使用各種各樣的工具減輕服務器的壓力,提高效率,方便日常維護~
為了方便調試,很多 Web Framework 會自帶一個簡單的 Web Server,或者有些 Web Server 會自帶一個簡單的 Web Framework ,實際部署到服務器上開放使用的時候為了性能或者安全等多方面的考慮,可以把內置的 Web Server 換成其他的,比如 Apache 或者 Nginx (舉個栗子,知乎用的是 Tornado 做 Framework,Server 換成了 Nginx,見知乎使用了哪些框架和開源庫?)。如果是開源的東西,還可以在遵守開源協議的前提下自己改一下再用~
因為后端不像前端已經有 HTML + CSS + JS 這樣的既定事實標準,服務器腳本與 Web Framework 的選擇很多,所以新手會聽到很多眼花繚亂的技術名詞的地方多在這里~ 舉一些栗子,早年常見的服務器端語言有:
開源的 PHP
Sun 公司的 JSP 中使用的 Java
微軟的 ASP 中使用的 VBScript
現在在這方面的應用熱起來的語言有
Python,對應常見的 Framework 包括知乎和Quora有用到的 Tornado(其實是自帶 Framework 的 Web Server),社區很成熟的 Django (用戶包括 Instagram、Pinterest)等
Ruby,一般都用 Rails 這個 Framework,用戶包括 Github、早期的 Twitter 等
逆天的 JavaScript,有了 Node.js 這個平臺,Web Server、服務器腳本和瀏覽器腳本全都可以用 JavaScript 來寫……Node.js上最常用的 Framework是Express
微軟家的則跟著 http://ASP.NET 轉移到了C# 或者 Visual Basic
Erlang,擅長大規模的并發,不少游戲公司拿來寫服務器,靠幾十個工程師支撐幾億用戶的WhatsApp也是用的這個~
幾種常見的架構包括:
LAMP = Linux + Apache + MySQL + PHP(P還可能是Python或Perl。有時候L會改成W=Windows。),也就是服務器上的操作系統是 Linux,Web Server 用 Apache,數據庫用 MySQL,服務器腳本用 PHP,這些都是開源技術,網站起步時用起來的成本會比較低,所以是普通網站里非常常見的架構(雖然對于發展得很大的網站會遇到很多瓶頸),Facebook就是這種,淘寶也曾經是。
J2EE,Java 世界的架構,通常是企業用的(銀行、大型公司,.etc),比較常見地還會搭配一種 UNIX 做操作系統,Apache 做 Web Server,Tomcat 轉換 JSP 到 Java 給服務器程序用(其實它也自帶 Web Server),Oracle 數據庫等等。不一定拿來建站,常常用來提供企業里的各種需要用到網絡的業務。我們學校教務系統就是用J2EE做的=。= 淘寶現在也是從LAMP轉型到了這個。關于tomcat等之前的文章也有提及環境的配置。
http://ASP.NET,微軟家的架構,通常會搭配 Windows Server 操作系統,SQL Server 數據庫,IIS 做 Web Server。StackOverflow和京東(曾經)就是這個架構。
神奇的MEAN架構,MongoDB做數據庫,Express做 Web Framework,Angular 做前端的 JavaScript 框架,Node.js 用于編寫 Web Server。神奇之處在于這幾個東西的語言都是 JavaScript (MongoDB的實現不是,但與外界溝通用的語言是)。因為是比較新的架構,還有待時間的考驗,不過被很多人(尤其是靠 JavaScript 吃飯的前端程序猿們)熱切關注。
一般來說重點不在技術而且在乎成本的新網站比較喜歡用 LAMP,重視安全穩定和速度的企業和機構喜歡 J2EE,想省事的網站喜歡 http://ASP.NET,比較 Geek 的網站和創業公司喜歡折騰各種 Python、Ruby、Node.js世界的東西,Google 這樣現成的技術都解決不了需求的超大型網站就自己折騰解決方案。
如果大家喜歡,歡迎收藏,多多關注小編吶~ 還有會更多精彩的分享
*請認真填寫需求信息,我們會在24小時內與您取得聯系。