Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

wneo

Aplicação web offline php+html5

Recommended Posts

Olá!

Pessoal, preciso urgente aprender a fazer uma aplicação web offline com php e html 5. Gostaria basicamente de um exemplo, onde nessa aplicação seja possível navegar offline e inserir dados em uma pasta local do pc, e quando eu conectar ter a possibilidade de alimentar uma base de dados remota com esses mesmos dados.

 

Então imaginem a seguinte estrutura:

 

1 - index.php : Aqui a tela inicial da aplicação contendo um form com um input text e um button submit.

2 - cadastrar.php :Quando eu escrever no input do index e pressionar o submit, Os dados serão enviados para o esse arquivo, que será responsável pelo post das informações e armazenamento local.

3 - O insert desses dados tem que ser direcionado a uma pasta local da máquina, e quando eu estiver conectado, preciso ter a possibilidade de atualizar a base de dados com essas mesmas informações.

 

Alguém consegue me mostrar como fazer isso??? por favoooor...

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

a ideia geral não é nada diferente de um sistema web como outro qualquer

Não mudará nada.

 

Você pode salvar esses dados em um banco de dados SQLite, por exemplo.

 

Crie uma rotina agendada (cron) que verifique se existe conexão à internet. Se houver, envie os dados do SQLite para o BD remoto

 

Para verificar se há conexão, um simples ping (ou file_get_contents()) em google.com já resolve.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Beleza..criei um index.php:

<!DOCTYPE html>
<html manifest="/<strong>offline</strong>.manifest">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Offline app</title>

<link rel="stylesheet" type="text/css" href="css/global.css"/>
<link rel="stylesheet" type="text/css" href="css/medias.css"/>

</head>

<body>
olá
</body>

</html>

um .htaccess:

AddType text/cache-manifest .manifest

e um offline.manifest:

CACHE MANIFEST
#This is a comment
CACHE
index.php
global.css
medias.css

Será que com isso já consigo navegar offline?

 

Agora preciso saber como usar o sqlite.....

Compartilhar este post


Link para o post
Compartilhar em outros sites

Um server (XAMPP/WAMP) não supre sua necessidade?

Possivelmente sim..

Mas como posso fazer para que o arquivo com dados de tabela, armazenado na base local, seja lido com php pelo nevegador e depois poder criar um novo arquivo (ou atualizar o mesmo) nesse mesmo diretorio?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma rotina agendada (cron) que verifique se existe conexão à internet. Se houver, envie os dados do SQLite para o BD remoto

 

Para verificar se há conexão, um simples ping (ou file_get_contents()) em google.com já resolve.

 

Pra atualizar os dados após existir conexão, basta seguir o que o Beraldo disse...

 

Mas deve tomar cuidado com o propósito do seu sistema, pois se outros tiverem acessos e poderes de alterar/editar/excluir dados, isso pode gerar inconsistências xD

Compartilhar este post


Link para o post
Compartilhar em outros sites

Agora eu fiquei na dúvida...

 

Você está complicando algo simples

ou

Você não explicou exatamente o que quer fazer

 

 

1. Você quer fazer um sistema que rode via Internet, mas que dispense a conexão (a conexão seria necessária só no primeiro acesso)?

Nesse caso seria melhor pensar em LocalStorage (do HTML 5) em vez de SQLite

 

Ou

 

2. Você terá uma instância da aplicação em cada cliente? Nesse caso, seria como ter o PHP rodando em cada máquina.
Aí é só usar a ideia que eu citei no começo

Compartilhar este post


Link para o post
Compartilhar em outros sites

Quero uma aplicação online, que continue navegando caso caia conexão e que nesse momento os dados seja armazenados localmente para que seja possivel atualiza-los na base remota quando houver conexão novamente.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Tipo pelo o que eu entendi vc quer.

 

Que exista o seu sistema na NET para acessar de fora, e caso caia a internet do cliente ele acesse o sistema na própria dele e quando a net voltar ele volta a acessar na NET... é isso né????

 

 

para vc fazer isso vc deverá ter 2 servidores, uma na WEB e outro na rede local do cliente, só que uma aplicação dessa é meio chato vc controlar as informações, pois vc vai ter que ficar toda hora os dois bancos para ter esses dados atualizados, e para que funcione sem que o cliente veja que caiu a net vc terá que fazer ele sempre acessar o sistema pelo servidor local, e no sistema ele verifica se caiu ou não a net, se não caiu ele se conecta ao banco na web senão no banco local.

 

Ai eu pergunto, a net do seu cliente cai direto? Vale a pena fazer esse esforço?

 

Que fazer isso vc tem que tomar muito cuidado com relacionamentos dos dados, pois imagina duas situações...

 

Digamos que seja uma empresa de vendas de produtos, caiu a net na FILIAL 1 mas na FILIAL 2 não, dai a FILIAL 1 irá acessar local, e ao fazer uma Nota Fiscal ele vai dar um ID para essa nota e relacionar os pedidos com akela ID, e na FILIAL 2 que está tudo ok tb irá gerar uma Nota Fiscal com seus pedidos, isso pode acontecer dos dois criarem a mesma ID e pode fazer uma bagunça com suas informações... Isso é um exemplo simples.. imagina que dai vc faça um cadastro de cliente novo e a nota vai relacionar com esse cliente tb e por ai vai... Cada vez mais vai complicando

Compartilhar este post


Link para o post
Compartilhar em outros sites

Se a aplicação for em PHP, aí vai precisar de servidor local, como o wolfphw citou.

 

Pra evitar isso, pode programar tudo em Javascript, usando LocalStorage. Quando houver conexão, faça as requisições remotas para sincronizar o localStorage com o DB remoto

 

Com AngularJS é simples fazer tudo isso. O sistema de rotas dele gerencia as URLs de forma bem tranquila

Compartilhar este post


Link para o post
Compartilhar em outros sites

O objetivo da aplicação é poder acessar tanto online quanto offline, podendo persistir os mesmos dados de banco. Penso em duas possibilidades: Manter o mesmo endereço de acesso estando on ou offline e podendo continuar navegando e armazenando dados localmente para posterior sincronização online, ou, no momento em que identifica a ausência de conexão, ser direcionado a uma aplicação voltada para o uso offline, apresentando algumas diferenciações da online... sendo assim, tenho essas duas idéias em mente, e gostaria de entender como ficaria melhor de se fazer tanto uma quanto a outra..

Compartilhar este post


Link para o post
Compartilhar em outros sites

Redirecionar para outro local só será possível se houver uma aplicação local rodando. E esse redirecionamento deveria ser feito no próprio Javascript, já que não haveria conexão para fazer uma requisição ao servidor remoto.

 

 

Se quiser ter todo o conteúdo do banco remoto na aplicação offline, você terá de salvar tudo (ou o principal) no localStorage do usuário.

Já deu uma olhada no localStorage, como sugeri?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Redirecionar para outro local só será possível se houver uma aplicação local rodando. E esse redirecionamento deveria ser feito no próprio Javascript, já que não haveria conexão para fazer uma requisição ao servidor remoto.

 

 

Se quiser ter todo o conteúdo do banco remoto na aplicação offline, você terá de salvar tudo (ou o principal) no localStorage do usuário.

Já deu uma olhada no localStorage, como sugeri?

Estou considerando a possibilidade do localStorage ou Sqlite... o localstorage com html5 me parece bem interessante, confesso que ainda não consegui parar e entender por onde começar a utilização.

E o redirecionamento com o offline.manifest me parece uma possibilidade, não?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Esquece o SQLite. Eu citei no começo pensando que seria uma aplicação PHP 100% local.

Se é algo pra rodar no navegador, tem que ser com Javascript. E o JS não trabalha com SQLite. Tem que ser com localStorage mesmo.

E a bos notícia é que é muito mais simples usar localStorage do que SQLite.

Olha aí http://www.w3schools.com/html/html5_webstorage.asp

 

 

Sobre o manifest, já não posso dizer muita coisa. Nunca mexi com isso. Mas achei este artigo da Moziila.

Talvez você já tenha visto, mas segue o link: https://developer.mozilla.org/pt-BR/docs/Web/HTML/Using_the_application_cache

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por juliosonic
      Boa noite..
      Estou desenvolvendo um site de https://www.maithunatantra.com.br/ e estou com um duvida sobre o menu de navegação da versão mobile.
      O menu que tem o dropdown "Terapeutas" e "Terapias" quando clico em cima ele expande como deve ser, mas quando clico denovo para recolher os submenus
      nao acontece nada.. segue o trecho do codigo do menu..
      <div class="collapse navbar-collapse" id="navbarsExample09">             <ul class="navbar-nav ml-auto">               <li class="nav-item  active"><a class="nav-link" href="index.html">Home</a></li>               <li class="nav-item  active"><a class="nav-link" href="about-us.html">Quem Somos</a></li>               <li class="nav-item dropdown1">                     <a class="nav-link dropdown-toggle" data-toggle="dropdown1" href="#">Terapeutas</a>                     <ul class="dropdown-menu">                         <li><a class="dropdown-item" href="terapeuta-julio-cezar.html">Julio Cezar</a></li>                         <li><a class="dropdown-item" href="terapeuta-pamela-priscila.html">Pamela Priscila</a></li>                     </ul>                                    </li>               <li class="nav-item dropdown">                     <a class="nav-link dropdown-toggle" data-toggle="dropdown1" href="#">Terapias</a>                     <ul class="dropdown-menu" aria-labelledby="dropdown01">                         <li><a class="dropdown-item" href="o-que-e-reiki.html">O que é Reiki</a></li>                         <li><a class="dropdown-item" href="beneficios-reiki.html">Benefícios do Reiki</a></li>                         <li><a class="dropdown-item" href="principios-reiki.html">Princípios do Reiki</a></li>                         <li><a class="dropdown-item" href="animais-reiki.html">Reiki em Animais</a></li>                         <li><a class="dropdown-item" href="animais-reiki.html">Estudos Sobre Reiki</a></li>                         <li><a class="dropdown-item" href="terapia-massagem-tantrica.html">Terapia Tântrica</a></li>                     </ul>               </li>               <li class="nav-item  active"><a class="nav-link" href="blog.html">Blog</a></li>                <li class="nav-item"><a class="nav-link" href="contato.html">Contato</a></li>             </ul>         </div>  
      Massagem Tantrica em Curitiba
      Tantra Curitiba
      Massagem Tântrica
      Tantra
      Julio Darshan

      Obrigado
      Att
      Julio Cezar
       
       
       
    • Por Felipe Medeiros
      Bom, criei um tema filho e o que aprendi é que para alterar qualquer coisa do tema filho eu preciso copiar o arquivo do tema pai o colocar dentro da pasta do tema filho.
       
      No meu caso, estou usando o tema "Astra" bem famosinho. O arquivo css que quero modificar não está dentro da pasta do tema pai, está em "wp-content/uploads/uag-plugin/assets/0/uag-css-10.css" sendo que o diretorio do tema pai é "wp-content/themes/Astra"
       
      O problema é o seguinte, preciso modificar a barra de pesquisa da pagina inicial, porem o inspetor de elementos do chrome ta acusando que esse arquivo é o responsavel por estilizar a barra de pesquisa. Será que isso tem a ver com "Cache de objetos", eu sei que o plugin liteSpeed Cache, AMP, Rank Math, todos eles tem essas paradas de criar arquivos css e js para tornar o site mais rapido.
    • Por Michael Silva Dev
      Estou implementando testes e2e com cypress em um projeto web com react, para realizar criação de contas eu preciso de cpf e cnpj válidos e ai que ta o problema, cada vez que um cpf é usado ele é invalidado então minha idéia era gerar eles a cada execução.
      Eu conheço vários sites que fazem isso como esse gerador de cpf e o gerador de cnpj, mas via código alguem conhece uma lib js para fazer essa geração em tempo de execução?
       
    • Por Alessandro Bodão
      Fala galerinha, 
       
      Tenho um container com um título (h1) no cabeçalho do meu site, esse container ocupa metade da tela (50vw), e eu gostaria que esse título ocupasse toda a largura desse container, independente do seu tamanho ou do tamanho do monitor, de forma com que a palavra tenha exactamente o mesmo tamanho do container (vou anexar uma foto de exemplo). Já tentei todos os valores pra essa h1, como % e vw... mas nada parece fazer sentido.
       
       

    • Por FabianoSouza
      Gente, tenho as TRs da minha tabele já com os cantos arredondados (através das TDs first-child e last-child). Fiz dessa forma porque desconheço uma maneira de aplicar radius diretamente na TR.
       
      O problema é que ao colorir a TR com o over do CSS, perde-se a formatação do border radius das TDs e exibe a TR com os cantos quadrados.
       
      Preciso que os cantos fiquem arredondados mesmo ao passar o mouse sobre a TR.
       
      Como resolvo isso?
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.