Serão três vídeo aulas ensinando a como criar um chat utilizando jQuery e PHP. Com isso veremos com criar um singleton, utilizar a classe PDO, usar setInterval do javascript entre outras coisas. Espero que goste, e boa aula.
Obs.: Na video-aula coloquei de maneira errônea o $.trim no jQuery, mas a opção do projeto completo consertei esse erro. Se você já tinha feito o download, faça novamente.
Obs2. : O chat desenvolvido é para estudo, existem vários outras implementações para colocá-lo em produção.
Aula 1
Aula 2
Aula 3
Projeto Completo: http://www.4shared.com/file/20F5_NR5/chat_2.html
Cara, muito bacana tuas video aulas, me diga uma coisa, para inserir um lista de pessoas conectadas e ainda mensagens privadas, requer muitas modificações?
Ou será que você tem uma aula que possa me guiar nesse sentido?
Parabens novamente pelas aulas.
Abraço!
Bruno, no caso teria que fazer uma nova modelagem, pq esse chat q ensinei ele é bem restrito.
Certo, vou rever sua aula e tentar implementar com esse novo conceito. Um abraço e obrigado pela atenção
Olá parabens pela vídeo aula ! O que colocar no ” Chat.class” para que as mensagem sejam deletada em 5min ? Seria muito complicado para que as novas pessoas que entrasse no chat só visualizacem as mensagem a parti de quando ela entrou ?
Vlw Tércio. No caso veja tem um tempo limite para expiração das mensagens, isso pode ser mudado sem problemas.
Como criar no Servidor um Banco de Dados com uma tabela com o nome “CHAT” e com os campos “Id, nome, mensagemdatahora” no phpMyAdim.
Tales, na sua hospedagem deve tem um tutorial q explica isso, ou uma pesquisa rápida do google vc vai encontrar n tutoriais, é só pesquisar:
http://migre.me/9G07X
http://migre.me/9G03B
Lembrando que esse chat para estudo.
Olá Daniel, têm como adicionar a função ENTER um evento de teclado para postar quando apertar?
Como seria para fazer isso?
Olá Sammy, começou mal, já errando meu nome, rs.
Vc pode utilizar o evento which para pegar o valor da tecla. O enter o valor 13. Exemplo:
HTML
[html]
<textarea name="mensagem" id="mensagem" cols="30" rows="10"></textarea>
[/html]
Javascript
[javascript]
$(function(){
$("#mensagem").keypress(function(e){
if(e.which == 13){
alert(‘Apertou a tecla enter’);
}
});
});
[/javascript]
Exemplo
Pode me ajudar a traduzir isso ja modifiquei tudo e não encontrei o erro Obrigado!
Fatal error: Uncaught exception ‘PDOException’ with message ‘invalid data source name’ in C:\Program Files\EasyPHP 2.0b1\www\chat\classes\BD.class.php:12 Stack trace: #0 C:\Program Files\EasyPHP 2.0b1\www\chat\classes\BD.class.php(12): PDO->__construct(‘$DSN’, ‘$USER’, ‘$PASS’) #1 C:\Program Files\EasyPHP 2.0b1\www\chat\classes\Chat.class.php(33): BD::getConn() #2 C:\Program Files\EasyPHP 2.0b1\www\chat\index.php(10): Chat->existeNome() #3 {main} thrown in C:\Program Files\EasyPHP 2.0b1\www\chat\classes\BD.class.php on line 12
Cicero, o nome do banco de dados está inválido.
Fatal error: Uncaught exception ‘PDOException’ with message ‘SQLSTATE[28000] [1045] Access denied for user ‘root’@’localhost’ (using password: NO)’ in /home/eusou105/public_html/classes/BD.class.php:9 Stack trace: #0 /home/eusou105/public_html/classes/BD.class.php(9): PDO->__construct(‘mysql:host=loca…’, ‘root’, ”) #1 /home/eusou105/public_html/classes/Chat.class.php(44): BD::getConn() #2 /home/eusou105/public_html/chat.php(15): Chat->listar() #3 {main} thrown in /home/eusou105/public_html/classes/BD.class.php on line 9
Gostaria de saber a onde e como consertar esses erros?
Aguardo, parabéns.
Boa noite, David!
Consegui resolver o problema.
Mas, quando vou entrar continua aparecendo sem ter entrado antes. “caso queira entrar com o mesmo nome clique aqui”
Outra coisa consigo entrar. coloco o nome entra no chat
quando quando digito e envio aparece um erro tanto no chat.php quando no chat-index.php
está dando este conflito com este arquivo
foreach($chat->listar() as $v){
Roberto, vc tá usando o script q disponibilizei, vc tá recriando passo a passo junto com as aulas?
tem como vce ensinar fazer um sistema de comentario igual esse do seu site ?
Carlos, dá uma olhada essas videoaula, q vão te ajudar:
http://www.videoaulasbrasil.com.br/tag/sistema-de-comentarios/
Existe outro meio para imprimir as mensagens dentro da div ?
Com jQuery, vc pode utilizar o .html() ou .text()
Oi David.
Cara eu fiz igualzinho a vc, coloco no localhost funciona tranquilo, mas quando eu coloco on line, não funciona, será que vc saber porque???
Fabio, verifique os dados de conexão com banco de dados da sua hospedagem.
David, existe alguma forma de minimizar as consultas feitas no banco de dados?
Por que se for uma rede social por exemplo, e muitos usuários estiverem conectados simultaneamente requisitando uma consulta a cada 5 segundos ou menos até, vai ter que ter um servidor muito bom.
Tem alguma idéia?
Abs! Muito bom mesmo suas aulas!
Rodrigo, essa forma q mostrei, ela terá problema devido ao excesso de requisição ao banco de dados. Vc pode utilizar a técnica de long polling pra minimizar isso. Aqui tem dois links q podem te ajudar :
http://rberaldo.com.br/server-push-long-polling-php-ios/
http://carlosmaniero.blogspot.com.br/2012/07/php-long-polling.html
Ola Amigo! Meus Parabéns pela vídeo aula do chat
Eu estou fazendo um trabalho na escola sobre chat, e precisava de colocar um formulário, também login e senha.
Pois meu trabalho fala sobre segurança e privacidade na internet, teria como você me ajudar?
obrigado amigo
PSO, nesse caso teria q refazer esse chat, desmembrando a tabela, pra tabela de usuários e uma tabela pra mensagens, exemplo:
TABELA usuario
id INT
nome VARCHAR(50)
email VARCHAR(80)
senha VARCHAR (60)
TABELA mensagem
id
usuario_id
content TEXT
criado DATETIME
Obrigado David por responder minha pergunta
Eu fiz como você falou a tela de cadastro eu consigo cadastrar tudo certo no banco de dado. Mas na tela inicial não consigo implantar o código para ele reconhecer a senha da erro >.< .
Ele esta entrando direto somente com nome, eu precisava que você mostra-se como ficaria esse código de nome e senha.
Obrigado
Olá, parabéns !!!
Realmente o chat está muito bom, melhor ainda a técnica. Ajudou muito o meu entendimento pois estou começando na programação web.
Q bom q pode te ajudar um pouco Marcio, no seu aprendizado. abrs
Gostei do script mas estou com um problema,entro uma vez e quando vou entrar de novo com um outro nome de usuário retorna com um erro que é esse
Warning: Cannot modify header information – headers already sent by (output started at /home/…./public_html/Batepapoonline/index.php:1) in /home/…/public_html/Batepapoonline/index.php on line 13
Warning: Cannot modify header information – headers already sent by (output started at /home/…/public_html/Batepapoonline/index.php:1) in /home/…/public_html/Batepapoonline/index.php on line 1
você pode me ajudar?
Rodrigo, está tendo uma saida de algum conteudo antes do header, como um tag html, ou espaço antes do código
ola amigo teria como eu clicar no nome da pessoa e teclar com ela..pois nesse metodo fica confuso saber pra quem esta indo a pergunta quando tem mais de um usuario…
Carlos, nesse caso teria que remodelar aplicação pra fazer dessa forma.
fica muito complicado usar um esquema onde eu clico no nome e falo somente com quem cliquei?tipo bate papo uol
Teria q remodelar aplicação. Tem uma videoaula no Videoaulasbrasil, q tem um aula sobre isso
Nao tive o privilegio de ver as video aulas.. queria saber se e possivel mandarem em meu email codigos de como fazer um sistema chat em um site….
Valeu!!!!
João, vc pode baixar por esse link o projeto: http://www.4shared.com/file/20F5_NR5/chat_2.html
obrigado amigão, eu realmente aprendi muito e devo dizer que fiquei seu fã, quando você postará novas aulas?
eu gostaria de saber também se tem como colocar webcam neste chat?
Blz Milton. Vai ser complicado fazer novas aulas, devido ao tempo. Sobre colocar webcam, teria que fazer algo em flash
Tenho duas tabelas:Aluno e Professor, como fica a tabela q vai ter uma relação entre as mensagens de que cada um postar?
Vai depender do q vc gostaria de fazer. O que poderia ter era uma tabela de usuário e outra de mensagem.
TABELA user
id
name
email
password
level
TABELA message
id
to_user
form_user
content
created
to_user => pra quem envia
form_user => quem está enviando
Olá, ao entrar com um nome para o Chat apareceu esse erro ==>
Erro fatal : Uncaught exceção ‘PDOException’ com a mensagem “SQLSTATE [28000] [1045] Acesso negado para o usuário ‘root’@’10.2.1.42′ (usando a senha: NO) ’em / home / u155585563 / public_html / classes / BD. class.php: trace 9 Stack: # 0 /home/u155585563/public_html/classes/BD.class.php(9): DOP -> __ construct ( ‘mysql: host = loca …’, ‘root’, ” ) # 1 /home/u155585563/public_html/classes/Chat.class.php(33): BD :: getConn () # 2 /home/u155585563/public_html/index.php(10): Chat-> existeNome () # 3 {principal} jogado na /home/u155585563/public_html/classes/BD.class.php na linha 9
Para eu retira-lo e seguir normalmente eu teria que modificar o PHP da pasta Classes e Config por que ambas são praticamente uma só !??
Vc precisa mudar os dados de acesso do banco de dados, no config
Não consigo baixa o arquivo, está apresentando erro!!!
Fatal error: Uncaught exception ‘PDOException’ with message ‘invalid data source name’ in C:\Program Files (x86)\EasyPHP-DevServer-14.1VC9\data\localweb\ChatChc\classes\BD.class.php:9 Stack trace: #0 C:\Program Files (x86)\EasyPHP-DevServer-14.1VC9\data\localweb\ChatChc\classes\BD.class.php(9): PDO->__construct(‘DSN’, ‘USER’, ‘PASS’) #1 C:\Program Files (x86)\EasyPHP-DevServer-14.1VC9\data\localweb\ChatChc\classes\Chat.class.php(33): BD::getConn() #2 C:\Program Files (x86)\EasyPHP-DevServer-14.1VC9\data\localweb\ChatChc\index.php(10): Chat->existeNome() #3 {main} thrown in C:\Program Files (x86)\EasyPHP-DevServer-14.1VC9\data\localweb\ChatChc\classes\BD.class.php on line 9
queria implementar este chat neste site q estou desenvolvendo, mas ao testar deu este erro, mesmo configurando tudo certo
Marcos, aparentemente vc tá passando a constante com aspas, e eles são sem aspas.
[php]
$pdo = new PDO(DSN, USER, PASS);
[/php]
Ótima video aula, me ajudou bastante, através dela adaptei um outro projeto. Minha dúvida é. Como inverter a ordem das conversas as ultimas aparecem sempre em baixo e a barra de rolagem sempre ficar em baixo. Tudo isso eu fiz no order by e função javaScript para a barra ficar em baixo, mas tem um problema, toda vez que atualiza de 5 em 5 segundos a barra fica em baixo e com isso se eu precisar subir a barra pra ver algo em cima depois de 5 segundos ela desce.