Depois de um bom tempo estou aqui novamente!

Eu recomendo todos que não viram as partes um e dois do tutorial, que as veja.
Engatinhando com AJAX e PHP. Parte 1
Engatinhando com AJAX e PHP. Parte 2

Nessa 3ª parte, vamos ver como usar Requisição POST.

Vamos para o que interessa!

Criando nosso formulário

Vamos criar um formulário normal.
index.htm

Aqui estamos linkando nossa biblioteca para criar nosso objeto XMLHttp. Caso você não esteja entendendo essa parte, recomendo você ler os dois primeiros artigos.

A unica coisa que é novidade, é o onSubmit alí. Quer dizer que quando o formulário for submetido, vai ser rodado uma função javascript ao invez de enviar diretamente o formulário. Depois é dado um return false para ter certeza que a página não dê refresh.

Requisição POST

A requisição post precisa ser enviada no formato, pelo cabeçalho http:
nome1=valor1&nome2=valor2&...&nomeN=valorN

para isso vamos criar a função que gere esse formato para nós.
Vamos chama-la de criaReqStr()

Essa função está assumindo que lhe será informada o objeto do formulário, como argumento. Um array(aPostStr) é criado para guardar cada par de nome-valor. Depois, conforme o numero de elementos do formulário, é concatenado o par nome-valor à variável aPostStr. No final do loop, é retornado a informação dos pares nome-valor corretamente.

Você pode se perguntar: Porque usar esse join() no final sendo que eu posso concatenar tudo direto?
Realmente, seria o mais lógico. Mas cada concatenação, em web-browsers, é muito pesada para o processo, então quanto menos você concatenar melhor.

Fazendo a requisição

Para isso, vamos criar a função enviaReq(), que é bem parecida com a função para a requisição GET.

Primeiramente ela seta a referencia do form numa variável(oForm). Depois recebe a string dos pares nome-valor pela função criaReqStr(), lembram?
Em seguida é instanciado o objeto xmlhttp pela função criaXMLHttp().
Depois que está o “tchan” do negócio, no método open() o primeiro parâmetro é “post”, qual requisição queremos fazer. O segundo parâmetro é a página que iremos enviar a requisição, que no caso é o atributo action do formulário. O terceiro parâmetro é true em caso de querer que a requisição seja assíncrona.
Depois é setado um cabeçalho de que a informação está codificada(urlencode). Importante, porque a maioria das linguagens server-side verifica essa codificação para o parsing da informação

Depois é só exibir o resultado no nosso div#divStatus pela função exibeResult():

Simples não?

Agora vamos para a parte mais fácil: O server-side.

Criando nosso arquivo PHP

Ele é super simples, muito igual ao no caso da requisição feita pelo método GET.
postAjax.php

Você percebeu que mudamos o cabeçalho do arquivo para texto normal, usando a função header(). Depois só recebemos as variáveis pelo array global $_POST[].
Inserimos no banco de dados, e em caso de sucesso exibe a mensagem de sucesso. Em caso de erro(banco de dados com problema), exibe a mensagem de erro.

Baixando o tutorial

Para maior proveito do tutorial, baixe o tutorial agora:
post-ajax-php.zip
post-ajax-php.tar.gz

Nessa parte 3 fui bem mais direto ao ponto, agora que todo mundo já sabe o básico de AJAX com PHP né? hehehe

Mas é isso aí. Nas próximas versões do tutorial, vamos ver como fazer um validador de formulário conversando com banco de dados.

Esse tutorial tem como objetivo mostrar para as pessoas que nunca viram nada sobre o ZF(Zend Framework) e estão querendo saber como ele funciona.

Quem já ouviu falar do Zend Framework? Resumidamente a Zend é uma empresa responsável pela manutenção e desenvolvimento do PHP.
A engine de orientação a objetos do php5 foi totalmente reescrita pelo pessoal da Zend.

Mas o que seria um framework?

O framework é um conjunto de classes com objetivo de reutilização de um design, provendo um guia para uma solução de arquitetura em um domínio específico de software. (Wikipedia)
Pode-se dizer que ele seria um conjunto de bibliotecas específicas.

Falando nossa lingua, o framework é um conjuntão de bibliotecas que ajuda em nosso trabalho do dia a dia, e nos trabalhos mais complicados também.

Esse artigo utiliza a versão 0.8 do framework. (dia 28/02/07)
[atualizado]
Versão atual: 1.0.2 (01/09/07)
[/atualizado]

Entendendo o Zend Framework

O Zend Framework segue o padrão MVC - Model View Controller. É um padrão de arquitetura onde separa o GUI, templates, etc(View) da lógica(Model) e do controle(Controller).
Então nele você pode usar a mesma lógica e/ou controle em diversas interfaçes com o usuário.

Usando o Zend Framework

• Faça download dele no site oficial: http://framework.zend.com/download
• Descompacte o arquivo em qualquer pasta. Exemplo: tar zxvf ZendFramework-1.0.2.tar.gz -C ~/

Agora vamos arrumar a estrutura de diretórios necessária para o correto funcionamento do ZF.

PS: a pasta ZF-tutorial fica dentro do DocumentRoot, que é onde fica suas páginas no servidor(padrão do apache: htdocs/ ou /var/www/).

No caso a pasta controllers, models e views estão dentro da pasta app(application, nome sugestivo). publico é onde vai suas outras coisas normais como imagens e css, js e assim por diante. E lib é a pasta onde vai ficar o ZF.

Entre na pasta onde você descompactou o arquivo tarball(.tar.gz), depois entre na pasta library e copie a pasta zend para a sua pasta lib(na ZF-tutorial) do seu sistema. Talvez você precise mudar(ou copiar) como root, aqui no exemplo vou usar sem o root.

Aí depois no diretório lib irá ter lib/Zend, certo?

Configurando o Apache

Primeira coisa que temos a fazer é abilitar o módulo rewrite do apache.
Edite o arquivo de configuração do apache, httpd.conf.
Descomente(tirando o #) a linha onde está escrito:

Defina o AccessFileName (pode ser no final do arquivo):

Setar a opção AllowOverride como All.

Trocar as linhas abaixo:

por:

Criando o Bootstrapping

O controller do ZF, Zend_Controller, é feito para suportar websites com urls limpas.
Então, todas as requisições precisam ser feitas diretamente em um arquivo index.php, essa prática é conhecida como bootstrapping.
E para isso precisamos criar alguns arquivos .htaccess.

ZF-tutorial/.htaccess

Essa RewriteRule quer dizer que para qualquer coisa escrita ele(apache) irá redirecionar para o index.php(que fica dentro do ZF-tutorial, calma que ainda vamos cria-lo).
Alí também setamos algumas configurações do PHP.ini. Essas configurações provavelmente já estão setadas como padrão, mas é bom ter certeza né. Elas só vão funcionar se estiver habilitado o mod_php no httpd.conf do apache.

Agora vamos setar nosso .htaccess na pasta público. Lá estará os arquivos JavaScript, CSS, imagens e assim por diante. Então vamos habilitar tudo por lá.

ZF-tutorial/publico/.htaccess

Agora na pasta app e no lib não queremos que nenhum intruso acesse, porque lá estão nossos arquivos preciosos.
ZF-tutorial/app/.htaccess

ZF-tutorial/lib/.htaccess

Esse esquema de bootstrapping é recomendação dos desenvolvedores do ZF, ok? Motivo de segurança, sabe como é né.

Criando o nosso index.php(bootstrap file)

Agora vamos criar nossa index.php na pasta ZF-tutorial.
ZF-tutorial/index.php

Note que agente não fecha a tag php para nos previnir de erros usando o header(), no caso de espaços em branco adicionais depois do ?>.

Agora na pasta controllers vamos criar um IndexController.php. Esse controller vai entrar em ação sempre que o index for chamado.
Para entender como funciona, precisamos saber como o Zend_Controller_Front trabalha.
O ZF usa um sistema de Controllers(Controladores) e Actions(Ações). E isso é setado diretamente na url(lembra do bootstrapping?). Como?
Usando o nosso exemplo, no formato http://localhost/ZF-tutorial/index/teste o index é o Controller e o teste é o Action. Outro exemplo, http://localhost/ZF-tutorial/foo/bar o foo é o Controller e o bar é o Action.
E quando você não coloca nada? Exemplo, http://localhost/ZF-tutorial/ o Zend_Controller_Front considera como index o Controller e index a Action.
O que vem depois é parâmetro, mas isso é assunto pra depois

Vamos fazer nosso IndexController então
ZF-tutorial/app/controllers/IndexController.php

Atenção: Sempre o controller deve levar esse padrão NomeController.php e a classe com o mesmo nome do arquivo. A primeira letra sempre em maiúsculo e o resto minúsculo.
Já os Actions também deve levar esse padrão nomeAction(), sempre minúsculo.

Mas se você for rodar o sistema agora, vai perceber que vai dar uma excpetion gigantesca aí, certo?
Ela está falando que nós não temos o viewer para o index action do index controller.

Para criar, precisamos acessar a pasta scripts que está no ZF-tutorial/views/. Lá vamos criar uma pasta para cada Controller nosso, no nosso caso iremos criar uma pasta chamada index(por causa do IndexController). Todos os templates para o IndexController devem estar nessa pasta. O mais legal é que o nome do template leva o nome da action.
Calma, vou explicar: Por padrão cada action você pode ter um template ou não, mas se a action for tem um template para ela, então o template deve levar o mesmo nome da action. Por exemplo index.phtml(extenção do template) é o viewer do indexAction(), sacaram?

Na prática agora:

Agora nós temos que criar o index.phtml
ZF-tutorial/app/views/scripts/index/index.phtml

é recomendável que usemos o escape para escapar tags html.

Agora vamos testar nossa aplicação.
Acesse o http://localhost/ZF-tutorial e depois tente http://localhost/ZF-tutorial/index/index
Você vai perceber que deu no mesmo.

Tarefinha, de leve

Agora deixo uma tarefa para vocês: Criar um zfAction(), no IndexController, com seu respectivo viewer. Após criado, acessem http://localhost/ZF-tutorial/index/zf e vejam o que aconte!

Conclusões

Apesar desse tutorial mostrar de maneira simples como funciona o Zend Framework, podemos perceber como o Zend Frameowork é facil de usar e ao mesmo tempo é poderoso.
Para um maior aprendizado, irei postar um novo tutorial com muito mais recursos do ZF.

Por enquanto eu recomendo um tutorial muito bom(desenvolvedor do ZF), eu me baseei no tutorial dele, e tabmém usem bastante o manual.

Acesse a página de tutoriais do Zend Framework

Cya later!!

Nesse tutorial vamos fazer nosso primeiro exemplo de AJAX + PHP.
Vamos usar primeiramente o XMLHttp GET Request.

Quem não viu ainda, a parte 1 do tutorial você encontra aqui mesmo.

[update 03/10/07]
Parte 1 do tutorial AJAX + PHP
Parte 3 do tutorial AJAX + PHP
[/update]

Bora lá!!

Criando o Objeto XMLHttp

Vamos mexer um pouco no JavaScript para criar a requisição.

Primeiro ela testa se o browser suporta o XMLHttpRequest e cria se o suportar.. se não ele cria um array com várias versões do XMLHttp para browsers mais antigos(IE). E fica em um loop até conseguir criar um objeto, se não criar nenhum ele retorna a mensagem de erro.
Resumindo: a função testa as possibilidades do browser de criar o objeto XMLHttp. Se for o IE 6.0 ele cria o MSXML2.XMLHttp.5.0 e assim por diante.

Usando o XMLHttp

O objeto XMLHttp tem um método que a mais imporante, a open(). Ela tem 3 parâmetros que precisamos saber:

• Tipo da requisição: sintrg que indique o tipo: get ou post
• URL: string com a url que você quer fazer a requisição
• Async: boolean que indica se o modo da requisição seja feito assincronamente(não sei escrever essa palavra )

O ultimo parâmetro é o mais importante.. ele que vai dizer se a sua requisição é AJAX mesmo ou não. Se ele for true, a requisição é feita em tempo real. Já se você colocar false, a requisição é feita e o resto da página só é loadada quando a requisição retornar algo ou terminar.
Exemplo:

Outro evento importante no XMLHttp é o onreadystatechange. O XMLHttp tem uma propriedade chamada readyState que muda conforme a requisição é recebida. Existem 5 estados para o readyState:

• 0(Não Iniciado): O Objeto foi criado mas o método open() não foi chamado ainda.
• 1(Carregando): O método open() foi chamado mas a requisição não foi enviada ainda.
• 2(Carregado): A requisição foi enviada.
• 3(Incompleto): Uma parte da resposta do servidor foi recebida.
• 4(Completo): Todos as informações foram recebidas e a conexão foi fechada com sucesso.

Toda vez que a propriedade do readyState for mudada, o evento onreadystatechange é disparado. Por causa das diferentes implementações dos browsers, a propriedade do readyState não funciona corretamente em todos os browsers. O unico modo para cross-browser é usando o valor 0, 1 e 4 para o readyState. Mas na maioria dos casos você usará apenas o estado 4 mesmo.
Depois de tudo isso temos que realmente enviar a requisição com o método send(). Quando utilizamos a requisição por GET nós não precisamos passar nenhum parâmetro no send(). Depois quando vermos com POST aí iremos usar mais profundamente.
Exemplo:

Tá bom, mas e agora? Enviei tudo, recebi e pronto. Cadê minha informação?
Ta certo, agora é bem simples, existe uma propriedade no XMLHttp que ele tem o retorno do http request, o responseText(no nosso caso, poderia ser responseXML). Lembram da primeira parte do tutorial? Então, agora vamos usar ela.
Primeiro vamos testar se a informação retornada veio com sucesso (200). Para testarmos o status do retorno existe a propriedade status do XMLHttp. Tudo muito simples não? Então olha o exemplo:

Beleza. Até aí vimos exemplo bem bobos, apenas para intendermos como funciona as coisas.
Agora sim vamos ver como fica uma aplicação com AJAX e PHP.

Já temos a função que retorna o Objeto XMLHttp, então vamos fazer a partir dela.
Agora vamos para o código HTML.
Criamos duas divs. Uma vai exibir o resultado e outra vai ser o campo onde você coloca o id para fazer a pesquisa.

Agora, na função lerId() temos que pegar o valor do campo id e enviar ele na requisição usando GET e depois disso, recebemos o valor e exibimos na div resultado.
Fica assim:

Como já vimos como funciona a requisição XMLHttp não vamos ter muita dificuldade de entender essa. A unica diferença com o exemplo é que nós passamos um parâmetro para a página pegaId.php e exibir o resultado no div resultado.

Agora vamos criar a página pegaId.php que irá ler o id enviado pela requisição Http e retornar o status.
lerId.php:

Agora o seu primeiro programa com AJAX está escrito.. bem simples não?
Ele só recebe o id que veio por GET, procura no banco de dados, e exibe o nome da pessoa referente ao id(exemplo apenas)..
A unica coisa que pode ficar meio no ar é a questão do header e do echo no final. O header serve para fazer com que o retorno do arquivo fique em formato texto e não em outro tipo(como html, php). Pois nós usamos o XMLHttp.responseText. Se você colocar alguma tag html, na pagina principal, onde o script é rodado, irá funcionar o html, pois a página é html. Agora se você rodar o lerId.php ele irá exibir como se fosse um texto normal.
O echo serve apenas para exibir o resultado. Todo o resultado que você quer que seja exibido no cliente você tem que exibir em seu script php, pois o XMLHttp.responseText pega justamente o que a página php(server-side) exibe, no caso um texto.

Terminamos por hoje nossa aula de AJAX com PHP parte 2.

Na proxima aula vamos ver como funciona a requisição pelo método POST.

Dúvidas podem comentar.

Abraços

Esse é meu primeiro tutorial sobre AJAX e espero que não seja o único.

[update 03/10/07]
Parte 2 do tutorial AJAX + PHP
Parte 3 do tutorial AJAX + PHP
[/update]

Como esse tutorial é bem básico, para quem está começando com AJAX, eu vou esplicar explicar coisas bem básicas. Desde como funciona o protocolo HTTP e um exemplo de AJAX.

Para que você possa usufruir ao máximo do tutorial, você necessita de conhecimentos de HTML, JavaScript e PHP.

Vamos ver aqui então: Como funciona um HTTP request, um HTTP response, técnicas utilizadas e como comunicar o cliente com o servidor.

HTTP Resquests

O formato de um HTTP request é assim:
<requeste-line>
<headers>
<blank line>
[<request-body>]

A primeira linha(<requeste-line>) necessita da indicação do tipo do request, diretório de acesso eda versão do HTTP. Já no <headers> indica informações adicionais para o server. Depois a <blank line>, é seguida do <request-body> que é opcional.

Não vou ficar explicando muito aqui, pois não é o foco do nosso tutorial. Agora vou mostrar um exemplo prático de como o browser envia o HTTP request:
GET /?cod=1 HTTP/1.1
Host: www.felipetonello.com
User-Agent: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1) Gecko/20060601 Firefox/2.0 (Ubuntu-edgy)
Connection: Keep-Alive

Explicando resumidamente: Na primeira linha vimos que usamos o tipo GET seguido da / quer dizer que irá acessar ao diretório root do server com o parametro cod=1 e em seguida da versão do HTTP. Depois os cabeçalhos que são auto-explicativo.
Quem usa PHP a um tempo conhece bem esses headers.

Então vimos como o browser se comunica com os servidores por meio do HTTP(Hypertext Transfer Protocol).

HTTP Responses

Agora vamos ver como o servidor responde, quando recebe um request, por meio do HTTP.
<status-line>
<headers>
<blank line>
[<response-body>]

O formato é bem parecido, apenas muda a primeira e ultima linha. Na primeira linha ele retorna a versão do HTTP e o status da resposta. Já na ultima ele retorna o corpo da resposta. Exemplo:
HTTP/1.1 200 OK
Date: Sat, 11 Nov 2006 23:59:59 GMT
Content-Type: text/html;charset=UTF-8
Content-Length: 122

<html>
<head>
<title>Felipe Tonello</title>
</head>
<body>
<!-- Aqui vem o corpo -->
</body>
</hmtl>

Na primeira linha temos a versão do HTTP em seguida do status(200). Os cabeçalhos e depois a resposta que no caso foi como um text/html.
Os status mais comuns são:

• 200 (OK): arquivo encontrado com sucesso.
• 304 (NOT MODIFIED): O arquivo não foi modificado desde o ultimo request. Isso é mais utilizado em browsers com mecanismos de cache.
• 401 (UNAUTHORIZED): Cliente não tem autorização para acessar o arquivo. Normalmente isso irá fazer com que o browser pergunte por usuário e senha para logar no servidor.
• 403 (FORBIDDEN): O Cliente falhou na autorização. Normalmente acontece quando você falha na autorização depois de um erro 401.
• 404 (NOT FOUND): Quando o arquivo não existe na localização informada.

Nesse tutorial vocês entenderam como funciona o protocolo HTTP para se comunidar entre servidor e cliente.
Para não ficar muito grande vou separar em 2 partes. Na proxima parte vamos ver um exemplo de comunicação cliente-servidor usando AJAX.

Até mais.

Alguns programadores sabendo da “dificuldade” para instalar o lampp (compilar mysql, php etc..) criaram um XAMPP.

Resumindo ele é um programa q instala tudo que falei no tópico, Apache, MySQL, PHP e Perl, fora as bibliotecas mais usadas e etc…

Vamos lá..

Primeiro baixe a ultima versão do download do xampp(no caso 1.6.4):
http://www.apachefriends.org/download.php?xampp-linux-1.6.4.tar.gz

depois abra o terminal e digite:

sudo tar xvfz xampp-linux-1.6.4.tar.gz -C /opt
só utilize este comando para instlar, não use nenhum outro descompactador nada…
e se você ja tiver instalado xampp outra vez, ele sobre escreve…
ele vai instalar tudo na pasta /opt/lampp

(mais…)

Mesmo o PHP5 sendo lançado a um bom tempo já, e também ja sabemos que irá lançar o PHP6, muitas pessoas não sabem realmente a principal diferença entre o PHP5 e o PHP4(ou anteriores). Com esse artigo eu irei mostrar as principais mudanças.

A principal mudança do PHP5 é a Orientação a Objetos. No PHP5 os engenheiros do Zend reescreveram toda o modulo de orientação a objetos para melhor performance e mais poder também na linguagem. (mais…)