Viitaten aiempaan ketjuun tuosta HTML-värivalitsimesta, mistä keskustelu päättyny toistaiseksi, niin neosofta, jonka suosiollisella avustuksella sain ohjelman valmiiksi siten, että sovelluksen kotisivulle palaavan asiakkaan ei tarvitse määritellä uudestaan niitä arvoja, vaan sovellus "muistaa" -värivalinnat.
Neosofta kommentoi säikeen loppupuolella, että voisi olla seuraavan yhteistyön/projektin kohde tutkia, paljonko indexDB:hen saa Javasctipissä tupattua dataa.
Yhdessä tekemisessä on voimaa, joten olisiko jotain ideaa, jota voitaisiin alkaa kollektiivisesti pyörittelemään, minkätyyppistä ohjelmaa sitä JavaScript/HTML5/CSS3-laadittaisiin yhdessä, jotta tuo indexDB -olisi mukavasti siinä mukana.
Katselin hakukoneella avoimia JSON-dataa tarjoavia sovellusohjelmointirajapintojia, niin löysin nyt pari, joita voisin esittää pohjaksi tähän.
Vitsejä JSON-muodon ulostulona löytyy tästä API:sta.
Säätilaakin tarjotaan ilmaisen rajapinnan kautta JSON-muodossa ulos.
Tässä vielä linkki Mozilla Developer -resurssiin tuon indexedDB -dokumentaatioon.
En tiedä, olisiko mitään järkeä ohjelmoida verkkosovellus nettiselain - käyttöliittymällä, joka hakee aina tuon päivän vitsin tuolta jokes.one:sta, ja sitten tallentaa päivän vitsin indexedDB:hen, ja kun käyttäjä palaa sivulle lukemaan päivän vitsin, niin vitsihistoria tulostuisi tyyliin "Aiempien päivien vitsit" -otsikon alle, ja ne haettaisiin tuolta indexedDB:stä. Kuulostaa ainakin simppeliltä ja viihteellisemmältä ohjelmalta. Ohjelma sekin olisi.
Jere Sumell kirjoitti:
En tiedä, olisiko mitään järkeä ohjelmoida verkkosovellus nettiselain - käyttöliittymällä, joka hakee aina tuon päivän vitsin tuolta jokes.one:sta, ja sitten tallentaa päivän vitsin indexedDB:hen, ja kun käyttäjä palaa sivulle lukemaan päivän vitsin, niin vitsihistoria tulostuisi tyyliin "Aiempien päivien vitsit" -otsikon alle, ja ne haettaisiin tuolta indexedDB:stä. Kuulostaa ainakin simppeliltä ja viihteellisemmältä ohjelmalta. Ohjelma sekin olisi.
Vitsi verkkosovellus voisi olla ihan hauska ohjelmointiharjoitus! Taidanpa harjoituksena vääntää ihan työpöytäsovelluksen 8th:lla, mikä tallentaa nuo päivän vitsit LMDB KV tietokantaan käyttäen päivämäärää avaimena ja näyttää vitsit graafisessa ikkunassa. Voidaan sitten vertailla toteutustapoja...
Itsekin ajattelin, että tuota vitsi-apia voisi olla mielekästä hyödyntää, niin oppisi käyttämään tuota IndexedDB:tä.
Tänään olen selvin päin, eikä tässä illan päälle oikein muutakaan tekemistä ole, niin voisi pistää jotain runkoa avaukseksi tänne putkaan, ensin tietenkin edellyttäen, että luen tuota indexedDB:n dokumentaatiota ja tajuan, miten tuon olion kanssa toimitaan ihan käytännön tasolla.
Ohjelmointiprosessin kuluessa ei ehkä kannata testiaineistoksi valita tuota päivän vitsiä, vaan käsittääkseni tuolta saa eri genren vitsejä, niitä kannattaa hyödyntää testiaineistona, koska tällöin ei tarvitse odottaa seuraavaan päivään uuden vitsin julkaisua nähdäkseen, toimiiko koodi toivotulla tavalla.
Tässä nyt hyvin alkeellinen ja epäkunnossa, eli ei toimiva pohja, jossa nyt on nuo perusstepit tuon indexedDB:n käytöstä tuossa storage-metodissa, eli tietokannan avaaminen, kannan avaamisen virhetilanteiden funktio ja sitten jos avaaminen onnistuu, niin sitten tupataan tuolta päivän eläinvitsi JSON-datana tuonne "joke" -avainsanan alle, mutta nyt ongelmana on se, kun pitäisi varmaan for each -silmukassa hakea cursoreita käyttäen tuo koko json-data ja luoda "klooni"kopio tuosta json-datasta, jota tuo api antaa ulostulona, niin sitten voisi cursorilla liikkua ja tulostaa vain halutut tiedot.
function get_joke_of_the_day() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
// Access the result here
var latestJoke = this.responseText;
return latestJoke;
}
};
xhttp.open("GET", "https://api.jokes.one/jod?category=animal", true);
xhttp.setRequestHeader("Content-type", "application/json");
xhttp.setRequestHeader("X-JokesOne-Api-Secret", "YOUR API HERE");
xhttp.send();
storage();
}
function storage() {
var dbName="Jokebase";
var request = window.indexedDB.open(dbName, 3);
request.onerror = function(event) {
console.log("Why didn't you allow my web app to use IndexedDB?!");
};
request.onsuccess = function(event) {
db = event.target.result;
};
var objectStore = db.createObjectStore("joke", get_joke_of_the_day());
var transaction = db.transaction(["joke"], "readwrite");
var request = transaction.get("joke");
document.getElementById("latestJoke").innerHTML = request.value;
}Pistän nyt HTML-tiedostonkin tänne näkyviin, vaikka siinä nyt mitään ihmeellistä olekaan.
<!DOCTYPE html> <html> <head><title>Jokeboost - Makes you laugh daily!</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta charset="UTF-8"/> <script src="http://code.jquery.com/jquery-latest.min.js"></script> </head> <body id="demo"> <h1>Jokeboost</h1> <p>We offer new joke every day! Don't forget come back tomorrow for new joke!</p> <form> <input type="button" id="getJoke" value="Read joke" onclick="get_joke_of_the_day()"> </form> <p id="latestJoke"> <br> <p id="jokeHistory"> <br> <hr size="2"> <script src="jokeboost.js"></script> </body> </html>
Oma 8th:lla kirjoiteltu ohjelmani toimii siten, että minulla on oma säie käyttöliittymälle ja oma työsäie vitsien käsittelylle.
Ohjelman käynnistyessä työsäie yrittää hakea KV (Key/Value) tietokannasta kyseisen päivän avaimella vitsin. Jos kyseisellä avaimella ei ole tallennettuna vitsiä, haetaan vitsi nettipyynnöllä ja tallennetaan tietokantaan. Seuraavaksi vitsi välitetään käyttöliittymän säikeelle näytettäväksi. Tämän jälkeen työsäie jää nukkumaan ja herää taas vuorokauden vaihtuessa käsittelemään uuden vitsin.
Kiva, kun annoit sanallisen kuvauksen algoritmistäsi. Tuossa voisi olla järkeä, että se tarkistetaan ensin tuolta IndexedDB:stä, ja jos päivän vitsiä ei löydy sieltä, niin sitten vasta haetaan se, voi nopeuttaakin jonkin verran sovellusta, kun jos vitsi on jo valmiina, niin sitten ei tarvitse enää hakea.
Mulla siten tämän indexedDB:n osalta, etttä voisi ensin unohtaa tuon vitsin haun tuolta JokeOnesta, ja tehdä jokin hyvin yksinkertainen kanta, jossa toimisi aluksi tuo cursoreilla navigoini, ja sitten arvo-avain-parit olisi siinä versiossa jo for each -silmukassa luotu tuonne, niin sitten kun sen saa toimimaan, ei liene enää suurempaa ongelmaa modifioida koodia, että saa implementoitua tuon vitsin haun tuolta verkon yli.
Tämä indexedDB on minulle ja uusi asia, aivan kuten oli uo Storage-olion käyttö tuossa värivalitsimessa, niin tosiaan pitäisi aloittaa ihan yksinkertaisesta esimerkistä, missä välttämättä mitään järkeä olekaan, mutta lähtökohtana se eteenpäin kehittämiselle, että ohjelma toimii kuitenkin, kuten pitääkin.
Jere Sumell kirjoitti:
Mulla siten tämän indexedDB:n osalta, etttä voisi ensin unohtaa tuon vitsin haun tuolta JokeOnesta, ja tehdä jokin hyvin yksinkertainen kanta, jossa toimisi aluksi tuo cursoreilla navigoini, ja sitten arvo-avain-parit olisi siinä versiossa jo for each -silmukassa luotu tuonne...
Kursoria et käsittääkseni tarvitse muuhun kuin kantaan tallennettujen tietojen läpi käymiseen (ilman, että avain olisi tiedossa). Kannattaa varmaan yksinkertaisesti käyttää päivämäärää avaimena (tai päivien määrää vuodesta kun kärrynpyörä keksittiin) ja tallentaa aina tuo koko json-data.
Joo, meinasin kanssa, että pitää hakea koko JSON-data tuohon Jokebase -nimiseen kantaan, ja tuo on hyvä valinta voisi olla, mitä ehdotit, että päivämäärää käyttää avaimena, ja tallentaa vaikka sitten itse vitsin ja genren voisi tallentaa.
Näytti olevan kieli-avainkin tuossa datassa, en tiedä, kun en ole ottanut selvää, että onko tuolla JokesOnessa miten laajasti suomenkielisiä vitsejä kukaan lisännyt sinne, englanti nyt tulee defaulttina kielenä tuolla. Sama se melkein, vaikka vitsisovellus esittääkin englannin kielellä noita kaskuja ja vitsejä.
JavaScriptissähän saa tuon ajankohtaisen päivämäärän koodilla
const date = new Date();
ja sitten sen voi formatoida samaan muotoon sen ulostulon tuosta Date-funktion ilmentymäoliomuuttujasta stringiksi, jota voi sitten käyttää avaimena, että se täsmää tuohon JokesOnen tarjoamaan aika-avaimeen.
Luin Tutorialspointista IndexedDB:n tutoriaalisiun, ja copy-pastetin esimerkkikoodin tekstieditoriin ja tallensin sen .html -tiedostona, mutta jostain syystä Tutorialspointin sivulla ohjelmesimerkki toimii, mutta ei Firefoxissa paikallisesti kokeiltuna.
Luin jostain lähteestä, että turvallisuussyistä IndexedDB ei toimisi file:// -protokollan kautta, eli paikallisesti, mutta se artikkeli oli melko monta vuotta vanha, ja sitten kokeilin vielä paikallisella Apache-palveimella, localhostissa koodi ei toiminut.
Mikä tässä voisi olla vikana.
Tämän indexedDB masinoinnin tsekkaamisesta oli meikäläiselle se hyöty, että samalla selvisi myös miten ehkäistä kerralla pakkopullan syöttäminen eli vaikka joskus unohtuisikin vivuta joku täppä asentoon unchecked niin ei ala välittömästi vähintään joka toisella sivustolla vilkkumaa massiivinen määrä "minua kiinnostavaa" mainosskeidaa!
Tuollainen havainto, kun kahasin tänään materiaaleja läpi tuosta IndezedDB:stä, arvon yhteistyökumppani "neosofta", kun tiedustelit, että paljonko mahtaa dataa saada tupattua sinne, niin luin jostain, että määrä on rajaton, tai ainakin hyvin suuri, jos ei nyt rajaton, eli sinne mahtuu todella paljon dataa, ja se on korvannut vanhentuneen WebSQL:n, mitä päädyin lukemaan myös W3:n virallista lähdesivua. Tietenkin jotain rajoituksia käytännössä varmaan asettaa sitten tietokoneen välimuistin koko, tai mihin muistiin sitten paikallisesti koneelle tallenetaan tuota tietokannan dataa, joten ei se nyt ihan järjellä ajateltuna nyt loputtoman ääretön datamäärä ole, mitä sinne mahtuu.
Osaatko auttaa tuohon, miksi en saanut toimimaan paikallisesti tuota Tuotrialspoinin koodia suoraan leikepöydältä liitettyä tuota esimerkkiohjelmaa, että aluksi saisin jonkin toimintakuntoisen esimerkin nähtäville ihan käytännössä. Jossain keskustelupalstoilla netissä joku kertoi, että ei toimi file:// -protokollan kautta turvallisuussyistä, vaan vaatii palvelimella ajoa, mutta ei toiminut Apache-ympäristössäkään, kun palvelinprosessi oli ajossa ja päällä.
Uudemmissa foorumipostauksissa todettiin, että uudemmat selaimet tukevat jo tuota paikallisesti ajoakin.
Kato sillä selaimen tarkista elementti jutskalla mitä kaikkea ihme skeidaa ne iframet kätkee taakseen...
Itse löysin jostain välistä mm. 6RAQP-S44QZ-RE8AD-YSYWA-P84NW nimisen JavaScript tiedoston. Sen saa impattua ilman että lykkää perään .js päätettä. Vilkaisin sitä ja päätin ettei kuulu mulle ja pukkasin roskiin.
Joo, no iFramet muutoinkin ongelmallisia, niiden olemassaolo verkkosivustolla altistaa XSS-hyökkäyksille, Cross-Site-Scripting on se koko termi.
Löysin tällaisen hyvän esimerkin,
https://www.scriptol.com/javascript/indexedDB-JSON.php
Selvitin ja oikoluin ja ymmärsin tuon demo-ohjelman ladattuani sen ensin.
JSON.tiedoston lataus paikallisesti tuolla fetch() -funktiolla näköjään ei toimi Firefoxilla, mutta sain tuon demo-ohjelman esittämän hedelmäkauppiaan varaston tietokannan tulostumaan ja toimimaan, kun ajoin Apache -palvelimella localhostissa.
Tuossa fetch() -funktion käytössä Firefox -estää paikallisesti json.tiedoston lataamisen, en tiedä sitte, kun fetch(jokes.json); toimii vain http-https -protokollien kautta. Liekö tällä jotain tekemistä same origin -politiikan kanssa.
No kokeile paikallisena vaikka $.getJSON viritelmää
<!DOCTYPE html>
<html>
<head><title>JSON_TESTI</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8"/>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$.getJSON("https://api.jokes.one/jod?category=animal",function(result){
document.getElementById('log').innerHTML = JSON.stringify(result);
});
</script>
</head>
<body>
<div id="log"></div>
</body>
</html>Tuossa voisi olla tuossa jQueryn .getJSON() -metodin käytössä järkeä, että saa foreachillä tai tuolla jQuery.each() -tuonne indexedDB:hen tupattua sisällön koko json-tiedoston sellaisenaan, mutta merkkijonoistaminen ei tule kysymykseen, pitäisi saada tuo json -tiedosto encoodattuna alkuperäisessä lähdemuodossa käsittelyyn, niin jos ei stringify()-metodia käytä lainkaan, eli ei stringifoi, merkkijonoista tuosta lähteestä sitä.
Minulle tuli "Kyselyjen lukumäärä ylittynyt, kokeile tunnin päästä uudelleen", niin kysyn nyt täältä, jos neosofta olet linjoilla, niin toimisiko tämä esimerkiksi:
<!DOCTYPE html>
<html>
<head><title>JSON_TESTI</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8"/>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$.getJSON( "https://api.jokes.one/jod?category=animal", function( data ) {
var items = [];
$.each( data, function( key, val ) {
items.push( "<li id='" + key + "'>" + val + "</li>" );
});
$( "<ul/>", {
"class": "my-new-list",
html: items.join( "" )
}).appendTo( "body" );
});
</script>
</head>
<body>
<h1>Joke JSON</h1>
</body>
</html>No toi stringify jäi kai mieleen, koska väittivät, että stringified json olisi pukattavissa suoraan esim. localStorage objektissa value parametriksi.
Väittivät myös tämmöistä:
JSON.parse(json);The native JSON object includes two key methods.
1. JSON.parse()
2. JSON.stringify()
The JSON.parse() method parses a JSON string - i.e. reconstructing the original JavaScript object
var jsObject = JSON.parse(jsonString);
JSON.stringify() method accepts a JavaScript object and returns its JSON equivalent.
var jsonString = JSON.stringify(jsObject);
Katsoin tuolta jQueryn dokumenteista ja tuota parserointi-metodia ennen aiempaa postaustani aamummalla, kun luin eilisen viestisi, mutta kokeiltuani sitä, selain tulosti "undefined" -pelkästään, eli en saanut sitä toimimaan. Metkaa.
Tuolta jokes.onestahan ei saa tuolla get_joke_of_the_day() -metodilla, joka on kopioitu suoraan sieltä API:n esimerkistä, niin sellaisessa muodossa sitä dataa ulos, että sitä voisi iteroida tuonne indexedDB:hen suoraan.
"Uncaught SyntaxError: unexpected token: identifier"
tulee nyt, kun tarkastelen Firefoxilla tätä koodia:
<!DOCTYPE html>
<html>
<head><title>JSON_TESTI</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8"/>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
var items = [];
var jsonString = JSON.stringify($.getJSON( "./glo.json"), function( data ) {
$.each( data, function( key, val ) {
items.push( "<li id='" + key + "'>" + val + "</li>" );
})document.getElementById("log").innerHTML = items.values()});
</script>
</head>
<body>
<h1>Joke JSON</h1>
<div id="log"></div>
</body>
</html>Ajan tätä Apache-ympäristössä localhostissa, koska Firefox vaatii tuon JSON-tiedoston avaamiseen jonkin muun protokollan, kuin file://. Tuo document.getElementById...() on oikeassa kohtaa tuossa koodissa.
Kerran sain alertilla kokeiltuani tuota merkkijonoistamisen jälkeen taulukkoon työntämistä, että "Identifier Object Array"
Taulukko tuossa ikäänkuin ei sisällä mitään dataa, ainoastaan tietotyypit.
Oheisessa testissä log2:een ilmaantuu: [object Object]
<!DOCTYPE html>
<html>
<head><title>JSON_TESTI</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8"/>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$.getJSON("https://api.jokes.one/jod?category=animal",function(result){
document.getElementById('log').innerHTML = JSON.stringify(result);
document.getElementById('log2').innerHTML = JSON.parse(document.getElementById('log').innerHTML);
});
</script>
</head>
<body>
<div id="log"></div><br />
<div id="log2"></div>
</body>
</html>Eli voisit kokeilla säätää sitä 'Metkaa' esim.
var jsObject = JSON.parse(document.getElementById('log').
(eli: var jsObject = result)
To convert an object to an array you use one of three methods:
Object.keys(), Object.values(), and Object.entries().
Jere@
Huomasitkin jo varmaan, että object to array pyörittely ei johda muuhun kuin to an endless loop. Eli järkevintä lienee kuitenkin serialisoida se json kama siitä stringistä (= JSON.stringify(result)). Jotenkin minua on aina tympinyt viritelmät joissa pitäisi saada json kaman sisältä uutettua ulos taulukko/taulukot (sisältää yleensä juurikin sen datan jota tarvitsen). Mikäli ko. merkkijono on kovin kompleksinen tai hieman epästandardi niin I use to fuck the serialization ja rakentelen oman viritelmän jolla tongin ulos tarvitsemani kaman ihan vaan yksinkertaisilla:
var spos = str.indexOf('a'); var epos = str.indexOf('b'); str = str.substring(spos,epos);
<!DOCTYPE html>
<html>
<head><title>JSON_TESTI</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8"/>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(document).ready(function () {
const objJSON = {"success":{"total":1},"contents":{"jokes":[{"description":"Animal Joke of the day ","language":"en","background":"","category":"animal","date":"2021-12-04","joke":{"title":"Movie dog","lang":"en","length":"437","clean":"0","racial":"0","date":"2021-12-04","id":"LDBcL_PF3n2I3pKBuNzXiweF","text":"A man follows a woman out of a movie theater. She has a dog on a leash. He stops her and says: \r\n\r\n\"I'm sorry to bother you, but I couldn't help but notice that your dog was really into the movie. He cried at the right spots, he moved nervously in his seat at the boring parts, but most of all, he laughed like crazy at the funny parts. Don't you find that unusual?\" \"Yes,\" she replied, \"I find it very unusual... He hated the book!\"\r\n\r\n"}}],"copyright":"2019-20 https://jokes.one"}};
extract_skeida(JSON.stringify(objJSON));
});
function extract_skeida(skeida)
{
document.getElementById('log').innerHTML = skeida;
var spos = skeida.indexOf('"text":');
var epos = skeida.indexOf('}}]');
var temp = skeida.substring(spos + '"text":'.length + 1, epos -1);
temp = temp.replaceAll('\\r\\n\\r\\n','<br />');
temp = temp.replaceAll('\\','');
temp = temp.replaceAll('" "','"<br />"');
var final = temp.replaceAll('. ','.<br />');
document.getElementById('log2').innerHTML = final;
}
</script>
</head>
<body>
<div id="log"></div><br /><br />
<div id="log2"></div><br />
</body>
</html>Joo, no katsoin käytännossa noita metodeita ja kokeilin niitä, joiden kutsu kohdistetaan tuohon OBject-tietotyyppiin, enkä saanut haluamaani outputtia tulosteena.
Tuokaan nyt ihan kuin Strömsössä -ratkaisumalli ole tuo merkkijonojen käsittelyyn perustuva ratkaisuesitysmallisi. Jo se tuossa mättää, että tuo malli toimii ainoastaan tämän jokes.onen tarjoamassa JSON-datassa. Kovinkaan yleiskäyttöinen ole siis.
Täytynee käyttää aikaa, ja perehtyä aluksi, miten saa tuon alkuperäisen JSON-datan encoodattuna suoraan käsittelyyn, ja sitten kun sen saa ulos, niin voi ohjelmoida jonkin yleisellä tasolla yleishyödyllisen funktion, metodin millä kielellä nyt ohjelmoikaan sama se, mikä toimii sama minkälainen rakenne tai sisältö JSON-tiedostossa on. Uudelleenkäytettävyyden periaate maksimiin, ehdottaisin premissinä algoritmin implementointia suuniteltaessa jollain ohjelmointikielellä.
Javalla onnistuu helpostikin jollain JSON-kirjastolla, esimerkiksi Jacksonilla, kun importaa java.net.* ja java,io.* paketit ensin, niin tuossa Jacksonissa, mitä kaivoin äsken netistä, mitä pidetään suosittuna JSON-datan käsittelyyn soveltuvana kirjastona, niin ObjectMapperiin annetaan parametrillisessa konstruktorissa Stringinä se JSON-data, ja se voi olla haettu vaikka verkkolähteestä, tai ohjelmoi luokan, mikä virrasta tallentaa sen merkkijonoksi, ja sitten toinen syöteparametri on <Tietotyyppi>.class, eli se luokkatiedosto, jonka dataa se JSON-tiedosto sisältää, eli vaikka Joke -tietotyyppi.
No, taas mentiin Javaan vähän, vaikka kerroit, että Java oksettaa, kun alunperin oli JavaScript tähtäimessä.
Joo, totta on ettei esittelemäni viritelmän kaltaisella ratkaisulla päästä lähellekään mitään mitä voisi kutsua dynaamiseksi paketiksi. .NET/ASP.NET ympyröissä olen käyttänyt mainostettua NewtonSoft Json.NET Serializer pakettia, mutta ei sekään aivan kaikkeen pysty. Rakennellessani taannoin XHEL Helsingin pörssi viritelmää osa json nodeista sisältää taulukoita taulukoiden sisällä ja vielä eri määriä, osa taas ei jolloin sekä NewtonSoft että Microsoft serialisointi luokat tukehtuivat alkuunsa, eli joskus on vaan aivan välttämätöntä vääntää oma custom-viritys.
Aikoinaan kaikista eniten oksetti (lähes vitutti) ne jatkuvat aaltosulkeet ja puolipisteet, mutta pakko niitä oli alkaa nieleksimään viimeistään XnaForVS2019 ympyröissä koska ainoastaan C# templaatit on käyttössä ilman melko extremeä virittelyä (lakkaavat tietty toimimasta aina VS-päivityksen myötä).
Lähtee ehkä hieman paremmin purkautumaan...
<!DOCTYPE html>
<html><head><title>JSON_TEST_FINAL_CUT</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8"/>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$.getJSON("https://api.jokes.one/jod?category=animal",function(result){
for(var obj in result){
if(result.hasOwnProperty(obj)){
for(var prop in result[obj]){
if(result[obj].hasOwnProperty(prop)){
if(prop == "jokes"){
var objTemp = JSON.parse(JSON.stringify(result[obj][prop]));
objTemp = JSON.parse(JSON.stringify(objTemp[0].joke));
document.write(objTemp.date + "<br />" + objTemp.text);
}
}
}
}
}
});
</script></head><body></body></html>neosofta kirjoitti:
Lähtee ehkä hieman paremmin purkautumaan...
Tuo koodi on nyt ehkä järkevin esitys tähän asti kaikista näistä, mitä tässä keskustlussa on esitetty. Tuossa alkaa jo olemaan runkkua, eli tekemisen meininkiä vähän tai ohjelmointikeskustelua kun käydään ja koodaus-kontekstissa puhutaan, niin tässähän alkaa olemaan ohjelmoinnin meininkiä.
Tein tuollaisen havainnon, että on ihan oikein, mitä tuo tulostaa Object Object, mitä tuolla aiemmin esitit noita Object-tietotyyppiin kohdistuvia .values() .keys() yms. metodikutsuja, kun tuossa jokes.onen json-datassa ei ole kuin success ja contents objektit, ja tuo contents -sisälto on taulukossa tuossa JSON-datassa.
Jos käytät
console.log(obj)
sen sijaan, että tulostaisi noita Object.<metodinNimi> -kutsujen tuloksia selaimella näkyviin, niin jos katsot esimerkiksi Firefoxilla kun selaimeen tulostuu tuo object object, niinkuin ihan oikein se tulostaa sen, niin "Tarkastele sivua", niin konsoli-välilehdellä näkyy se JSON-data selkeästi jäsenneltynä ja avain-arvoparit.
En käytä mitään web-kehitykseen kytkeytyvää debuggeria, mutta www-ohjelmointikurssilla kun oli JavaScripitä myos, niin siellä opeteltiin jotain perusteita tuollaisesta Firefoxin liitännäisestä, kuin Firebug, varmaan sielläkin näkyy ne samat jossain muodossa tai laajemminkin, mitä tuossa "Tarkastele sivua" toiminnon takaa näkee sen mm. konsolivälilehden, mihin pääsee tuosta hiiren oikean napin takaa.
Varmistin netistä, kun Javassa (Taas mainitsen kerran Javan, rakkaussuhteeni Javaan on kiintynyt), niin Javassahan taulukkomuuttujat ovat oliomuuttujia, ja niihin voi kohdistaa metodikutsuja. varmistin netistä, niin JavaScriptissä on sama mekanismi, että JavaScriptissä taulukkomuuttujat käsitellään oliomuuttujina, ja esimerkiksi tuo Object.keys() -palauttaa taulukkona sen outputin, eli tuon JSON-objektin sisälto tulisi saada muutetuksi taulukoksi, ajattelin jos avaimet ja arvot tallentaisi omiksi taulukoiksi.
Minulla ei ole Firefox asennettuna, eikä myöskään tule. Runkatessani kasaan tuota edellistä väännöstäni niin jollain sivustolla vilkahti juurikin tuo ajatus pukata avaimet ja arvot omiksi taulukoikseen. Kävi siinä mielessä, että mitäs vittua tuosta olisi hyötyä, nehän voisi pukata sitten saman tien yhteen 2-ulotteiseen taulukkoon. En pukannut ko. sivuston osoitetta suosikeihin vaan jatkoin oman ideani viilaamista.
No voihan ne tietty 2-ulotteiseen taulukkoonkin pushata.
Katsoin tuosta Firebugista muuten, niin unohda se, sen elinkaari on päättynyt 2017 -vuonna, kun hacks.mozilla.org -sivustolla oli jonkun varmaan Mozilla säätiön kehittäjän artikkeli, että se on nykyisin näissä Firefox-selaimissa tuolla valikossa "Lisää työkaluja-> Web developer tools", ja se on nimenomaan tuo "Tarkastele sivua" -valinnan takaa tuleva debuggeri, jossa siinäkin voi muokata lennosta sitä lähdekoodia kästtääkseni.
Käytätkö sä edes jotain debuggeria web-kehityksen tiimoilta, kun sitä varmaan teet jonkin verran? Kai noissa muidenkin selainvalmistajien selaimissa jotain hyviä debuggeri-liitännäisiä tai sisäänrakennettuja on?
Kokeilin tällaista muutosta tuohon eilen sinun loppuiltapäivästä esittämääsi koodiin:
if(result[obj].hasOwnProperty(prop)){
var objTemp = JSON.parse(JSON.stringify(result[obj][prop]));
keys.push(objTemp);
/*if(prop == "jokes"){
var objTemp = JSON.parse(JSON.stringify(result[obj][prop]));
objTemp = JSON.parse(JSON.stringify(objTemp[0].joke));
document.write(objTemp.date + "<br />" + objTemp.text);*/niin nyt tuonne keys-taulukkomuuttujan ensimmäiseen alkioon sijoitetaan koko helahoito yhtenä merkkijonona.
}
No eihän siinä mitään... voihan tuohon tietty sisällyttää vaikka minkälaisia koukkuja tahansa, mutta käsittääkseni ainakin jossain vaiheessa oli ideana puskea noita vitsejä indexedDB:hen, josta niitä voisi sitten myöhemmin tonkia esille esim. päivämäärän perusteella.
En nyt ole ihan kärryillä mitä tässä taulukoiden kanssa pelaamisessa ajetaan takaa?
Eikös tuossa JSON.parse anna JSON muotoisesta tekstistä JavaScript objektin? Eikö tuosta voi sitten suoraan hakea "contents" avaimen alla olevan tavaran ja eikö JSON.stringify muunna tuon tekstimuotoiseksi JSON:iksi? Eikö tuota voi sitten suoraan työntää kantaan käyttämällä päiväystä avaimena?
No vittuako sitä koko "contents" avaimen alla olevaa tavaraa kantaan tarvii lykätä? Ekö se pelkkä pvm. (objTemp.date) ja vitsi-stringi (objTemp.text) muka riitä? (viittaa viimeisimpään väännökseeni)
Tällä saa taulukosta tulostettua verkkoselaimeen avain-arvo-parit taulukosta:
<!DOCTYPE html>
<html><head><title>JSON_TEST_FINAL_CUT</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8"/>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$.getJSON("./glo.json",function(result){
//taika tapahtuu seuraavalla koodirivillä:
var objTemp = Object.entries(result).map(([key, value]) => ({key,value}));
tulosta(objTemp);
});
function tulosta(data) {
const result = [];
for(var key in data)
{
if(data.hasOwnProperty(key))
{
result.push({
key: key,
value: data[key]
});
}
}
document.getElementById("content").innerHTML = JSON.stringify(result);
};
</script></head><body>
<div id="content"></div>
</body></html>Tuo taulukkoon, joka sisältää Object -tietotyypin oliomuuttujia, niin map-funktion kutsu kohdistettuna tuohon taulukkoon oli uutta minulle. Nyt se ratkesi.
Käytin esimerkki-json-tiedostona seuraavaa, eli tuo 'glo.json' -tiedosto näyttää seuraavalta:
{
"glossary": {
"title": "example glossary",
"GlossDiv": {
"title": "S",
"GlossList": {
"GlossEntry": {
"ID": "SGML",
"SortAs": "SGML",
"GlossTerm": "Standard Generalized Markup Language",
"Acronym": "SGML",
"Abbrev": "ISO 8879:1986",
"GlossDef": {
"para": "A meta-markup language, used to create markup languages such as DocBook.",
"GlossSeeAlso": ["GML", "XML"]
},
"GlossSee": "markup"
}
}
}
}
}Mulla on taas pyyntöraja täynnä tuossa viihdestringien vitsimetsästyslähteestä, niin siitä syystä en pystynyt kokeilemaan sillä tätä. Kuten neosofta on nimennyt aiemminkin tässä ketjussa tiedoston "skeidaa", niin jalski on ihan oikeassa, tässä tehdään nyt kärpäsestä ehkä turhan suuri härkä, skeidasta asiaa.
Nyt kun siitä joke objektista saa uuteltua kaiken näköistä, niin hommaa voisi kehitellä esim. siten että alasvetolaatikkoon on kirnuttu valmiiksi vitsi-kategoriat ja jos pvm. pickerin ja alasvetoboxin osoittamaa matskua ei löydy kannasta muokataan se haku URL sen alasvetoboxin kategorian mukaiseksi, haetaan päivän vitsi, näytetään sivulla ja tallennetaan kantaan tietenkin huomioiden kategoria. Mikäli taas pvm. pickerin ja alasvetoboxin arvojen perusteella kannasta löytyy joke niin ei ole tarvis hakea muualta kuin kannasta eikä tietty myöskään tallennella eli näytetään sitten se kannasta haettu sivulla. Hommaa voisi tietenkin vielä höystää sillä Jeren värivirityksellä. Pientä lisäpotkua antaisi tietysti jos saisi ne impatut päivän vitsit kierrätettyä automaattisesti googlen kääntäjän kautta ja tallennettua kantaan käännettynä valitsemalleen kielelle...
P.S. testaamiseen:
const objJSON = {"success":{"total":1},"contents":{"jokes":[{"description":"Animal Joke of the day ","language":"en","background":"","category":"animal","date":"2021-12-04","joke":{"title":"Movie dog","lang":"en","length":"437","clean":"0","racial":"0","date":"2021-12-04","id":"LDBcL_PF3n2I3pKBuNzXiweF","text":"A man follows a woman out of a movie theater. She has a dog on a leash. He stops her and says: \r\n\r\n\"I'm sorry to bother you, but I couldn't help but notice that your dog was really into the movie. He cried at the right spots, he moved nervously in his seat at the boring parts, but most of all, he laughed like crazy at the funny parts. Don't you find that unusual?\" \"Yes,\" she replied, \"I find it very unusual... He hated the book!\"\r\n\r\n"}}],"copyright":"2019-20 https://jokes.one"}};EDIT: Breaking News... there actually exist a google translation api which you can try free for 90 days
neosofta kirjoitti:
No vittuako sitä koko "contents" avaimen alla olevaa tavaraa kantaan tarvii lykätä? Ekö se pelkkä pvm. (objTemp.date) ja vitsi-stringi (objTemp.text) muka riitä? (viittaa viimeisimpään väännökseeni)
Miksi noin epäkohtelias sävy? Niin, jos sattuu omaamaan api-keyn niin noita vitsejähän saattaa olla useampi tuolla "contents" avaimen alla. En tiennyt mitä tuosta tiedosta halutaan esille, niin ehdotin tuota koko "contents" avaimen alla olevaa. Tekijänoikeus rimpsu nyt ainakin vaaditaan näkyville laitettavaksi... Ehkä tuon tiedon voisi kantaan tallentaa msgpack-muodossa.
jalski kirjoitti:
Miksi noin epäkohtelias sävy?
Sori, tarkoituksena ei ollut lainkaan olla epäkohtelias... innostuin ehkä liikaa ja aloin käyttämään nykypäivänä laajalti, joskus jopa televisiossa käytettävää, hieman rennompaa suomea.
Tekijänoikeudet voivat olla esillä suoraan sivulla esim. footer osassa, mitäpä niitä suotta kantaan lykkäämään.
Jos nyt ajatellaan, että rakennellaan edellisessä viestissäni kuvaillun kaltainen viritelmä niin pitääköhän tuo api-tekijänoikeus olla esillä myös siinäkin tapauksessa, että vitsi haetaan suoraan kannasta jolloin ko. api ei käsittääkseni ole juuri silloin käytössä?
P.S. Saakohan esim. Microsoft Heidin säädettyä sanomaan text to speech viritelmissä piip aina ns. sopimattomien sanojen kohdalla?
neosofta kirjoitti:
P.S. Saakohan esim. Microsoft Heidin säädettyä sanomaan text to speech viritelmissä piip aina ns. sopimattomien sanojen kohdalla?
Vielä lisäyksenä tuohon puheen sensurointiin, niin Microsoft Speech, jos Heidi liittyy tai HeidiSQL -liittyy siihen jotenkin, niin ohjelmoimalla C#/.NET
/.ASp -tekniikoilla vaikka Visual Studio -ympäristossa, niin varmaan onnistut tavoitteessasi. En ole juuri koskaan noita puheen generointiohjelmia tekstistä tutustunut niihin, joskus Amiga 500:lla Workbenchissä jotain kirosanoja penskana kokeilin tuottaa puheeksi.
Tuo musta lista virallinen englannin kielinen termi on black list, ja sen idea on se, että lista sisältää kielletyt asiat,kun taas valkoinen lista (white list) sisältää asiat, jotka ainoastaan sallitaan ja useimmiten tuo valkoinen lista on tehokkaampi, erityisesti verkkomaailmassa, kun kaikkia poikkeustilanteita ei voi ennakoida yleensä etukäteen.
Tässä puheen generointi/tuottamis - tapauksessa musta lista voinee toimia paremmin, mutta luomalla valkoisen listan, jonka läpi parseroit puheen ennen äänen tuottamista, niin aika tavalla voi saada sensuroitua juuri mielisekseen puheen, voi toimia erityisesti jos tykkää pitää poliittisia palopuheita oman vinksalleen vääristyneen huumorintajun ja oman punavihreän maailmankatsomuksen läpi suodatettuna kuulijoille.
Sitten vielä, jos olet perillä kieliteknologiasta, ja tekoälytutkimuksesta, jos sinulla on jonkun tietyn ihmisen esimerkiksi. puhutun suomen kielen foneettisia äänteitä tai sanoja yms. tarpeeksi varastossa, niin voit pistää tämän henkilon lausumana mitä hyvänsä audio-datana ulostuloksi. Kirjoitin tuosta tekoälyn hyodyntämisestä puheen tuottamisessa Uusi Suomi -puheenvuoro artikkelinkin, varmaan olet lukenut sen, jossa viittasin siihen Yleisradion kampanjaan, jossa Yle kerää puhenäytteitä kansalaisilta.
Tuo tekstistä puhetta liitettynä kieliteknologiaan ja tekoälytutkimuksen kehitykseen tekee kaikista puhetyoläisistä esim. juontajista täysin turhan ammatin tulevaisuudessa.
Noista kärkipolitiikoista, joiden puhetta on paljonkin esim. Youtube-videoilla, jos rippaa pelkän ääniraidan ja editoi sitä audiota, niin ennen pitkää varmaan saa tyyliin Modern Talking Jussi Halla-Aho -ääninäytteen esimerkiksi, mutta itse en ole niin kiinnostunut aiheesta, vaikka välillä editoin puheaudiota, ja teen omia mixejä Audacityllä lähinnä omaksi huvikseni ajanvietteenä.
Tuosta Google -kääntäjästä, niin itse en käytä sitä oikeastaan ollenkaan, varmaan se jossain määrin älykäs on, mutta mitä jonkin verran humaanina harrastuksena olen melko pitkään jo harrastanut luonnolisen puhutun englannin kielen harrastamista humaanista lähestymistavasta, niin yleensä, jos kääntää jonkin hyvänkin vitsin englannista suomeksi, erityisesti jos konekääntäjällä kääntää, niin vitsin merkitys ei välity samalla tavalla, mitä sen sitten vitsin kuulijan tajuamana ilman koneellista käännostä.
Jere Sumell kirjoitti:
Tuo tekstistä puhetta liitettynä kieliteknologiaan ja tekoälytutkimuksen kehitykseen tekee kaikista puhetyoläisistä esim. juontajista täysin turhan ammatin tulevaisuudessa.
Mitä olen kiinnostunut sanapeleistä, ja täällä putkassakin aloitin tuon "Perinteisen kuvaristikon laadinnan automatisointi" -ketjun, niin tuli mieleen tähän välikevennyksenä, tai olisiko tämä se kuuluisa "jäniskevennys", kielen kautta arvoitus, ja toivon mukaan tämän palstan moderaattorit eivät poista tätä arvoiusta, vaikka en kaipaa siihen mitään kommenttia. Oletteko pohtineet tällaista suomen kielen ja tietokonekielien tietojenkäsittelyharrastajat saati humanistisen kielitieteen tarjoamasta maailmankuvasta mitään tietävät luonnontieteilijät edes akateemisella tasolla?
Pähkinä: Lopuksikaan en anna, joka tapauksessa alkuun juon, mikä ammatti?
Vastaus: Juontaja
Vähän pienen sanaleikki-arvoituksen muodossa humaanina kielien harrastana myös pientä leikkiä tähän väliin keskstelua, ettei mene ihan tietokonekieliksi.
Toi pudotusvalikko-idea on hyvä, nyt kun sieltä saa kaikki mahdolliset key-value -arvot sama mikä JSOn -lähde/tiedosto on kyseessä! Hyvä "nesofta"!
You're my man!
Jere@
Rohkenisiko pyytää kirnuamaan kaiken tässä langassa esitetyn skeidan pohjalta joku viritys, höystettynä tietty sillä colorPicker tuotoksellasi, ja lykkäämään tänne esille?
Myöskin sinulle rakkaalla Java'lla kirnuttu versio voisi tulla kysymykseen, nyt kun nuo aaltosulkeet sekä iänikuiset puolipisteet ovat muutoinkin alkaneet menemään alas ilman kossuakin.
Kyllähän toki
neosofta kirjoitti:
Jere@
Rohkenisiko pyytää kirnuamaan...
Toki voin ohjelmoida tarvittavat!
Se vaan, kun tipuin 2002 heti lukion jälkeen työkkärin ilmaistyöpaikkapyöritykseen, ja sitten 2006/2007 13 kuukauden sivarin lusimisen jälkeen tipuin työkkärikortistosta suoraan työkyvyttömyyseläkkelle, ja huomennahan on taas eläkemaksupäivä, ja katsoin eilen Alkon -verkkosivuilta, mitä kolmen litran punaviini -hanapakkausta sitä ostaisi kylkee siinä ehkä Sisu -vinaa tai Yhden Tähden jallua, ja pullo Koskenkorvaa, ja yleensä jos olen viikon stressilomalla, niin en kirjoittele kännissä mitään tänne.
Eli voi mennä seuraavaan viikkoon, että aloitan ohjelmoimaan Jacksonia voisi käyttää Java -kirjastona tuossa JSON - datan käsittelyssä, yksi Jenkovin blogiartikkeli oli ratkaiseva, ja sitten julkaisen lopulta täällä avoimesti kaikkien meidän nähtäville loppu-ulostulon lähdekoodin muodossa.
Eli voi tehdä tämän, mitä kysyit, mutta viive on 1-2 viikkoa johtuen humanitaarisista oman elämäni käännekohtien ja metafyysisten pohdintojen kautta tekemieni johtopäätöksineni liittyen omaan elämänkaareeni. 1-2 viikkoa vähintään, että koodit tulee tähän ketjuun!
ASIAA!
neosofta kirjoitti:
Hommaa voisi tietenkin vielä höystää sillä Jeren värivirityksellä. Pientä lisäpotkua antaisi tietysti jos saisi ne impatut päivän vitsit kierrätettyä automaattisesti googlen kääntäjän kautta ja tallennettua kantaan käännettynä valitsemalleen kielelle...
Tuo cross-domain Storage-objektin localStoragella tallennetun tiedon hakeimen on jokseenkin ongelmallista, ja en tiedä kuinka turvallisesti sen saa toteutettua, vaatisi muutoksia tuohon HTML-värivalinkoodiinikin, ja sitten siihen vitsisivulle pitäisi toteuttaa ifrmae-tagilla ikkuna, jossa olisi tuo värivalitsin-sovelluksen "etäkäyttö", tuohon värivalitsin-JavaScript -sovellukseen pitäisi löytää jokin turvallinen keino, jolla sallia etäkäyttö.
Esimerkiksi Mozilla Firefox -selain blockkaa kolmannen osapuolen datan käytön lähteet, same-origin -policy, joka oll pitkään Firefoxissakin aikanaan haavoittuvuus, että sitä ei ollut tässä, en tiedä, kun tuo XSS-hyökkäys on ihan verkkosovellusturvallisuuden perusteita ollut varmaan 1995 -vuodesta saakka, ja www-kehittäjien keskuudessa iframe -ikkunat on olleet varmaan aika suosittujakin jossain vaiheessa.
Firefoxin tuon same-origin -policyn saa kierrettyä, löysin
tällaisen artikkelin vuonna 2010 kirjoitettuna "Human Who Codes" -sivustolta, jossa on esitetty jonkinlainen ratkaisu, miten voi sallia tuon localStoragen datan käyttö etänä, mutta tiedä sitten turvallisuudesta.
En tiedä, löytyykö netistä paljon verkkopalveluita, joissa tuo yksivaiheinen tunnistautuminen tyyliin käyttäjätunnus-salasana tallennetaan localStorageen, niin varmaan joku red-hat hakkeri on jonkinlaisen huijaussivuston jo luonutkn sellaiseen, jos ajatellaan, että esim. Facebookissa olisi tallennettuna se kirjautumisdata localStorageen, ja sen jälkeen, kun uhri on kirjautunut sinne someen, ja menee tuonne huijaussivustolle, niin sivustolla voi olla jokin vaikka näkymätön iFrame -ikkuna, joka hakee sitten käyttäjän nuo Facebook-käyttäjätunnuksen ja salasanan ja tallentaa ne sitten omaan tietokantaansa, jonka jälkeen sitten on mahdollista "kaapata" -uhrin FB-tili. No, FB on nyt vain esimerkki, ja ketkään valveutuneet verkkopalvelujen kehittäjät varmaankaan käytä tuota localStoragea esim. kirjautumistietojen tallennukseen. Varmaan jollain muulla tekniikalla FB:ssäkin toteutettu tuo "Muista minut" -toiminto.
P.S. Nyt kostea stressiloma-viikkoni alkaa kääntymään lopuilleen, ja oma prosessori alkaa olemaan resetoitua sen osalta, niin taas aika palata sorvaamaan , tai "kirnuamaan" sitä koodia JavaScriptillä ja Javalla Jackson -kirjastolla, mistä oli puhetta tämän vitsisovellus-casen osalta, mutta tiedä sitten turvallisuus-syistä tuosta värivalitsimeni tallentaman käyttäjän valintojen -datan käytöstä tässä vitsi-sovelluksessa, vaikka se teknisesti onkin mahdollista, ja olen tuon alkuperäisen värisovelluksen ainoa ja alkuperäinen ylläpitäjä.
Vielä tuosta SOp ja CORS -aiheesta, ja tuon HTML5-tarjoaman iFrame-tagilla ohjelmoidun ikkunaan liittyen.
HTML5:ssä on poistettu käytostä aiemmista versioista, mutta katsoin tuon viimeisimmän HTML5 (ent.name, jonka määrittelystä vastasi W3-consortium) HTML
Living Standard on viimeisin ja avoimesti kehitystyon alla, jonka määrittelyä ylläpitää nykyisinkin WHATWG -organisaatio sen jälkeen aloittanut, kun ovat tehneet sopimuksen W3:n kanssa.
Luin tuolta virallisesta dokumentaatiosta, joka on päivitetty viimeksi 8. joulukuuta 2021 tuosta iFrmae-tagin attribuuteista, niin siellä ei ole ohjeistusta hidden -attribuutista, jollain sivulla luki, että tulevaisuudessa tuossa HTML Living Standardissa siihen on tulossa tuo hidden-attribuutti iFrame -tagiin.
Tuon iFrmaen, jos haluaa piilottaa verkkoresurssissa vierailevalta verkkosurffailta, niin on mahdollista tällä hetkellä seuraavanlaisesti:
<iframe src="javascript.html" width="0" height="0" tabindex="-1" title="empty" class="hidden">
Katselin hakukoneella hakusanoilla "CORS cons" ja "CORS pros", ja vielä "Never disable CORS on your browser", mutta ei sieltä oikein mitään tullut, sen sijaan Google listasi jotain autojen jarrujen myyntiverkkokauppoja ja sitten itselleni myytiin sukkia, eli ei mitään tähän verkkotietoturva-kontekstiin liittyvää oikeastaan mitään ihmeellistä.
Oma mielipiteeni on se, että tuo CORS-asetus kannattaa poistaa tilapäisesti käytostä selaimessa ainoastaan kehitysvaiheessa, jos sivusto sisältää useasta eri lähteestä dataa, ja siinäkin tapauksessa ja oikeastaan aina kannattaisi vetää nettipiuhat irti, ja ohjelmistokehitystyo pitäisi aina suorittaa offline-tilassa.
Jere Sumell kirjoitti:
ohjelmistokehitystyo pitäisi aina suorittaa offline-tilassa.
Oletko tosissasi?
noutti kirjoitti:
Oletko tosissasi?
No en nyt niin ahdasmielisesti ajattele, ja se mitä esim. itse devaan vähän, niin ei siinä nyt niin suurta riskiä ole, vaikka ohjelmakoodi "vuotaisikin" johonkin,en itsekään lähestulkoonkaan aina sulje nettireititintä ohjelmointia tehdessä koneella.
On ihan totta, että ei tuo offlinessa ohjelmointi-ehdotus nyt niin kaukaa välttämättä ole haettu, riippuen kuinka kriittistä koodia ollaan luomassa.
Jos nyt jotain valtion puolustustoimiin liittyvää ohjelmaa suunnitellaan, niin voisi kuvitella, että ihan avoimia ovia pidetä maailmalle kehitysvaiheessa. On niitä alemman tason organisaatioissakin varmaan voi olla joissain yrityksissä jotain turvallisuusohjeita organisaatiokulttuurissa ohjelmistokehitystä tehdessä.
Jere@
Mitä ihme iframe-skeidaa olet sinne väliin pukkaamassa?
Testasin viritelmää työpöydällä värivirityksen/vitsin haun osalta:
<!DOCTYPE html>
<html>
<head><title>HTML-color-picker:Never anymore need to solve opponecy color problem again yourself!</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8"/>
<script src="jquery-latest.min.js"></script>
<script>
$.getJSON("https://api.jokes.one/jod?category=animal",function(result){
for(var obj in result){
if(result.hasOwnProperty(obj)){
for(var prop in result[obj]){
if(result[obj].hasOwnProperty(prop)){
if(prop == "jokes"){
var objTemp = JSON.parse(JSON.stringify(result[obj][prop]));
objTemp = JSON.parse(JSON.stringify(objTemp[0].joke));
//document.write(objTemp.date + "<br />" + objTemp.text);
document.getElementById('txtA1').innerHTML = objTemp.date + "<br />" + objTemp.text;
}
}
}
}
}
});
</script>
</head>
<body id="demo">
<h1>HTML - color -picker</h1>
<p>Choose your Red, Green and Blue values and this page body shows you results in run and gives a hex values for colours.This application is programmed to remember your picks even if you leave page and come back.</p>
<textarea id="txtA1">
</textarea>
<form>
<br>
<input type="radio" name="userColorPick" value="Background" checked onchange="aja()">Background</input>
<br>
<!-- lisäsin tohon radionappiin id:n -->
<input type="radio" id="radio2" name="userColorPick" value="Text" onchange="aja()">Text</input>
<br>
<input type="range" min="0" max="255" value="0" class="slider" id="redRange" onchange="aja()"><p><b>Red Value</b>: <span id="redSV"></span></p>
<br>
<input type="range" min="0" max="255" value="0" class="slider" id="greenRange" onchange="aja()"><p><b>Green Value</b>: <span id="greenSV"></span></p>
<br>
<input type="range" min="0" max="255" value="0" class="slider" id="blueRange" onchange="aja()"><p><b>Blue Value</b>: <span id="blueSV"></span></p>
</form>
<p id="rgb">
<br>
<p id="hexD">
<br>
<p id="oppC">
<hr size="2">
<i>published 17.11.2021 (First version)</i>
<br>
<i>updated 21.11.2021 (Second version)</i>
<br>
<b>This page is using HTML5 supported localStorage Objects now.
<br>
Thanks for active and fellow Programming forum discussion mate nicknamed <i>"neosofta (who got me so confused I had difficult to get this 'skeida' finished)"</i>@ <a href="https://www.ohjelmointiputka.net">Ohjelmointiputka</a>
<br>
-Finnish-origin non-commerical progamming society for his help to introduce myself to Storage objects in HTML5 and coding tips with them.</b>
<script src="colorPicker.js"></script>
</body>
</html>ja hyvin toimii sekä värinsäätö että vitsin haku. Eli JavaScriptit pitää olla samassa domainissa (sivun kanssa) niin selain ei käsittele as mixed content. Mikäli alat sotkemaan sydeemiisi iframe kamaa joihin pukataan kamaa 3rd party scripteillä niin varmasti tökkää, ellet säädä selaimesi tietoturvatasoa tasolle 'TERVETULOA SISÄÄN KAIKKI SKEIDA'
Joo, no ensimmäisen lähdin alkuoletuksesta, jonka käsityksen aluksi oivalsin, että html-värvalitsin sijaitsee netissä yhdessä lähteessä, ja sitten tullaan tuohon <iframe> ja eri domain-alueen lähteestä haetun datan käyttöön. On totta, että todellakaan sitä voi toteuttaa käytännössä, ymmärrän täysin, enkä alkanut pohtimaan sen enempää sen toteuttamistakaan niin.
Jos oletetaan, että tuo värivalitsin olisi jossain pysyvässä lähteessä vaikka hamaan loppuun saakka, vaikka käytännössä tuo kotisivuni lakkaa tuolla osoitteessa varmaan sitten olemasta, kun tuo verkkoisäntä lopettaa jossain kohtaa yrityksensä toiminnan, kun olen harkinnut hankkia tuolta hallittavan domainin ja maksaa siitä jotain, ja liittää tuon sivustoni sen alle.
Jos ajattelee tavallista Internet-surffaria, joka päätyy vitsisivulle, niin periaatteessa kun tuo html-värivalitsin lähinnä kohderyhmä on enemmänkin verkkosivujen kehitystyötä tekevät, niin sen voisi kuvitella olevan piilossa loppukäyttäjältä, että sen tavis-Sepon, joka tulee lukemaan päivän vitsiä, niin tarvitsisi tietää mitään tekniikasta.
Toimiihan tuo kyllä noinkin, varmaan aika siirtyä projetkissa eteenpäin ja alkaa sitä dataa tuppaamaan IndexDB:hen.
Jos voitan Lotossa täyspotin, niin voin harkita tuon värivalitsimen siirtoa johonkin Googlen tai Amazonin pilveen siten, että maksan etukäteen sen pilvivuokran seuraavaksi pariksi sadaksi vuodeksi eteenpäin.
Tiedon valtavaylällä on jo kauan vallinnut käytäntö ettei tavis-surfaajan tarvitse muuta nähdäkään kuin jatkuvaa mainontaa...
ajattele neosofta sitten vielä niitäkin varmaan tavis-Seppoja, jotka klikkavat niitä mainoksia, ja aina siinä monikin tienaa rahaa. Varmaan on paljon verkkosivujen ja blogien ylläpitäjiä, jotka tienaavat ihan hyvinkin sellaisten vähemmän valveutuneiden nettisurffarien kustannuksella, jotka eivät käytä vielä adblockeria, vaan antavat kaiken roskan latautua näkyville,
Ei itsellänikään Windows 10 -koneessa ole adblocker-liitännäistä selaimessa, mutta en klikkaile ja seuraa mainoksia, vaikka ne latautuukin nettisivuille nähtäväksi, mutta Linux-koneessani, jolla tykkään eniten tehdä devausta, niin siinä on adblockeri, ja olen Firefoxin asetuksista pistänyt kaiken mahdollisen datan lähettämisen Mozilla-säätiölle pois päältä.
Noi mainosverkostotkin on jo pitkään olleet sillä tavalla "älykkäitä", että ne niiden esittämät mainokset perustuu pitkälti sen nettisurffaajan aikaisempaan verkkoselaushistoriaan ja niihin aiheisiin ja mitä hakusanoja tämä on käyttänyt, että verkkosivun ylläpitäjän, jos tykkää mainostuloja hankkia, niin enää pitkään ole tarvinnut tietää mitään verkkosurffaajan mielenkiinnon kohteista.
Itse tosiaan en ole mikään vapaan markkinatalouden kannattaja, ja kaupallisuus on mielestäni hanursta pääasiassa.
Ajat on tosiaan verkossa muuttunut ehkä enimmäkseen huonompaan suuntaan tämä kehitys, kaupallisuutta on roimasti enemmän mitä joskus esim. 1990 -luvun lopussa. Lisäksi Internet-lainsäädäntö on kehittynyt roimasti, ja kehittyy edelleen, että oikein mitään kaupallista verkkopalveluakaan voi harkita perustavan, kun joka paikassa pitää olla eväste/tietosuojasäädökset ja palvelun käyttöehdot, ja sitten kun niitä ei osaa itse laatia, niin täytyisi palkata sellainen Internet-lainsäädäntöön hyvin perehtynyt, ja sitä alati seuraava puolustusjuristi ennen palvelun lanseeraamista, joka tajuaa ne laatia.
No, paluuta vanhaan hyvään aikaan ei enää ole, mutta toivon mukaan elinaikanani tämä Internetin alkuperäinen perusperiaate kenen tahansa vapaasti julkaisuja sallivasta tai vapaudesta verkossa ei muutu markkinoiden ehdoilla yhtä helvetiksi, mitä televisioyhtiöt televisionkatselun on kehittänyt markkinoiden ehdoilla äärimmilleen kaupalliseen suuntaan, kun nykyiselläänhän on jo pitkään ollut niin, että lopulta televisionkatsoja maksaa siitä sisällöstä, mitä tykkää katsoa, kun nopeiden internetyhteyksien yleistyminen edulliseen hintaan on mahdollistanut noiden kaupallisten suoratoistopalveluiden läpilyönnin.
Anyway, VitaePro jää väliin
Jere Sumell kirjoitti:
(12.12.2021 17:17:11): ”– –” No en nyt niin ahdasmielisesti ajattele, ja...
Juu pidä se mokkula vain päällä. Ei noissa kriittisten puljujenkaan pajoissa yhteyttä nettiin suljeta. En itsekään sulje, kun teen töitä pörssiyhtiöiden kanssa. Olisi devaus suhteellisen hankalaa.
Jere Sumell kirjoitti:
...ajattele neosofta sitten vielä niitäkin varmaan tavis-Seppoja...
Ja v***t mä mitään ajattele, kunhan pukkaan menemään pelkällä näppistuntumalla...
Alla oma "päivän vitsi" sovellukseni 8th:lla. Ohjelma hakee päivän vitsin KV-tietokannasta tai netistä ja tallentaa tietokantaan. Vitsi esitetään graafisessa ikkunassa. Jos ohjelmaa ei suljeta, niin päivittää automaattisesti uuden vitsin aamuisin klo 6. Ohjelman rumuus tuskin haittaa ketään, kun vitsitkin on aika huonoja...
needs nk/gui
needs net/http
needs date/utils
22 font:system font:new "font1" font:atlas! drop
"https://api.jokes.one/jod" constant URL
{ Content-type: "application/json" } constant HEADERS
{
url: @URL,
headers: @HEADERS
} constant REQUEST
{
flags: [ @nk:WINDOW_NO_SCROLLBAR ],
bg: "white"
} constant WINDOW
var jokes-db
: sleep-until \ d --
d:>msec d:msec n:-
0 over n:> if drop ;then
1000 n:/ sleep ;
: open-db \ -- db true | null false
{
kind: "kv",
file: "jokes.kv", \ the database name
dir: false, \ 'file' is not a directory
sync: false, \ don't sync every time we do a transaction
map: true, \ use mmap for writing
create: true, \ create the db instead of failing if it doesn't exist
maxdbs: 0 \ how many 'sub' databases are possible in this database?
} db:open
error? not ;
: fetch-joke
REQUEST net:get if
nip json> "contents" m:@ nip b:>mpack drop true
else
drop
null false
then ;
: update-joke
WINDOW "%D.%M.%Y" d:new d:format "date" m:_! swap
"joke" m:@ nip null? not if
b:mpack> drop ["copyright", "jokes"] m:@ nip a:open a:open
"joke" m:@ nip "text" m:@ nip 2 pick swap "joke" m:_! drop
"copyright" m:_! drop
else
2drop
then ;
: retry
120 sleep ;
: success
"joke" m:_! nk:do
"06:00:00" d:parse 1 d:+day sleep-until ;
: joke-task
repeat
{ cb: ' update-joke }
jokes-db @ "%y-%M-%D" d:new d:format dup >r db:get null? if
drop fetch-joke if
tuck r> swap db:set drop
success
else
2drop
rdrop
retry
then
else
nip
rdrop
success
then
again ;
: init
open-db not if
"Failed to open database: " . t:err? . cr
bye
else
jokes-db !
then ;
: new-win
{
name: "main",
title: "Joke Of The Day",
wide: 600,
high: 300,
resizable: false
}
nk:win ;
: main-render
WINDOW
nk:begin
null { margin: 8, rows: [0.2, 0.6, 0.2], cols: 1, cgap: 8, rgap: 8 } nk:layout-grid-begin
0 1 0 1 nk:grid nk:rect>local nk:grid-push
"date" nk:get "" ?: nk:TEXT_CENTERED "black" nk:label-colored
1 1 0 1 nk:grid
0 "joke" nk:get "" ?:
"\r\n" "\n" s:replace!
"font1" "white" "black" 0 nk:draw-text-wrap 2drop drop
2 1 0 1 nk:grid nk:rect>local nk:grid-push
"copyright" nk:get "" ?: nk:TEXT_CENTERED "black" nk:label-colored
nk:layout-grid-end
nk:end ;
: app:main
init
' joke-task t:task
new-win ' main-render -1 nk:render-loop ;Itselleni taas, kun pienen tauon jälkeen palasin tähän ohjelmaani JavaScriptillä, niin ongelmia tuottaa tuo taulukosta tietyn avain-arvo-parin tulostus tai käyttö ylipäätään, eli en saa niitä tallennettua tuonne IndexedDB:hen.
Aihe on jo aika vanha, joten et voi enää vastata siihen.