聊天室自做 Follow Me

2019-11-18 20:35:09

字體：大中小

來源：轉載

供稿：網友

    上網而沒去過聊天室的人，可謂是鳳毛麟角，下面，我們就自己來做個最簡單的聊天室。
　　目前聊天室顯示對話的方式一般有兩種。一是每隔 x 秒就把整個對話顯示區刷新一遍，此方的弊端顯而易見：數據傳輸量大且屏幕有閃爍感；其二是有新的發言時，才將該內容傳遞給客戶端，并添加在原有對話的尾部，此法數據傳輸量就比較小且屏幕是平滑滾動，視覺效果好。第一種方法的實現已經有很多資料介紹，因此本文將介紹第二種刷新方式。
　　設計思路：
　　⑴服務器端只保留最新的30條發言作為緩沖區，新的發言內容將最舊的發言擠出。
　?、泼烤浒l言都分配一個遞增的序號?？蛻舳俗詈蟪霈F的發言的序號記錄在 session 中。
　?、抢秒[藏框架進行刷新，刷新時，將 Session 值與緩沖區的每句發言的序號進行比較，如果序號大于 Session 值說明該發言是新的，就將該發言的數據取出，并將該發言的序號值賦給 Session。
　　⑷對話顯示區使用 document.open() 打開后，就不再關閉，當隱藏框架刷新時有新數據取出并傳到客戶端時，將這些原始數據格式化為要顯示的內容（此工作可以在服務器端執行，但為減輕服務器的負擔，就將對話的合成工作移交給客戶），然后調用 document.writeln 方法將發言的內容寫到對話顯示區的尾部。
　?、稍趯υ掞@示區中放置一段自動滾屏的代碼，使屏幕自動向下滾動，并可通過發言區的復選框來選擇是否自動滾屏。
　　實現方法：
　　一、本程序只需要 4 個文件即可實現：
　?、與hat.asp：聊天室框架文件，負責初始化程序運行環境并隨機分配四位數的數字做為用戶名，再把頁面從上到下分成四部分，頂、底兩個框架高度為 0。
　?、芻hatfyq.htm：發言區，提供輸入姓名、發言的文本框，及一個發言按鈕和一個自動滾屏的開關（復選框），并定義在客戶端執行的 javaScript：checksays()（對發言進行有效性檢測）、cls()（清空對話顯示區的內容）、write()（初始化對話顯示區，定義頁面顏色、文字大小，并放置滾屏代碼）、sw(username)（在對話區點擊人名時，將人名寫到發言框中）、w(un,sa,tn,dt)（將原始數據合成為完整的發言內容，并添加到對話顯示區的尾部）。
　?、莄hatt.asp：此文件位于頂部的隱藏框架（高度為 0）中定時刷新，把新的發言的原始數據使用 <script Language=Javascript>parent.f2.w("姓名","發言內容","原始姓名","發言時間")</script> 的格式輸出到客戶端，即可調用 chatfyq.htm 中定義的 w(un,sa,tn,dt) 函數來顯示出發言內容。
　?、萩hatsay.asp：發言提交到此文件進行處理。此文件位于底部的隱藏框架中。將發言加入緩沖區后，立即執行和 chatt.asp 相同的代碼段，將發言顯示出來。（chatsay.asp 后面的代碼和 chatt.asp 是相同的，之所以不在 chatsay.asp 后面使用 Response.Redirect "chatt.asp" 來調用，是為了加快速度，因為重定向方式需要建立兩次連接：發言提交是連接一次，重定向時又要再連接一次，效率低。）
　　二、部分關鍵代碼注釋：
　?、懦跏蓟a段：application("chat_hh") 緩沖區中最后一句發言的序號、Session("chat_hh") 就是“設計思路⑶”中提到的 Session 值，用于記錄客戶端已顯示的最后一句發言的序號：

'如果該序號為空，表明程序未初始化
If Application("chat_hh") = "" Then
  '定義緩沖區數組，共 30 句發言
  '每句發言占用 5 個位置：序號、姓名、發言內容、原始姓名、發言時間
  Dim sd(150)
  Application.Lock
  '將數組賦值給 Application("chat_sd")，即：發言只保留在服務器內存中
  Application("chat_sd") = sd
  '定義初始序號為 0
  Application("chat_hh") = 0
  Application.UnLock
End If
'為避免序號過大，每當序號增大到 65535 時就將序號復位為 0
If Application("chat_hh") > 65535 Then
  Application.Lock
  Application("chat_hh") = 0
  Application.UnLock
End If
'客戶端用來記錄已經顯示到哪句發言的 Session("chat_hh")
'其值等于序號減去 12，即：新來的用戶可以看到原有的 12 句發言
Session("chat_hh") = Application("chat_hh") - 12

　?、芻hatfyq.htm 中的 JavaScript 函數：write()：

function write(){
  //使用 document.open() 打開對話顯示區，打開后不關閉，這樣就可以不斷向里面添加新內容
  parent.f1.document.open();
  //向對話顯示區中寫入 HTML 文件頭
  parent.f1.document.writeln("<html><head><title>對話區</title><meta http-equiv=Content-Type content=/"text/html; charset=gb2312/">");
  //寫入樣式表定義
  parent.f1.document.writeln("<style type=text/CSS>.t{color:AAAAAA;font-size:9pt;}body{font-family:/"宋體/";font-size:10.5pt;line-height:160%}A{text-decoration:none}A:Hover{text-decoration:underline}A:visited{color:blue}</style></head></Script Language=/"JavaScript1.1/">");
  //寫入自動滾屏代碼
  //......（注意：此處省略的代碼請參見完整的源程序）
  parent.f1.document.writeln("StartUp();<//script>");
  parent.f1.document.writeln("<body bgcolor=CDE0FC text=000000>");
  parent.f1.document.writeln("<hr size=1>【歡迎光臨】紅蜻蜓聊天室恭候您的光臨。<hr size=1>");
  //將 chatt.asp 載入框架頂端的隱藏框架中，執行定時刷新功能
  parent.t.location.href="chatt.asp";
}

　?、莄hatt.asp 定時刷新，并取得最新的發言的代碼：

'將聊天室的對話內容的緩存取到 sd 數組中
sd = Application("chat_sd")
'取得最后顯示的發言的序號
userhh = Session("chat_hh")
'定義 show 數組，用于存放要顯示的發言內容
Dim show()
ReDim PReserve show(0)
j = 1
newuserhh = 0
'遍歷緩沖區的發言內容
For i = 1 To 150 Step 5
  newuserhh = sd(i)
  '如果 sd(i)（每句發言的序號）大于用戶端最后發言的序號且發言存在就將其存入 show 數組
  If sd(i) > userhh And sd(i) > 0 Then
    ReDim Preserve show(j), show(j + 1), show(j + 2), show(j + 3)
    show(j) = sd(i + 1)
    show(j + 1) = sd(i + 2)
    show(j + 2) = sd(i + 3)
    show(j + 3) = sd(i + 4)
    j = j + 4
  End If
Next
'輸出 javascript 到客戶端
Response.Write "<script Language=JavaScript>"
'輸出 show 數組的內容
For i = 1 To UBound(show) Step 4
  '輸出 parent.f2.w(show(i),show(i+1),show(i+2),show(i+3))，調用客戶端 chatfyq.htm 的 w(un,sa,tn,dt) 函數來顯示發言內容
  Response.Write "parent.f2.w(" & Chr(34) & show(i) & Chr(34) & "," & Chr(34) & show(i + 1) & Chr(34) & "," & Chr(34) & show(i + 2) & Chr(34) & "," & Chr(34) & show(i + 3) & Chr(34) & ");" & Chr(13) & Chr(10)
Next
'寫出定時刷新的代碼，使 chatt.asp 在 5000 毫秒（5秒）后進行刷新
Response.Write "setTimeout('this.location.reload()',5000);</script>"
'如果緩沖區最后一句發言的序號大于原來客戶端最后一句發言的序號，就將該序號賦值給這個 Session("chat_hh")，以便下次刷新時進行新的檢測，避免把相同的發言多次取出
If newuserhh > userhh Then Session("chat_hh") = newuserhh

　?、萩hatsay.asp 部分代碼注釋：

'如果發言長度超過 200 個字，就截斷超出部分
If Len(says) > 200 Then says = Left(says, 200)
'將發言進行編碼，使其不支持 HTML 語法
says = Server.HTMLEncode(says)
'使發言能在客戶端以 JavaScript 函數進行傳遞
says = Replace(says, "/", "//")
says = Replace(says, "/", "//")
says = Replace(says, Chr(34), "/" & Chr(34))
Application.Lock
  '讀出緩沖區的內容到 sd 中
  sd = Application("chat_sd")
  '取出當前緩沖區最后一句發言的序號
  hh = Application("chat_hh")
  '使這個序號遞增
  Application("chat_hh") = hh + 1
  Dim newsd(150)
  j = 1
  '將原緩沖區的最舊的一句發言去掉
  For i = 6 To 150 Step 5
    newsd(j) = sd(i)
    newsd(j + 1) = sd(i + 1)
    newsd(j + 2) = sd(i + 2)
    newsd(j + 3) = sd(i + 3)
    newsd(j + 4) = sd(i + 4)
    j = j + 5
  Next
  '將這次發言的內容添加到最后
  newsd(146) = hh + 1
  newsd(147) = un
  newsd(148) = says
  newsd(149) = username
  newsd(150) = sj
  '把新的發言內容放到緩沖區中
  Application("chat_sd") = newsd
  sd = newsd
Application.UnLock

上一篇：利用cookie收藏網站

下一篇：ASP編寫完整的一個IP所在地搜索類