módulo loja virtual - 001

8/19/2019 Módulo Loja Virtual - 001

1/35

Módulo de apostila : Loja virtual em ASP Número : 001 Número de páginas :

É expressamente proíba a reprodução total ou parcial do conteúdo desta apostila sem a préviaautorização da High Tec Informática, estando o infrator sujeito as penalidades previstas em Lei. Estemódulo publica nomes comerciais e marcas registradas de produtos pertencentes a diversascompanhias, utilizando estas marcas somente para fins editoriais e em benefício dos proprietários dasmarcas, sem nenhuma intenção de atingir seus direitos.

A High Tec Informática não comercializa a nenhum título softwares, sendo que osmesmos deverão ser adquiridos pelos alunos através dos distribuidores credenciados.

1/35


2/35

Agora que conhecemos sobre ASP, CGI, HTML, entre outros, iremos criar um site do tipo

osso principal objetivo será de construir o site e não de explicar passo a passo os

amos gerar primeiramente o arquivo INDEX.HTM, ou seja, a página principal do nosso

este iremos incluir alguns gráficos de nossa home-page, e iremos enviar os mesmos em

stes gráficos, serão numerados de acordo com o número do módulo, desta forma, ficará

emos utilizar o editor FrontPage 2000, porém, iremos também exibir o código completo

e você possui o FrontPage 2000, siga os passos a seguir, caso contrário, digite apenas o

. Inicie o FrontPage;enu ARQUIVO ... SALVAR COMO;

uida salve o arquivo como

4. rquivo (gráfico) loja1_1.jpg (que acompanha o módulo em anexo);

duas colunas e uma linha, onde iremos disponibilizar

e-commerce, utilizando principalmente da tecnologia ASP.

N

principais comandos utilizando o mesmo, sendo que tal procedimento, foi explicado nosmódulos anteriores.

Vsite, que terá o objetivo principal de efetuar a venda de cursos on-line.

Nanexo, juntamente com esta apostila, para que, se for o caso, você construa o siteexatamente igual ao nosso.

E bem fácil a organização dos arquivos e seus respectivos complementos.

Ir da aplicação, desta forma, você poderá gerar o site mesmo sem possuir o FrontPage 2000instalado. Mãos a obra.

Scódigo completo do arquivo INDEX.HTM, constante mais adiante:

12. Clique na opção de m3. Aponte para a pasta onde o PWS está instalado e em seg

INDEX.HTM;Agora, insira o a

5. Centralize o gráfico na página;6. Vamos inserir uma tabela com

algumas informações sobre a página, neste ponto, sua página que está sendo gerada noFrontPage, tem o seguinte aspecto:

2/35


3/35


4/35

12. Por se tratar de uma pesquisa, poderemos excluir o botão (REDEFINIR), bastando

clicar uma vez sobre o mesmo e em seguida pressionar a tecla ;

ADES DO

idade NAME do botão para “PESQUISA” e orótulo do botão para “PESQUISA”;

17. da fonte para “azul” e o modo para “negrito” e digite o conteúdo “CURSO

19. nserir no formulário uma caixa de texto de uma única linha,entado,

13. Agora, clique com o botão direito do mouse sobre o botão do formulário e em seguida,no menu suspenso que é apresentado, selecione a opção “PROPRIED

CAMPO DO FORMULÁRIO”, para que possamos alterar as propriedades do botão deação, configurando as mesmas, conforme consta da figura a seguir:

14. Desta forma, estamos alterando a propr

15. Com o cursos antecedendo o botão , pressione uma vez a tecla;

16. Retorne o cursor para a linha anterior;Altere a corDE SEU INTERESSE :”;

18. Pressione a tecla ao mesmo tempo que pressionar a tecla ; Na linha abaixo, vamos i para isso, clique na opção de menu , no menu suspenso que é apresselecione a opção e ao lado, escolha , redimensionando a área de digitação para o tamanho da borda doformulário. Neste ponto, sua página terá o seguinte aspecto:

4/35


5/35

20. Clique com o botão direito do mouse sobre o componente “caixa de texto de uma linha”e no menu suspenso que é apresentado, selecione a opção “PROPRIEDADES DOCAMPO DO FORMULÁRIO”, em seguida, na janela que é exibida, altere as

eira linha de texto, em fonte

DO SITE”, pressionando a tecla sem seguida;2. Agora, selecione o alinhando à esquerda;

24.ras e desligando o marcador

or “PRETA/NORMAL” e em seguida, digite a

26.

propriedades do componente conforme mostra a figura a seguir:

21. Na coluna da direita, insira na prim“VERMELHA/NEGRITO”, e “CENTRALIZADO”, o conteúdo “NOVOS CURSOS

223. Acione a opção de marcação de texto;

Digite em sequência as palavras “WAP Internet sem fios”, “PHP”, “MySQL”, pressionando a tecla entre cada uma das palavem seguida;

25. Na linha seguinte, escolha fonte da cexpressão “FALE CONOSCO”; Neste ponto, sua página terá o seguinte aspecto:

5/35


6/35

27. Marque o texto < FALE CONOSCO> e em seguida, clique sobre o botão , configurando o mesmo conforme a figura a seguir:

6/35


7/35

28. Desta forma, criamos um link para enviar um e-mail ao endereço

[email protected] . Confirme a operação clicando sobre o botão.

29. Veja a seguir o código completo do arquivo (página) INDEX.HTM, para que você, no

caso de não possuir o FrontPage 2000, possa digita-lo em qualquer editor de textos,salvando como arquivo do tipo “SOMENTE TEXTO ou TEXTO DO DOS”:

Projeto Aprenda em Casa

Pesquisa de Cursos

Curso de seu interesse:

NOVOS CURSOS DO SITE

WAP internet sem fios;

PHP;

MySQL;

FaleConosco

** Atenção: caso você esteja usando o FrontPage, não esqueça de alterar a propriedade“action” do formulário para “listacursos.asp, pois este será o arquivo que iremos acionar

quando o cliente tentar localizar um determinado curso.Observe que a primeira página (INDEX.HTM) é simples e sem a necessidade do acesso a banco de dados, porém todas as outras deverão executar este procedimento, devido a isto,iremos a seguir, criar o banco de dados que será utilizado durante o desenvolvimento dasdemais páginas.

7/35

mailto:[email protected]:[email protected]


8/35

Neste site, iremos partir do principio de que todos os cursos seriam realizados por CD-ROM, e que dependendo do estado, o valor do frete será modificado.

Além disso, temos que considerar que um único aluno, poderá adquirir mais de um curso, e

que o aluno poderá optar pelo pagamento via boleto bancário. Neste caso, teremos as seguintes tabelas:

Estados, Frete, Venda, ItensVenda, Boleto e cursos.

O banco de dados terá o nome de “aprendaemcasa”.

A seguir, observe a estrutura das tabelas:

8/35


9/35

** atenção, salve o banco de dados “aprendaemcasa” no mesmo diretório das páginasHTML e Scripts ASP.

Neste módulo, vamos falar sobre um arquivo especial, o GLOBAL.ASA, que será degrande utilidade no site da loja virtual. A principio, o arquivo Global.asa é um arquivo de

xto, que poderá ser criado pelo programador. Este deverá estar localizado no diretório-

seguir, observe a estrutura básica do arquivo Global.asa:

do procedimentoEnd Sub

teraiz do aplicativo ASP, e é formado por quatro eventos, que são responsáveis pelarealização de eventos. A

Sub Application_OnStart

Codigo

9/35


10/35

Sub Session_OnStart

Codigo do procedimento

digo do procedimentond Sub

digo do procedimentond Sub

a par ão localizados todos os objetos de nível Application, queados com a TAG Object.

a TAG object estão os objetos de nível Session.

guir, temos uma TAG Script que está indicando a linguagem e a localizaçãotilizadas para executar o código.

série de eventos, ou seja, instruções que serão seguidasuando o aplicativo for iniciado, a sessão for iniciada, a sessão for encerrada e o aplicativo

a palavra-chave END SUB. Observe na tabela a seguir asta dos eventos disponíveis e sua finalidade dentro do código:

End Sub

Sub Session_OnEndCóE Sub Application_OnEnd

CóE N te superior do arquivo, estsão declar Em seguida, também com Logo a seu E depois poderemos programar umaqfor encerrado.

Observe que um evento é disparado, ou seja, iniciado através das palavra-chave SUB e seuscomandos são finalizados através dli Evento FinalidadeApplication_OnStart Disparado quando a primeira página do

aplicativo é solicitadaApplication_OnEnd Disparado quando o IIS é encerradoSession_OnStart Disparado quando a primeira página d

aplicativo é solico

itada por um visitanteSession_OnEnd Disparado quando o tempo de sessão termina.

O Objetivo principal do arquivo GLOBAL.AS

variáveis globais ligadas ao banco de dados. Mas qual a finalidade deste tipo de operação.você migre seu aplicativo do banco de dados ACCESS para o bancoão irá precisar realizar mo

simplesmente no arquivo GLOBAL.ASA, que i o ao

A em nosso site de loja virtual é de gerar

Vamos imaginar quede dados SQL, n dificações dentro do Script das páginas e

rá fornecer as variáveis globais de acess banco de dados.

Inicie o editor de textos de sua preferência e digite o código a seguir do arquivoGLOBAL.ASA:

10/35


11/35

Sub Application_OnStartApplication.looServer.scripttim

keout=60

Application(“BancodeDados”)=”C:\caminho da aplicação\aprendaemcasa.mdb”

Script>

principio declaramos a linguagem que será utilizada, através do parâmetro LANGUAGEetro RUNAT declaramos onde o aplicativo será executado.

uência, teremos os seguintes

. O aplicativo é bloqueado, através do método Application.Look, desta forma poderemos

ra 60;. Criamos uma variável global denominada BANCODEDADOS, que contém o caminho

inada STRINGCONEXAO, que contém o a stringde conexão com o banco de dados;

6.

Não e texto do DOS ou semelhante”.

Vam o objetivo de listar os cursos disponíveis na loja

os será realizado por meio do ActiveX Data Objects, e para que osultado seja positivo, é necessário que você tenha instalado no equipamento a DLL

básica é:

nome do objeto que iremos criar, e o apresentador é o tipo de objetoDO que será criado, que podem ser:

Connection;

Field;

Application(“StringConexao”)=”DBQ=”&Application(“BancodeDados”)&”;Driver={Microsoft Access Driver(*.mdb)}”Application.UnlockEnd Sub


12/35

• Parameter;• Property• Recordset.

ueremos a principio conectar o site ao banco de dados, neste caso, iremos

a to connection. Este tem um método chamado “open”, para efetuar a conexão er co de dados para uso na aplicação. Sua sintaxe é:

_connection.Open StringConexão

m seguida, para se conectar a uma determinada tabela do banco de dados, temos o objeto

nnection

completa do arquivo

ISTACURSOS.ASP, que foi invocado dentro da página INDEX.HTM quando o usuário

%

>

/head> body>

lign= "center" >

t cursos=Server.CreateObject("ADODB.Recordset")pen "Select * from cursos where curso like

r by curso",conexao

le not cursos eof%>

fields("curso")%>

vel")%> fields("valor"))%>

No nosso caso, q

us r o objeab ir o ban Nome_objeto ERECORDSET, que tem como sintaxe:

Nome_objeto_recordset.Open nome_tabela, nome_objeto_co Com base no que vimos até o momento, veja a seguir a listagem

Lsolicita a busca de um determinado curso:

<Set conexao=server.createobject("ADODB.Connection")Conexao.Open Application("StringConexao")%

Listagem de cursos <<

CURSOS DISPONÍVEIS


13/35

Neste mód

o deulo iremos criar a página de carrinho de compras, para que o usuário ao escolhersua preferência, será levado a uma página onde efetuaremos o primeiro passo

vendas.

vamos primeiramente alterar a página criada na aula anterior, que tinha o objetivolistar os cursos encontrados através da busca efetuada pelo aluno.

ingConexao")

html>

/head> y>

a/loja1_1.jpg" width= "580"

lign= "center" >CURSOS DISPONÍVEIS

gn= "justify" >

os=Server.CreateObject("ADODB.Recordset")here curso like

st("Palavra_chave")"%'order by curso",conexao

cellpadding= "0" cellspacing= "1" width= "100%" >

Descrição

)%> Valor

observa o arquivo de listagem de cursos da mesma forma em que omódulo anterior. A nossa alteração será a de criar um link, com o

curso selecionado, que tem o objetivo de levar o aluno a página deho de compras, e ao lado deste link, iremos incluir um botão que terá a

ra que fique bem claro ao usuário a intenção do link.

ão isolar a linha que exibe o(s) curso(s) encontrado(s):

d width= "32%" >Curso

o curs para o fechamento das

Para isso,de


14/35

Curso

Na linha acima, criamos um link para a página carrinho.asp e iremc

Vamos primeiramente montar a estrutura da página que terá o objetivo de listar o(s)c No FrontPage, monte a seguinte estrutura:

Na página criada no FrontPage, conforme vimos acima, clique com o botão direito domouse sobre a parte livre constante do formulário, e no menu suspenso que é apresentado,selecione a opção PROPRIEDADES DO FORMULÁRIO. Será então apresentada aseguinte janela:

14/35


15/35

Na verdade, estava marcada a opção ENVIAR PARA, e você deverá marcar a opçãoENVIAR PARA OUTRO. Após esta configuração, clique no botão OPÇÕES e altere asconfigurações de opções para o manipulador de formulários conforme mostra a figura aseguir:

eja a seguir o código completo desta página até o momento:

html>

n="justify" > lpadding= "0" cellspacing= "1" width= "100%" >

Curso(s)

V < Carrinho de compras

ig


16/35

lpadding= "0" cellspacing= "1" width= "100%" >

width= "25%" >Curso

td>

width= "25%" >

width= "25%" >

="left" >Caso queira alterar a quantidade de licenças de umcar sobre

ubmit" value= "Alterar" name= "B1" >

"center" > r.class" codebase= "fpweb:///." width= "140" height= "24" >

F" >

ndo" >

lue= "index.htm" >

de= "fphover.class" codebase= "fpweb:///." width= "140" height= "24" >

F" >

>

lue= "Frete.asp" >

>

osso próximo passo é a inclusão do código necessário para concretizar a venda dos


17/35

Quando um Cookie é enviado a uma máquina cliente, ele possui os seguintes parâmetros:

Name : indica o nome do cookie (arquivo) armazenado no lado do cliente

e deverá ser gerado somente se

e o Cookie é um arquivo, automaticamente ele armazena valores. Diferente de uma tabela

o ASP, o objeto Request possui um conjunto próprio para tratar de cookies, denominado

amos verificar então a forma de se criar um cookie na máquina do cliente:

esponse.cookies(nome)(chave_”opcional”)=valor

eja o exemplo a seguir:

esponse.cookies(“site”)(“url”)=”www.aprendaemcasa.com.br”asa.com.br

Expires : indica a data em que o mesmo perde a validadeDomain : indica o nome do domínio que originou o cookie

Path : indica o caminho onde o cookie será armazenadoSecure : caso exista, este parâmetro informa que o cookio procedimento estiver sendo realizado em um ambiente seguro.

Squalquer, que separa as informações em campos (colunas), os cookies separam asinformações através de chaves, como por exemplo, uma chave para armazenar o dia donascimento e uma chave para armazenar o mês do nascimento, ou ainda duas uma chave para armazenar a razão social e outra o nome fantasia de uma determinada empresa.

Ncookies que representa as informações de um cookie enviado do browser cliente para amáquina servidora. Já no Objeto Response, o conjunto de cookies representam asinformações enviadas do servidor para a máquina cliente.

V R V R Response.cookies(“site”)(“email”)=aprendaemcasa@aprendaemc

bserve que temos um cookie que será enviado à máquina do cliente denominado “SITE” e

para recuperar os dados do cookie enviado pela máquina servidora, utilize a seguinte

ariável = Request.cookies(nome)(chave_”opcional”)

xemplo:

ndereco = Request.cookies(“site”)(“url”)

amos então efetuar as alterações necessárias em nossa página de carrinho de compras para

Oque possui duas chaves:url / email , contendo respectivamente os valores :www.aprendaemcasa.com.br / [email protected]

Jásintaxe:

V E EEmail = Request.cookies(“site”)(“email”)

Vque possamos trabalhar com os dados exibidos/solicitados na mesma.

17/35


18/35

O primeiro passo é criar a conexão com o banco de dados, além de criar uma variável dotipo Recordset, para que possamos manipular os registros sobre a forma de seleção, paraisso, iremos incluir o seguinte código:


19/35

Agora vem uma nova situação, ou seja, a variável numeropedidock está com o seuconteúdo nulo, desta forma, temos que criar uma variável de sessão para identificar a vendado curso, observe o código que tem esta função:

If numpedidock=”” thenVenda.open(“Select max(codigovenda) as ultimocodigo from vendas”), conexao

If not venda.eof thenSession(“codigodestavenda”)=venda.fields(“ultimocodigo”)+1

ElseSession(“codigodestavenda”)=1

EndifConexao.execute(“insert into vendas (codigovenda) values (“&session(“codigodestavenda”)&”)”) Response.cookies(“CursoAprendaemCasa”)(“codpedido”)=Session(“codigodestavenda”)Response.cookies(“CursoAprendaemCasa”).Expires=now+2End if%>

Estes códigos deverão ser inseridos no inicio do Script da página carrinho.asp, antes daabertura da TAG .O próximo passo é inserir os livros comprados na tabela itensdeumavenda, após a aberturade um novo registro na tabela vendas. Este código, deverá ser incluso após a criação da primeira linha da tabela. Observe o código a seguir:


20/35

conteúdo no conjunto Form no seu objeto request. Para tal função, insira a seguintecodificação abaixo do código anterior:

If request.form”” thenConexao.execute(“delete * from Itensvenda where

codigovenda=”&session(“Codigodestavenda”))For each field_name in request.formIf field_name”B1” and Request.form(field_name)”0” thenConexao.execute(“Insert into ItensVenda (codigovenda,codigocurso,quantidade) values(“&session(“codigodestavenda”) &”,”&field_name&”,”&request.form(field_name)&”)”)End if NextEnd if

O próximo passo é a criação do código que irá mostrar a tabela contendo os cursosselecionados. Nesta situação, após o código exibido acima, insira o seguinte código:

Subtotal=0Set cursos=server.createobject(“ADODB.Recordset”)ItemVenda.open “Select * from itensvenda wherecodigovenda=”&session(“codigodestavenda”),conexaoIf not itemvenda.eof then

Itemvenda.movefirstDo while not itemvenda.eof

%>

Agora, insira no código HTML já existente, para que se encaixe dentro das células queserão apresentadas entre o cabeçalho e o subtotal, para isso, mostramos a seguir o códigocompleto da página carrinho.asp:


21/35

Session(“codigodestavenda”)=1EndifConexao.execute(“insert into vendas (codigovenda) values (“&session(“codigodestavenda”)&”)”)Response.cookies(“CursoAprendaemCasa”)(“codpedido”)=Session(“codigodestavenda”)Response.cookies(“CursoAprendaemCasa”).Expires=now+2End if%>

Carrinho de compras

Carrinho de compras - Curso(s)selecionado(s)

Curso Valor Quantidade Total


22/35

cursos.closeitemvenda.movenextloopsession("subtotal")=subtotalconexao.execute "UPDATE vendas set valorvenda=CDBL('"&formatnumber(subtotal)&"') Wherecodigovenda="&session("codigodestavenda")%>

SubTotal

Caso queira alterar a quantidade de licenças de umdeterminado curso, basta alterar o campo quantidade e em seguida clicar sobreo botão ALTERAR, porém, caso queira excluir do carrinho o curso selecionado, basta alterar o valor do campo QUANTIDADE para "zero" e em seguidaclicar no botão ALTERAR.

22/35


23/35

A partir deste ponto iremos criar a página que tem o objetivo de apresentar valores do fretee também selecionar a forma de pagamento da compra. A página terá o nome FRETE.ASP, pois no módulo anterior, este foi o arquivo que será carregado quando o usuário confirmar a

sua compra. Outro fator importante neste página é que nela, o usuário irá entrar com seusdados pessoais para a finalização da compra, ou seja, nome, CPF, etc... O caso do frete éque estamos considerando cursos via CD-ROM, oferecidos pela empresa.

Para construir a página inicial, iremos utilizar o FrontPage, execute o mesmo e monte a página de acordo com o código HTML a seguir:


Projeto Aprenda em Casa - Rotina de confirmação devenda/calculode frete.

Prezado cliente, informe o estado para onde o CD com o(s)curso(s) adquiridos será remetido:

Para este estado, o valor a ser cobrado de frete é:

Valor do Frete Valor total da compra

Qual a forma de pagamento que prefere utilizar:

Cartão deCrédito Boletobancário

Nome Completo....................................................

CPF

......................................................................

23/35


24/35

E-mail

...................................................................

Endereço..............................................................

Cidade.................................................................

Estado.................................................................

CEP

....................................................................

Fone para contato...............................................

Caso comprador for pessojurídica:

Empresa

..............................................................

CGC

...................................................................

Neste módulo, iremos utilizar um novo conceito denominado “Arquivo de função”, ou seja,um arquivo, que contém um determinado código que poderá ser útil em diversas páginas,assim, não precisaremos repetir o seu código diversas vezes, bastando para isso, apenasdeclarar o arquivo que será utilizado na página.

24/35


25/35

Este arquivo terá a finalidade de testar se é ou não término de sessão, para que não sejarealizada uma venda de forma irregular. Vamos chamar este arquivo de UTILITARIO.ASP.A seguir veja o seu código:

Pedido inválido. Reinicie sua compra

Agora, na página frete.asp, através da diretiva include, iremos incluir o arquivoutilitarios.asp, sendo que tal procedimento deverá ser a primeira linha da página:

O próximo passo será justamente verificar se a sessão ainda está ativa, ou seja, se a venda éválida ou não, e iremos utilizar o arquivo utilitarios.asp, que foi gerado anteriormente e jáincluso na página:

Nesta página iremos utilizar também rotinas em JavaScript, pois alguns dados não poderãodeixar de serem preenchidos, como por exemplo o endereço, pois como iremos enviar omaterial caso não tenhamos o endereço do cliente? Teremos também que testar se o CPF ouo CGC de um comprador são válidos, caso contrário, como iremos emitir de forma segura para a empresa o boleto? Os alunos que participam do curso Aplicações e Banco de dados para Web, criaram uma rotina parecida no módulo Introdução ao JavaScript.e esta função

25/35


26/35

deverá estar no inicio do corpo da página, antes da tag . A seguir exibimos alistagem completa deste conjunto de funções, já encaixada dentro do código:


if (document.form1.nome.value.lenght==0) {alert ("É obrigatório o preenchimento do campo NOME");document.form1.nome.focus();return false;

}if (document.form1.endereco.value.lenght==0) {

alert("É obrigatório o preenchimento do campo ENDERECO");document.form1.endereco.focus();return false;

}if (document.form1.cidade.value.lenght==0) {

alert("É obrigatório o preenchimento do campo CIDADE");document.form1.cidade.focus();return false;

}if (document.form1.estado.value.lenght==0) {

alert("É obrigatório o preenchimento do campo ESTADO");document.form1.estado.focus();return false;

}if (document.form1.empresa.value.lenght!=0) {s=limpa_string(document.form1.cgc.value);if (valida_cgc(document.form1.cgc.value)==false) {

alert("CGC inválido");document.form1.cgc.focus();return false;}

}if (document.form1.empresa.value.lenght==0) {

s=limpa_string(document.form1.cpf.value);if (valida_cpf(document.form1.cpf.value)==false) {alert("CPF inválido");document.form1.cpf.focus();return false;}

}return true;}function limpa_string(s) {

var digitos="0123456789";var temp="";var digito="";for (var i=0; i=0) {

temp=temp+digito}}return temp

}function valida_cpf(s){

var i;

26/35


27/35

s=limpa_string(s);var c=s.substr(0,9);var dv=s.substr(9,2);var d1=0;for (i=0; i9) d1=0;if (dv.charat(0) != d1){

return.false;}d1 *= 2;for (i=0; i9) d1=0;if (dv.charat(1)!=d1){

return false;}return true;}

Function valida_CGC(s){

var i;s=limpa_string(s);var c=s.substr(0,12);var dv=s.substr(12,2);var d1=0;for (i=0; i9) d1=0;if (dv.charat(o)!=d1){

return false;}d1 *= 2;for (i=0; i9) d1=0;if (dv.charat(1)!=d1){

return false;}return true;

}//->

27/35


28/35

O próximo passo é preencher a caixa de listagem de nossa página com a lista dos estados possíveis para a remessa do material. Abaixo, exibimos o código que terá esta função, e omesmo deverá estar dentro do form que tem a caixa de seleção, veja abaixo parte do códigoque foi modificada:

Após o fechamento do FORM, vamos testar se o usuário já selecionou o estado doFRETE, para que possamos dar continuidade ao processo de compra, assim, após ofechamento do FORM da seleção do estado, vamos entrar com a seguinte sequência decomandos:


29/35

Qual a forma de pagamento que prefere utilizar:

e finalmente temos que finalizar o IF, antes do fechamento desta página:

29/35


30/35

A partir deste ponto iremos trabalhar com a página fechavenda.asp, que tem o objetivo de proporcionar ao cliente do site escolher a forma de pagamento, ou seja, via boleto bancárioou cartão de crédito.

Abaixo, o código HTML da página: Selecionando a forma de pagamento

Selecionando a forma de pagamento

Via boleto bancário:

Clique no botão abaixo para realizar aimpressão do boleto bancário. Após o pagamento do mesmo, envie umfax/e-mail para [email protected] ,com a sua via do comprovante de pagamento. Caso não exista o pagamento até adata do vencimento, ignorar o boleto e solicitar um novo.

Via cartão de crédito:

Nome do cartão AmericanExpress Mastercard

Seu nome como aparece nocartão

Número do cartão

Validade do cartão

30/35


31/35


32/35

Nome do cartão AmericanExpress Mastercard

Seu nome como aparece nocartão

Número do cartão

Validade do cartão

Agora, teremos que criar um link para que o usuário possa ser levado à página que terá afunção de imprimir o boleto., este link poderá ser criado em qualquer parte do local ondeserão exibidos as informações sobre o mesmo, sendo que nesta, teremos que levar algumasinformações da página, conforme vimos a seguir:

Clique no botão abaixo para realizar a

impressão do boleto bancário. Após o pagamento do mesmo, envie umfax/e-mail para [email protected] ,

32/35


33/35

O primeiro passo é a construção da página boleto.asp. Esta página possui um particular, queé justamente o componente que será utilizado para a criação do boleto bancário de formaon-line.

Atualmente, existem uma série de empresas que fornecem tais componentes com boletos

pré-construídos. Entre vários sites que fornecem estes, podemos destacar:www.thisf.com.br www.asw.com.br www.bradesco.com.br ( para clientes da carteira eletrônica Bradesco )www.itau.com.br ( para clientes da carteira eletrônica Bradesco ).

Após selecionar aquele que melhor se adapta as suas necessidades, você deverá levar para odiretório que armazena a sua aplicação os arquivos DLL, BMP, EXE que o compõe, eestudar o manual de instalação/operação do mesmo, pois a página boleto.asp só terá afunção de passar os dados recuperados da página anterior para o boleto, e este componenteserá responsável pelas funções de visualização/impressão.

Em todos os sites citados acima, você terá as instruções necessárias para incluir os dadosque podemos chamar de fixos no boleto, ou seja, a conta do destinatário, o número dacarteira de cobrança e o banco dos mesmos, titular da conta, etc...

Após esta configuração, basta construir a página boleto.asp conforme mostramos a seguir:

Imprime boleto


34/35


35/35

if (not mailer is nothing) thenmailer.from="[email protected]"mailer.to=fvendas("email")mailer.subject="Inscricao nos cursos do Projeto Aprenda em Casa"mailer.body=emailset mailer=nothing

end if%> Confirmação de compra de cursos do Projeto Aprenda em Casa

Confirmação de compra de cursos do Projeto Aprenda em Casa

Obrigado, você é mais um aluno do Projeto Aprenda em Casa.Estamos enviando ao seu endereço eletrônico, um e-mail confirmando suaaquisição. Em breve seu curso terá inicio.

Observe que neste exemplo, não conferimos por exemplo se o CPF do cliente é válido ounão, bem como se o número do cartão de crédito fornecido é válido ou não.

Para isso, teríamos que criar novas funções no arquivo utilitarios.asp e, tais funções, sãofornecidas atualmente pelos bancos, administradoras de cartões, etc...

módulo loja virtual - 001

Documents