helyoWAP

TUTORIAL WML 
(12)

Programas comentados: 
phone16.wml - phone16a.wml - phone16b.wml - phone16c.wml -  phone17.wml - phone17.asp

Autor: Helio Fonseca Rosa

Esta página contém muitas figuras. Aguarde a carga se a conexão estiver lenta.

Programa phone16.wml

Introdução
Até agora, vimos que um ou mais cards puderam se utilizar de um  mesmo dado (armazenado em uma variável) pois os procedimentos ocorriam dentro de um mesmo deck (lembrando: todos os cards de um deck convivem na memória do simulador ou celular enquanto o programa está em execução).

Vamos estudar agora um programa armazenado no celular enviando dados para outro programa, este hospedado num servidor.

Mas antes uma pergunta: num tutorial "didático", qual o ambiente de teste ideal para esta situação?
Vamos optar por programas armazenados na memória do simulador OWG1 enviando dados para um programa hospedado num  servidor "simulado" no próprio micro, chamado de  PWS (Personal Web Server).

O servidor PWS proporciona um ambiente de trabalho chamado ASP (Active Server Pages  - Servidor de Páginas Ativas).

O Active Server Pages é um ambiente de script de servidores. Assim, ASP não é uma linguagem de programação, mas uma tecnologia capaz de processar scripts em um servidor da WEB.
Os scripts são escritos em linguagens especialmente desenvolvidas para tal, como o JavaScript, o VBScript (Visual Basic Script) e outras.
Os programas que operam neste ambiente devem conter a extensão .asp.

No entanto, o PWS pode hospedar programas que não contenham scripts e, neste caso, os mesmos terão suas extensões normais (como .wml).

No caso do Windows 98, o PWS está disponível no próprio CD do Sistema Operacional.
Se ainda não estiver instalado:
1. Insira o CD-ROM do Windows 98 na unidade de CD;
2. Clique na sequência :  "Meu computador" ---> Unidade de CD ---> pasta "adds-on" ---> "pws" ---> instalar.
3. Na seqüência de instalação escolha a configuração "Típica" e aceite a sugestão para instalar a pasta padrão no endereço C:\Inetpub\wwwroot.
4. Após a conclusão da instalação é necessário reinicializar o computador. O ícone do PWS  aparecerá no rodapé.

Para hospedar um programa no servidor PWS, ele deve ser salvo na pasta padrão C:\Inetpub\wwwroot , gerada no processo de instalação. Esta pasta está gravada no hard-disk mas pertence ao diretório do servidor PWS.

 

No caso, para acessar um programa WML,  deve-se digitar  http://localhost/nome-do-arquivo.wml  no campo de endereços (URL ) do simulador .

Para acessar um programa em ambiente ASP,  deve-se digitar  http://localhost/nome-do-arquivo.asp  no campo de endereços (URL ) do simulador .

Mais informações sobre ASP podem ser encontradas no tutorial sobre "páginas dinâmicas" do autor deste site, em http://sites.uol.com.br/helyr/wap/tutorial_asp_wml/asp01/asp01.html .


Nos exemplos desta página , alguns programas armazenados no "hard disk" do autor (ou do leitor!) - e, em conseqüência na memória do simulador - enviarão dados para o programa phone17 que estará hospedado na pasta padrão do PWS.  E serão recebidos de volta e exibidos na tela do simulador.
O programa phone17 será apresentado em versões .wml e .asp.


Programa phone16.wml

O exemplo mais simples de um programa enviando dados para outro,  utiliza a programação da tecla "Accept" para enviar o dado "de carona" no endereço do programa phone17 que está hospedado no PWS. 

As telas pretendidas são:


phone16.wml (código):

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" 
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card id="um">
<p>
<do type="accept" label="Enviar">
<go href="http://localhost/phone17.wml?name=$(nome_usuario)">
<setvar name="nome_usuario" value="Jeca Tatu"/>
</go>
</do>
</p>
<p align="center">
** HelyoWAP **
Programa phone16.wml
O nome "Jeca Tatu" e enviado para o phone17.wml
hospedado no servidor PWS
</p>
</card>
</wml>

Comentários:
A variável "nome_usuário" é inicializada pelo elemento "setvar" e seus atributos "name" e "value" : o nome da variável é "nome_usuario" e seu conteúdo é igual a "Jeca Tatu".
Ou seja, o dado consta do próprio programa, não foi fornecido ou digitado pelo usuário.
Observação: para enviar um dado diferente é preciso alterar o código do programa!
Este inconveniente será sanado no programa phone16a.wml.

O conteúdo da variável, representado por $(nome_usuario) é enviado junto com o endereço do programa phone17.wml.

Com relação aos endereços dos dois programas é preciso atenção!
O programa phone16.vml está  armazenado na "pasta  wmlphone" do hardisk  "C" do autor, conforme indicado no campo de endereço do simulador (figura acima), ou seja, file://c:/wmlphone/phone16.wml.
O programa phone17.wml está hospedado no servidor PWS e deve ser referenciado como um endereço da WEB (apesar do servidor estar dentro do micro do autor; a página a ser gerada pelo programa phone17.wml pode ser considerada como "publicada", não na WEB, mas no micro!).
O endereço "tipo http" é escrito assim: http://localhost/phone17.wml , ou seja , o servidor PWS é o "localhost".

O elemento  "setvar" está no interior do elemento "do" que tem associada a ela a tarefa especificada  por "go" .
Este conjunto de instruções proporciona a  programação da tecla "Accept", responsável pelo desvio.
Observação: a tag <go> não termina com uma barra invertida pois  há uma tag de fechamento </go>.
Repare que isto não acontece na sintaxe do "go" no programa phone16a.wml (abaixo).

Este processo em que o  dado é enviado "cavalgando" o endereço de desvio é uma forma abreviada do método GET, comentado mais adiante nesta página.

Vejamos então o código (muito simples) do programa phone17.wml.que está no servidor PWS.


phone17.wml (código)

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" 
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml> 
<card id="um"> 
<p align="center"> 
*** helyoWAP ***<br/>
Programa phone17.wml<br/>
hospedado no PWS<br/><br/>
Nome:<br/>
$(nome_usuario)<br/> 
</p> 
</card> 
</wml>

Comentário:
Notar que não houve necessidade de definir ou inicializar a variável "nome_usuario": foi referenciado apenas o seu conteúdo para exibição; este conteúdo foi enviado pelo programa phone16.wml, junto com o endereço que "chamou" este programa.


Programa phone16a.wml

Este é o programa phone16.wml modificado.
Aqui, o dado que será enviado para o programa phone17.wml será digitado pelo usuário no teclado do celular ou simulador.
Para a "entrada do dado" será utilizado o elemento "input" e seu atributo "name".
Eis as telas desejadas:

      


phone16a.wml (código)

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" 
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card id="um">
<do type="accept" label="Enviar"> 
<go href="http://localhost/phone17.wml?name=$(nome_usuario)"/> 
</do> 
<p align="center">
*** helyoMOBILE ***<br/> 
Digite seu nome:
<input name="nome_usuario"/> 
</p> 
</card>
</wml>

Comentário:
O dado é enviado junto com o endereço, como no programa phone16.wml, mas foi fornecido pelo usuário, ou seja, não esta contido no código do programa.
Para enviar um novo dado, basta processar novamente o programa e digitar o dado.


Programa phone.16b.wml

Os métodos GET e POST

Enviar dados para um servidor, de um modo geral, configura um "ambiente de script" e, para quem conhece HTML e o uso de formulários, vem logo à mente dois "comandos" ou "métodos": GET e POST.

"Muito por alto", o método GET é o processo utilizado para receber do servidor, por exemplo, uma página para ser exibida pelo browser. Mas também envia dados do browser para o servidor. O dado vai "de carona", "grudado" no endereço utilizado ("http://... ) e fica visível, ou seja, a segurança e a privacidade ficam prejudicadas.
O método POST envia dados para o servidor, em maior quantidade que o GET, mas estes dados não são facilmente visíveis, ficam ocultos.

Usando GET eis como fica o endereço que será visto mais abaixo nestes exemplos, se o nome digitado for bbbbbb :
HTTP GET Request: http://localhost/phone17.asp?nome_usuario=bbbbbb

Usando POST o endereço fica:
HTTP POST Request: http://localhost/phone17.asp?0oc=106 e o dado enviado segue em outro local como:
POST Data:  nome_usuario=bbbbbb
(Confira as informações acima maximizando a "janela preta" Phone Information" após a execução dos programas.

Nestes exemplos didáticos, vamos utilizar três programas:
1. Phone16b.vml, armazenado na "pasta  wmlphone" do hardisk  "C" do autor.
No campo de endereço do simulador deverá ser referenciado como file://c:/wmlphone/phone16b.wml.
Este programa vai receber um dado ("nome_usuario") inserido pelo usuário (via elemento input) e enviá-lo para o programa phone17.asp usando o método POST.

2. Phone16c.vml, armazenado na "pasta  wmlphone" do hardisk  "C" do autor.
No campo de endereço do simulador deverá ser referenciado como file://c:/wmlphone/phone16c.wml.
Este programa vai receber um dado ("nome_usuario") inserido pelo usuário (via elemento input) e enviá-lo para o programa phone17.asp usando o método GET.

Lembrando:
A  extensão .asp sugere que o programa phone17.asp, apesar de conter apenas  "comandos" wml, poderá ser adaptado para receber scripts e operar em ambiente ASP.

3. O programa phone17.asp, (no caso, não contém scripts). É o mesmo programa phone17.wml que  vai receber um preâmbulo adicional ( <% Response.ContentType = "text/vnd.wap.wml" %> ) e terá mudada sua extensão de .wml para .asp .

Como citado anteriormente nesta página, no servidor PWS estaremos num ambiente de script, no caso, um "ambiente ASP"  (Active Server Pages).
No PWS, o programa phone17.asp está hospedado na sub-pasta "wwwroot" da pasta "Inetpub", considerada a pasta "padrão" do PWS (Inetpub é gerada automaticamente quando o PWS é instalado a partir do CD-ROM do Windows).
Mas, no campo de endereço do simulador ou numa referência interna num programa, é preciso um pouco de atenção, pois a notação foge ao modo convencional: o endereço do programa phone17.asp, nestas condições, passa a ser:
http://localhost/phone17.asp  (para todos os efeitos didáticos, você pode imaginar que a página representada pelo programa phone17.asp está publicada, via servidor PWS, não na WEB, mas nos interior do micro do autor - ou do seu!).
(Lembrando: Este ambiente é explicado com mais detalhes em http://sites.uol.com.br/helyr/wap/tutorial_asp_wml/asp01/asp01.html )


Programa phone16b.wml      -     Usando method="post"

Objetivo: Adaptar o programa phone15.wml para que os dados entrados sejam enviados para conferência em outro programa (outro DECK, no caso, phone17.asp).
(No programa phone14.wml os dados eram conferidos em outro card mas no mesmo programa ou deck.).
Eis as telas pretendidas:

  

     

 

phone16b.wml (código)   -  Usando method="post":

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" 
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card id="um">
<do type="accept" label="Conferir"> 
<go href="http://localhost/phone17.asp" method="post"> 
<postfield name="nome_usuario" value="$(nome_usuario)"/>
</go>
</do> 
<p align="center">
*** helyoMOBILE ***<br/>
Programa phone16.wml<br/>
(na memoria do simulador)<br/>
Digite seu nome:
<input name="nome_usuario"/><br/>
*** helyoMOBILE ***<br/> 
Seu nome sera enviado para o prog. phone17.asp hospedado 
no PWS via post/postfield 
</p> 
</card> 
</wml> 

Comentários:
Você pode pensar no elemento <postfield> como aquele que permite o envio de uma dupla de informações (nome/conteúdo da variável) de carona no endereço de desvio do programa. Trabalha em associação com o atributo "post" do elemento <go>. No caso, temos : 
<go href="phone17.wml" method="post"> 
<postfield name="nome_usuario" value="$(nome_usuario)"/>
Então, são enviados para  para o programa phone17.wml as seguintes informações: o nome da variável "nome_usuario" e o seu conteúdo "$(nome-usuário)", ou seja, o nome digitado.

phone16c.wml (código)  -  Usando method="get"

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" 
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card id="um">
<do type="accept" label="Conferir"> 
<go href="http://localhost/phone17.asp" method="get"> 
<postfield name="nome_usuario" value="$(nome_usuario)"/>
</go>
</do> 
<p align="center">
*** HelyoWAP ***<br/>
Programa phone16.wml<br/>
(na memoria do simulador)<br/>
Digite seu nome:
<input name="nome_usuario"/><br/>
*** HelyoWAP ***<br/> 
Seu nome sera enviado para o prog. phone17.asp hospedado 
no PWS via get/postfield 
</p> 
</card> 
</wml>

Comentário:
Esta é a mesma listagem do programa anterior em que o method="post" foi substituido por method="get".
Fica como exercício para o leitor copiar/colar este programa no Bloco de Notas, salvá-lo como
phone16c.wml e realizar o teste.


Phone17.asp (código): 

<%
  Response.ContentType = "text/vnd.wap.wml"
%>

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" 
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml> 
<card id="confere"> 
<do type="accept"><noop/></do>
<p align="center"> 
*** helyoWAP ***<br/>
Prog. phone17.asp hospedado no servidor PWS.
</p>
<p>
Voce digitou: 
$(nome_usuario)<br/> 
</p> 
</card> 
</wml>

Comentário:
Repare que neste deck de apenas um card, não há uma definição prévia da variável "nome_usuário" nem uma atribuição de um valor inicial para a mesma.  Ela é simplesmente referenciada para exibição.
Como este programa foi "chamado" ou "solicitado" pelo programa phone16.wml (na realidade ocorreu um desvio para este), face  ao uso do method="post" (ou method="get") e do elemento postfield, a variável "nome_usuário" e seu conteúdo indicado por $(nome_usuario) foram transportados para este programa.

Lembrando: o minibrowser do simulador ou aparelho celular ("memória do celular") armazena apenas o conteúdo de um deck de cada vez.
Neste processo que acabamos de ver, o nome da variável e seu conteúdo são enviados, do simulador ou celular,  via HTTP, para o servidor onde está hospedado o programa phone17.asp
Depois de atuar, o programa phone16b.wml / phone16c.wml é substituído na memória do simulador ou celular pelo programa enviado pelo servidor PWS (no caso, o servidor retira o "preâmbulo" ASP e envia apenas a parte wml do programa e  o dado a ser exibido).
Se você tiver paciência, poderá verificar estes detalhes clicando em "Info" ---> "Source no simulador e conferindo as listagens na "janela preta" Windows Information, minimizada no rodapé enquanto o simulador está ativo.

Observe que no programa phone17.asp, foi usada a linha de código <do type="accept"><noop/></do> , que oculta o label da tecla "Accept" e inibe uma nova ação do dispositivo.

 

WirelessBRASIL                 Portal helyoWAP                    Anterior                    Próxima