ASP – Chat com AJAX

[fernandosena]

Abaixo está uma lista de arquivos que usamos no projeto, acompanhado de uma explicação dos mesmos.

chat.mdb – usar um banco de dados para armazenar as mensagens em vez de variáveis aplicação.

config.asp – é o arquivo de configuração do projeto, contendo cabeçalhos para uso em páginas e a conexão ao banco de dados.

default.asp – é a página de acolhimento bate-papo

chat.asp – é a interface do bate-papo para escrever e ler mensagens.

messaggio.asp – é o arquivo que armazena as mensagens no banco de dados.

chat.js – é o arquivo Javascript que através XMLHTTP, invoca o arquivo ASP que mostra mensagens na tela,

ajax.asp – os arquivos para mostrar mensagens na tela!

Criar uma pasta no seu servidor Web chat_ajax. Onde você irá testar o resultado, no seguinte endereço:

[url="http://localhost/chat_ajax/"]http://localhost/chat_ajax/[/url]

Explique o uso dos arquivos citados, teatralmente falando.

A base de dados

Crie o arquivo chat.mdb , criar a tabela mensagens ,composto pelos seguintes campos:
ID – Counter
username – Texto, tamanho 30
mensagem – texto, comprimento 255
Salvar e fechar.

O arquivo de configuração

criar o arquivo config.asp:

Como mencionado na descrição da estrutura visto no anterior, o script não especifica os cabeçalhos das páginas inicial e conectar ao banco de dados, utilizando dois recursos personalizados que necessitamos

A página de login e de bate-papo

Crie o arquivo default.asp que, como previsto no título , será a página de login e de bate-papo.

Para agilizar operações estreitamente relacionadas com o artigo atual, o tópico não iremos criar uma verdadeira login, permitindo que os usuários escolham o nome de usuário que escolhem.

Certamente, desta forma é possível duplicação dos apelidos dos visitantes, e é por isso que o leitor poderá implementar um sistema de login em si.

código do arquivo:

chat ASP /AJAX
Selecione username
Eu recomendo a não alterar o valor atribuído à propriedade Comprimento Máximo 10, uma vez que os usuários serão armazenadas no banco de dados que tem o seu campo máximo de 10 caracteres.

Ao alterar a uma, necessariamente ser mudado mutuamente.

A interface bate-papo

#CHAT
{
background: #DDDDDD;
width: 500px;
height: 300px;
overflow: Auto;
}
#MSG
{
position: Absolute;
visibility: Hidden;
}

chat ASP/AJAX
Bem-vindo

Primeiro, verifique para ter certeza de que há uma sessão ativa.

Não altere o valor do texto 255 Comprimento Máximo, pela mesma razão dada acima.

No final da página crie uma moldura em consonância com nome e identificação MSG. Vemos que se refere à forma com uma meta para este item.

O texto camada CHAT dando-lhe o tamanho e a rolagem automática, assim como uma cor de fundo para distingui-la opticamente.

No final de CSS em cabeçalhos ,o Javascript irá chamar o arquivo chat.js.

A inserção de uma nova mensagem

É chegou a vez do arquivo messaggio.asp, arquivos chamados dentro do iframe, que desempenha um importante trabalho: a inserção de mensagens dos usuários.

código:


<%
Dim messaggio
messaggio = Server.HTMLEncode(Request.Form("messaggio"))
If messaggio "" Then
Call ConnOpen()
rs.Open "messaggi", cn, 3, 3
rs.AddNew
rs("username") = Session("username")
rs("messaggio") = messaggio
rs.Update
rs.Close
Call ConnClose()
Response.Redirect "messaggio.asp"
End If
%>

incluir o arquivo de configuração para o banco de dados , estamos inserindo e recuperando a mensagem, se ela realmente foi inserida , irá executar a gravação.

No final você remete a própria página, eliminando, assim, a fim de evitar a atualização escrupulosa da página por usuários.

O arquivo Javascript / AJAX

O arquivo de Javascript como código é bastante longo, mas as funções que levamos em consideração são os três primeiros, bastante curto.

Nós entendemos que o código completo:

function Aggiorna()
{
return Richiesta();
}
window.setInterval("Aggiorna()", 3000)

var XMLHTTP;

function Richiesta()
{
XMLHTTP = RicavaBrowser(CambioStato);
XMLHTTP.open(“GET”, “ajax.asp”, true);
XMLHTTP.send(null);
}

function CambioStato()
{
if (XMLHTTP.readyState == 4)
{
var R = document.getElementById(“CHAT”);
R.innerHTML = XMLHTTP.responseText;
}
}

function RicavaBrowser(QualeBrowser)
{
if (navigator.userAgent.indexOf(“MSIE”) != (-1))
{
var Classe = “Msxml2.XMLHTTP”;
if (navigator.appVersion.indexOf(“MSIE 5.5″) != (-1));
{
Classe = “Microsoft.XMLHTTP”;
}
try
{
OggettoXMLHTTP = new ActiveXObject(Classe);
OggettoXMLHTTP.onreadystatechange = QualeBrowser;
return OggettoXMLHTTP;
}
catch(e)
{
alert(“Erro: ActiveX não serão publicados!”);
}
}
else if (navigator.userAgent.indexOf(“Mozilla”) != (-1))
{
OggettoXMLHTTP = new XMLHttpRequest();
OggettoXMLHTTP.onload = QualeBrowser;
OggettoXMLHTTP.onerror = QualeBrowser;
return OggettoXMLHTTP;
}
else
{
alert(“O exemplo não funciona com outros navegadores!”);
}
}

A função Update (), chamado no corpo da página chat.asp, solicita o pedido, incentivando a cada 3 segundos, para assegurar uma contínua, mas não demasiado intrusiva, refresh (em back-office) Page e atualização mensagens.

A mencionada função Pedido () é realmente necessária, via XMLHTTP, o arquivo mensagens.

A função CambioStat () imprime na tela, no nível de texto identificado como bate-papo, mensagens, enquanto que a função RicavaBrowser () ,verificar que o atual navegador suporta AJAX.

Recordando as mensagens via ASP e AJAX

Chegámos a última etapa deste sobre a criação de um bate-papo com ASP e AJAX.

código ajax.asp:



<%
Call ConnOpen()
rs.Open "SELECT TOP 10 * FROM messaggi ORDER BY id DESC", cn, 1
If rs.EOF = False Then
With Response
While rs.EOF = False
.Write "" & rs("username") & "
"
.Write rs("messaggio") & "

”
rs.MoveNext
Wend
End With
End If
rs.Close
Call ConnClose()
%>