Oi pessoal estou começando a utilizar o HTML 5, porém não acho exemplos de como fazer ele acessar banco de dados remoto.
Eu sei que o HTML e JAVASCRIPT não acessam banco de dados, mas de qual maneira eu poderia estar acessando?
Arquitetura para HTML 5 acessar banco de dados remoto
G
5 Respostas
Não é boa prática expor um banco de dados para ser acessado diretamente por um cliente na internet. O correto é criar um web service que faça o acesso ao banco e fazer a aplicação HTML 5 consumir esse web service.
G
O uso de WebService me parece uma das melhores opções para ser usada pelo javascript.
Você teria algum exemplo com listagem de dados, insert, delete, alter and update?
Pois irei usar o localStorage para um armazenamento temporário e quando houver conexão disponível, irei consumir esse WebService.
Dá uma olhada nisso:
http://coding.smashingmagazine.com/2010/10/11/local-storage-and-how-to-use-it/
O ideal é você não expor seu banco, cria um wEB service, para fazer isso para você
Perdão se repeti alguém mas não li os POSTs
G
Então pessoal criei meu WebService bem simples… uma soma passando dois parâmetros.
<!DOCTYPE HTML>
<HTML lang="pt-br">
<HEAD>
<meta charset=utf-8>
<title>Pedidos</title>
</HEAD>
<BODY>
<article>
<header>
<h1>kobile</h1>
</header>
</article>
<br>
<form name="formSoma" method="get" action="">
<p><label> Valor 1: <input type=search placeholder="Digite o primeor valor" name="valor1" autofocus> </label></p>
<p><label> Valor 2: <input type=search placeholder="Digite o segundo valor" name="valor2" > </label></p>
<p> <input type=button value=Enviar onclick="CallWs();"></p>
</form>
<br>
</BODY>
<script type="text/javascript">
var ajax;
/**
* Criar o objeto ajax que vai fazer a requisição
*/
function CreateAjaxObject()
{
if(window.XMLHttpRequest)
{// Mozilla, Safari, Novos browsers...
ajax = new XMLHttpRequest();
}
else if(window.ActiveXObject)
{// IE antigo
ajax = new ActiveXObject("Msxml2.XMLHTTP");
if(!ajax)
{
ajax = new ActiveXObject("Microsoft.XMLHTTP");
}
}
if(!ajax)// iniciou com sucesso
alert("Seu navegador não possui suporte para esta aplicação!");
}
/*
* Envia os dados para a URL informada
*
* @param url Arquivo que irá receber os dados
* @param dados dados a serem enviados no formato querystring nome=valor&nome1=valor2
* @param AjaxResponseFunction variável to tipo function(string) para receber a resposta do ajax
*/
function SendData(url, dados, AjaxResponseFunction)
{
CreateAjaxObject();
if(ajax)
{
ajax.onreadystatechange = function trataResposta()
{
if(ajax.readyState == 4)
{
AjaxResponseFunction(ajax.status, ajax.responseText);
}
};
//definir o tipo de método
ajax.open("POST", url, true);
//definir o encode do conteúdo
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
//tamanho dos dados enviados
ajax.setRequestHeader('Content-length', dados.length);
//enviar os dados
ajax.send(dados);
}
}
/**
* Chama o webservice
*/
function CallWs()
{
/*
aqui passe os parâmetros do método.
no formato 'querystring'
ex:
nomeParam1=valor1&nomeParam2=valor2&nomeParamN=valorN
Muita atenção aqui, pois deve ser informado aqui os nomes dos parâmetros
que estão definidos no wsdl.
Uma boa olhada, com atenção ao wsdl irá te mostrar os parâmetros,tipos e os nomes dos métodos
disponíveis no método ou web service
*/
var dados = '';
dados += 'valor1=' + document.forms['formSoma']['valor1'].value;
dados += '&valor2=' + document.forms['formSoma']['valor2'].value;
//aqui o caminho completo do webservice seguido do nome do método
SendData("http://localhost:8080/axis/Servico.jws?method=soma", dados, AjaxResponseFunction);
}
/**
* tratar a resposta do servidor
* @param status status da resposta
* @response resposta do servidor
*/
function AjaxResponseFunction(status, response)
{
alert(''+response);
/*var divR = document.getElementById('divResponse');
if(ajax.status != 200)
divR.style.color = '#FF0000'; //vermelho
else
divR.style.color = '#0000FF';//azul
//escrever na div de resposta
divResponse.innerHTML = response;*/
}
</script>
</HTML>
Porém ele não consegue chegar nesse método que é o retorno.
Não existe problema no webservice.
function AjaxResponseFunction(status, response)
{
alert(''+response);
}
Criado 14 de agosto de 2013
Ultima resposta 16 de ago. de 2013
Respostas 5
Participantes 3