Skapa ENKEL hemsida med en räknare med ett minimum av js.

lillahuset · Inlägg av **lillahuset** » 2 oktober 2016, 19:33:44

Tack, det ser lovande ut. Jag har testat.

Imorgon ska jag se om jag kan koppla ihop det med lite C-kod. Jag tror du har rätt i att JS inte är speciellt svårt men jag har hört att det är väldigt förlåtande och att man därmed riskerar att klanta till det för sig. Mitt förra försök att skapa en webbsida som uppdaterade sig själv funkade inge bra.

E Kafeman · Inlägg av **E Kafeman** » 2 oktober 2016, 19:55:04

Det jag upplever som knepigast med java-script är att olika typer webbläsare har lite olika script-tolkare, med fördefinerade funktioner och variabler som inte är helt lika mellan t.ex. Firefox och IE.
Det gör att man kan behöva skriva flexibel javascript-kod som anpassar sej beroende på vilken webläsare som ska köra koden.
Bifogade exempel-koden är dock helt körbar i alla vanliga webläsare.
IE måste man ge tillåtelse att köra lokal javascript trots att den kan vara inställd på att glatt köra script från externa okända källor. Lite ologiskt enligt min åsikt.

lillahuset · Inlägg av **lillahuset** » 2 oktober 2016, 19:59:30

Min brorsa jobbar på en av de fyra storbankerna med intern och extern webb. Han är emellanåt ganska ledsen över hur illa webbläsarna följer standard.

Jag är tacksam för input men kommer möjligen att uppträda som obildad pajas igen.

Jan Almqvist · Inlägg av **Jan Almqvist** » 3 oktober 2016, 09:38:58

johano skrev: Men snyggast är att låta serversidan pusha data till klienten över websockets när det är tillgängligt så slipper man all "ful" pollning överhuvudtaget.

Rent generellt tycker jag att pollning har sina fördelar. Klienten märker snabbt om kommunikationen med servern upphör och kan visa detta på skärmen.

lillahuset · Inlägg av **lillahuset** » 4 oktober 2016, 16:52:40

Jaha, uppenbarligen är jag inte född till webbutvecklare.

Jag har nu fått CGI att fungera och kan köra ett script så här: http://192.168.0.101/cgi-bin/hello.cgi

Hur anropar jag scriptet från E Kafemans exempel? Eller har jag missat det mesta igen?

Jan Almqvist · Inlägg av **Jan Almqvist** » 4 oktober 2016, 18:41:28

Så här?

Kod: Markera allt

<html>
<head>
</head>
<body>
...
<!--#exec cgi="/cgi-bin/hello.cgi"-->
...
</body>
</html>

E Kafeman · Inlägg av **E Kafeman** » 4 oktober 2016, 18:53:49

Ja exec fungerar men exekvering av kod är ofta spärrat av säkerhets-skäl. Kontrollerar man själv både servern och webbläsarens säkerhets-inställningar så går det bra.
Sedan behöver man lite mer kod för att kunna uppdatera variabeln på kontrollerat sätt.

Finns många sätt att lösa anropet på men om man fortsätter bygga på det grovt enkla exemplet, att du endast vill plocka in en siffra i synliga sidkoden men som nu ska hämtas in externt så ett förslag:

Kod: Markera allt

Över javascriptdelen läggs till:
<script src="http://xxx/hello.cgi" type="text/javascript"></script>
//Denna filen ska innehålla de variabler man anropar externt.

Inom tidigare script läggs till:
//Variabel-buffrar med samma filnamn som deklarerad extern källa, src:
var hello_file_new="http://xxx/hello.cgi";
var hello_file_old="http://xxx/hello.cgi";

//Nedan funktion är ungefär som att skapa ett nytt "filehandle" för varje ny fil som anropas
function loadjs(filename)
{
var fileref=document.createElement('script');
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", filename);
return fileref;
}


//Funktion för att ladda in och ersätta innehållet i den externa filen kan se lite krånglig ut då den använder interna script-funktioner, och vi använder dynamiskt skapad fil-namn  men kopiera bara rakt av. 
function replace_var()
{
 var targetelement = "script";
 var targetattr = "src";
 var allsuspects=document.getElementsByTagName(targetelement);
    for (var i=allsuspects.length; i>=0; i--)
	{ 
  	if (allsuspects[i] && allsuspects[i].getAttribute(targetattr)!=null && allsuspects[i].getAttribute(targetattr).indexOf(hello_file_old)!=-1)
		{
     	         var newelement=loadjs(hello_file_new);
     	          allsuspects[i].parentNode.replaceChild(newelement, allsuspects[i]);
                hello_file_old=hello_file_new; //Uppdatera med nuvarande filnamn
     	        }
         }

}


//När du vill uppdatera variabeln anropas funktionen replace_var() via knapp-tryck eller automatisk via t.ex. en timer.

//En timer kan se ut så här:
function refresh()
{
hello_file_new=("http://xxx/hello.cgi?"+Math.floor(Math.random()*1000000));
replacej_var();
setTimeout(refresh, 1000); 
}

//Som synes så lägger jag till random siffror efter filnamnet. Detta eftersom att det inte ska bli någon risk att servern levererar cachat innehåll. Detta kallar jag dynamiskt skapat filnamn.

//Slutligen ska denna raden bort ur befintliga koden:

var ticknr = 0;

//Däremot ska det vara just den raden som är innehållet i din hello.cgi och som nu uppdateras vid varje anrop till replace_var(). För säkerhets skull brukar jag lägga till en extra vagnretur för och efter variablen.

Ser ut som mycket krångel för att uppdatera en enda siffra men externa innehållet kan vara bilder och text eller vad som.
Som för annan motsvarande kod kan man dekorera den med diverse fel-hantering, om man får timeout från servern t.ex.
Verkar det allt för avskräckande går det låta hello.cgi leverera hela sidinnehållet enligt det tidigare exemplet på sid-refresh.
Då blir sidadressen som visas i webbläsaren "http://xxx/hello.cgi" vilket alternativt kan ramas in i en befintlig sida, inom body-delen:

Kod: Markera allt

<div id="hello_ruta" style="
width: 145px; height: 151px;
position:absolute;
clip:rect(44px,145px,152px,5px);
z-index:12;
right:0px; top:0px;
>

<iframe src="http://xxx/hello.cgi"></iframe>

</div>

OBS att det finns tusentals andra sätt att göra på för att dynamiskt uppdatera delar av en webbsida. Jag är mycket amatör, har ingen absolut kunskap om ovan är det bästa sättet.
Det mesta är sådant jag hittat genom att tjuvkika på andras webbside-kod direkt i webbläsaren.
Exemplet ovan är inte provkört, är något förenklat i både kod och kommentarer om vad som utförs, men jag har använt mej av denna kod i snarlika sammanhang, så det ska ha förutsättningar att fungera.

lillahuset · Inlägg av **lillahuset** » 4 oktober 2016, 18:58:25

Jan Almqvist: Jag ändrade till det här och testade men det funkade inte:

Kod: Markera allt

<html>
<head>
</head>
<body>
<!--#exec cgi="/cgi-bin/hello.cgi"-->
</body>
</html>

Jag testade några andra ändringar också men det hjälpte inte...

Det verkar som om WWW är för svårt för mig.

lillahuset · Inlägg av **lillahuset** » 4 oktober 2016, 19:02:46

E Kafeman: Tack för input men det här kräver nog en del att smälta.
Egentligen skulle jag vilja ha något som bara kör det här CGI-scriptet (skrivet i C eller valfritt) en gång per sekund och inte gör något annat. Då känns det som om jag skulle kunna ha full koll. Inbillning?

E Kafeman · Inlägg av **E Kafeman** » 4 oktober 2016, 19:16:33

Det enklaste jag kan tänka mej är att din server skickar ut:

Kod: Markera allt

<html>

<script type="text/javascript">

function nysida() {
      self.location.href=location; //Ladda om denna sidan
    }
   
   </script>

<body onLoad="setTimeout(nysida, 1000);">

Här skriver du ditt egenskapade innehåll

</body>
</html>

Ange hello.cgi som adress i webläsaren så kommer ovan att laddas in och uppdatera 1 gång per sekund.

Jan Almqvist · Inlägg av **Jan Almqvist** » 4 oktober 2016, 19:27:10

lillahuset skrev: Jag testade några andra ändringar också men det hjälpte inte...

Har skriptet gjorts körbart? ( 'chmod' någonting men nu är jag ute på djupt vatten... )

html-filen måste kanske heta .shtml eller .shtm ?

lillahuset · Inlägg av **lillahuset** » 4 oktober 2016, 19:42:10

Här skriver du ditt egenskapade innehåll

Vad skriver jag för att anropa hello.cgi som ligger i /usr/lib/cgi.bin? Ja jag är troligen ganska trögtänkt.

lillahuset · Inlägg av **lillahuset** » 4 oktober 2016, 19:50:44

Jan Almqvist: Scriptet är körbart (vanligt misstag). Jag tror filen ska heta index.html.

Jan Almqvist · Inlägg av **Jan Almqvist** » 4 oktober 2016, 19:57:36

Prova med index.shtml

's' för Server Side Include där exec ingår.

lillahuset · Inlägg av **lillahuset** » 4 oktober 2016, 20:11:32

Nja, det bidde inte så bra...

Skapa ENKEL hemsida med en räknare med ett minimum av js.

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js

Re: Skapa ENKEL hemsida med en räknare med ett minimum av js