Pagina HTML che salva il suo contenuto, sostituendo il file HTML stesso

Devo creare una pagina html che salvi automaticamente il suo contenuto.Pagina HTML che salva il suo contenuto, sostituendo il file HTML stesso

Questa pagina è solo un report delle attività di 4 giorni, che dovrebbe essere aggiornato da qualche utente.

Questa pagina verrà utilizzato solo per 3/4 giorni (Vai pagina di stato riassunto dal vivo, e questo dicono i tutti) .. Quindi non voglio perdere tempo con back-end, ma quello che voglio fare qualcosa come un trucco solo sul lato client, Javascript e HTML.

Quello che vorrei fare:

un utente l'accesso alla pagina, questa pagina è pubblicata sul nostro server interno, aggiornare lo stato del compito e salvare la pagina! Ho pensato di farlo in due modi:

Ogni volta che si preme il pulsante di salvarlo basta sostituire il vecchio contenuto HTML con quello nuovo (che sostituisce il file html stesso)
Salva il contenuto in un file del piano che verrà caricato ogni volta che la pagina viene utilizzata, questa seconda opzione ovviamente costa molto più lavoro ..

Qualche suggerimento? Intendevo, c'è qualcosa che mi aiuti a farlo in pochissimo tempo? Ho circa 2 giorni per finire questo :(

UPDATE: Ragazzi forse io non sono me stesso che spiega così bene, sto pensando così sbagliato se suppongo solo qualcosa di simile:

funzione Javascript che quando si fa clic sul pulsante di salvataggio, sostituire il vecchio file del server html con quello nuovo contenente la riga aggiornata ...

Facile facile facile ...! Sono uno sviluppatore di back-end ... non molta esperienza con bellissime pagine front-end in stile :)

UPDATE: Con la tua risposta sto dando per scontato che non ci sia alcun modo per farlo, senza una logica back-end, anche se leggera, ma non è possibile farlo solo con uno scripting lato client .. Ho già pensato a questo, ma speravo che ci fosse un qualche tipo di trucco che permetta di fare questo senza posizionare nulla sul lato server .. :(

fonte

2016-06-17 ivoruJavaBoy

Quello che vogliamo è un web app progressiva. Ecco una sorta di documentazione: https://developers.google.com/web/progressive-web-apps/ – Werner

Yhea sembra davvero interessante, ma mi piacerebbe mantenerlo semplice, basta usare javascript ... Volevo dire che dovrebbe non essere così difficile trovare una funzione javascript che salvi il contenuto della pagina html in un file html e salvalo nel filesystem ... – ivoruJavaBoy

Infine, poiché possiamo usare PHP abbiamo deciso di fare questo: lo mettiamo in un file chiamato "prova.php" e lo lanciamo. Questo file mostra il contenuto di 'file.html' e salva in 'salva.php' inviando i dati da salvare.

<?php include('file.html');?> 

some added string 
</div> 

<button onclick="save()">SAVE</button> 

<script> 


function save(){ 

var newData=document.getElementById("myText").innerHTML; 
$.post("salva.php", { data: newData}); 
} 
</script>

il file da salvare chiamato salva.php, ricevono la stringa e salvare in un file esistente denominato "file.html".

<?php 


$stringa=$_POST['data']; 

$ourFileName = "file.html"; 
$ourFileHandle = fopen($ourFileName, 'w') or die("can't open file"); 
fwrite($ourFileHandle,$stringa); 
fclose($ourFileHandle); 


?>

file.html è un file che contiene nulla all'inizio

fonte

2016-06-17 14:48:12 CiroRa

questa è la soluzione finale. Per favore accetta questo – CiroRa

aggiornerò la domanda con quella finale ... è basata sulla struttura di Ciro .... Devo dire grazie a questo ragazzo CiroRa, una delle persone più gentili che trovo nello stack-overflow !!! BELLO – ivoruJavaBoy

È possibile eseguire una richiesta di ajax a tempo ogni 2 minuti per chiedere nuovi contenuti e sostituirli in il tag <body>.

vi consiglio di utilizzare jQuery per questo come ti aiuta a farlo abbastanza facilmente: http://api.jquery.com/jquery.ajax/

fonte

2016-06-17 10:18:59

Posso anche usare semplicemente un pulsante di salvataggio, non devo gestire l'accesso simultaneo .. Posso trovare qualche campione da qualche parte? A proposito, adesso sto guardando il tuo suggerimento ... – ivoruJavaBoy

Se hai un esempio, lo puoi trovare facilmente sul web, sarò mooooolto felice :) – ivoruJavaBoy

È possibile utilizzare Web Storage per memorizzare i dati nella fine locale dell'utente. Ed è piuttosto facile e supportato dalla maggior parte dei browser moderni.

Esistono due "meccanismi" per l'utilizzo di Web Storage.

sessionStorage mantiene una zona separata di archiviazione per ogni dato origine che è disponibile per tutta la durata della sessione di pagina (a patto che il browser è aperto, tra cui pagina viene ricaricata e ripristina)

localStorage fa la stessa cosa , ma persiste anche quando il browser viene chiuso e riaperto.

Aggiornamento: - Se si desidera memorizzare i dati sul server, ma donot vuole perdere tempo con i server di database completo a tutti gli effetti, allora forse si potrebbe usare "SQLite". Fondamentalmente è appena scappa da un file.

fonte

2016-06-17 10:22:14

Mmmhh ... guardando la documentazione che mi permette di salva sul lato client, ma ho bisogno di salvare il contenuto sul server, supporta anche questo? – ivoruJavaBoy

Umm ... No, dalla domanda ho capito che non vuoi memorizzare i dati sul back-end, ma se vuoi farlo puoi usare 'SQLite'. –

<html> 
    <head> 
     <title>Button Writer</title> 
    </head> 

    <body onload="read()"> 
     <!--<button onclick="writeInFile()">Save</button> --> 
     <input type="button" id="somebutton" onclick="addText()"> 
     <input type="text" id="myText" placeholder="Enter Name Here"> 
     <div id="text2"></div> 
    </body> 


    //read a file and write content in text2 div, please set your path 
<script> 

function read(){ 
var xhr; 
if (window.XMLHttpRequest) { 
    xhr = new XMLHttpRequest(); 
} else if (window.ActiveXObject) { 
    xhr = new ActiveXObject("Microsoft.XMLHTTP"); 
} 

xhr.onreadystatechange = function(){document.getElementById("text2").innerHTML=xhr.responseText;}; 
xhr.open("GET","file.txt"); //SET YOUR PATH 
xhr.send(); 
} 

function addText() 
     { 
      document.getElementById('text2').innerHTML += document.getElementById('myText').value; 
     } 



</script> 
</html>

Per scrivere in un file è necessario utilizzare AJAX + PHP. Se vuoi ti dirò come

fonte

2016-06-17 11:34:10 CiroRa

Sì, grazie CiroRa! Ma il problema con PHP è che non ho alcun server in esecuzione sul lato server, è il server unix Jenkins quindi, sarà un disastro per distribuire un'applicazione, c'è qualche soluzione Lightwheight da assumere .. – ivoruJavaBoy

Node.js fornisce un molta funzione Cosa pensi di installare sul tuo server? https://nodejs.org/en/download/ – CiroRa

Ok aspetta, ho questo in esecuzione sul server: [build @ REMJenkinsServer01 ~] $ php --version PHP 5.3.3 (cli) (compilato il: 10 settembre 2014 05:27:26) Copyright (c) 1997-2010 Il gruppo PHP Zend Engine v2.3.0, Copyright (c) 1998-2010 Zend Technologies – ivoruJavaBoy

Pagina HTML che salva il suo contenuto, sostituendo il file HTML stesso

risposta

Problemi correlati