A Stackoverflow és a Google a barátunk, viszont nem mindenki ért angolul. Itt begyűjtök pár hasznos dolgot, ami a weboldal készítésnél hasznos lehet.

XML konvertálása JSON objektummá vagy asszociatív tömbbé PHP-vel

Annak ellenére, hogy a JSON nagyon hódít – nyilvánvaló okok miatt, még mindig nagyon sokan használnak XML formátumokat. Többek között ilyen az RSS feed is, de az egyik legerősebb marketinggel rendelkező bérelhető webshop API-ja is, a ShopRenteré. XML-el dolgozni viszont rémálom a JSON-höz képest. Így hát felmerült a probléma, hogy  valami egyszerű megoldás kellene, ahelyett, hogy minden XML-t végignézek. Olvass tovább…

2017.02.08. 00:45 - legyes

JSON képes MySQL 5.7 telepítése Debian linuxra

A NoSQL hullám nagyon hódít, amivel én nem feltétlenül értek egyet, mert azt vallom, hogy mindent arra kell használni, amire való (azaz adatok tárolására, szűrésére, stb. SQL-t). Az egyik fő indok mellette azt szokott lenni, hogy JSON objektumokat lehet benne tárolni és azokkal lehet dolgozni. Így  kliens oldal eleve készen kapja, nem kell a backenden összerakni és szétszedni újra és újra. Olvass tovább…

2017.02.06. 15:03 - legyes

jQuery: Form serialized $.post, fájlokkal is

Eddig Stackoverflow-ról ellesett serializeObject() függvényt használtam a célra, de jött az az igény, hogy fájlokat is kellene küldeni a postban. Keresgéltem, de vagy szörnyen körülményes vagy félkész megoldásokat találtam csak. Így egyesítettem a találtakat:

<form id="form_new" action="#" enctype="multipart/form-data">
   <input id="szoveg1" name="szoveg1" type="text" />
   <input id="szoveg2" name="szoveg2" type="text" />
   <input id="fajl1" name="fajl1" type="file" />
</form>

Olvass tovább…

2016.11.23. 20:57 - legyes

Facebook megosztás: Nem frissül az előnézeti kép

Aki készített weboldalt és vette rá a fáradtságot, hogy beleássa magát legalább az alapvető SEO-s dolgokba, akkor tudja, hogy a Facebook OpenGraph sémás metaadatokból olvassa fel a megosztáshoz használt adatokat. Fejlesztés, tesztelgetés, optimalizálás közben viszont feltűnhet, hogy hiába írjuk át ezeket az adatokat, a Facebook akkor is azt a képet/címet/leírást teszi be, amit még először adtunk meg neki.

Sajnos ez azért van, mert a Facebook gyorsítótáraz és még a gyórsítótárat is gyorsítótárazza. Állítólag az Expire és a Cache-Control header értékeket veszi figyelembe, de személyes tesztelésem alapján egyáltalán nem érdekli a szokásos weblap beállításoknál, mert túl nagy a (negatív) lejárati idő. A cache értékeket 30 nap után frissíti. Ennek kikényszerítésére a weboldal kódjában nincs lehetőség, csak 2 módszer van:

  1. A Facebook Developers Share Debugger oldalon mi kényszerítjük ki az URL bemásolásával és a “Scrape again” gomb csapágyasra klikkelésével (van, hogy 3x is kell)
  2. A Facebook API-n keresztül kérjük meg szépen

Olvass tovább…

2016.09.29. 23:59 - legyes

Saját megosztás gomb készítése

Azoknak, akik nem szeretik a bigdata szörnyet etetni:

Facebook:

http://www.facebook.com/share.php?u=[URL]&title=[CIM]

Ha az OpenGraph metákat szeretnénk használni, akkor jQuery-vel így tudjuk megoldani:

$('.fb-recommend-link').off('click').on('click', function(){
  try {
    FB.ui({
      method: 'share_open_graph',
      action_type: 'og.likes',
      action_properties: JSON.stringify({
        object: window.location.href,
      })
    }, function(response){});
  }
  catch(e){}
 });

Az action_type lista itt található: https://developers.facebook.com/docs/reference/opengraph/

Twitter:

http://twitter.com/intent/tweet?status=[CIM]+[URL]

Olvass tovább…

2016.09.25. 16:06 - legyes

Firefox selected=”selected” figyelmenkívül hagyás (frissítéskor) bug hack

Most tudtam meg, hogy a Firefoxnak van egy olyan bugja, hogy a selected="selected" attributumot figyelmen kívül hagyja frissítéskor. Az egyik megoldás a stackoverflow szerint, ha minden egyes selectbe teszünk egy autocomplete="off" -ot is.
Némi kísérletezés után erre jutottam, remélhetőleg jól működik mindenhol:


$(document).ready(function(){
   
   $('select option[selected="selected"]').each(function(){
      $(this).closest('select').val( $(this).val() );
   });
  
});

Nem túl szép, tudom.

Valamint egy kis fejléc hack is segíthet:


< ?php
header('Cache-Control: no-store, no-cache, must-revalidate');
header('Cache-Control: post-check=0, pre-check=0', FALSE);
header('Pragma: no-cache');
?>
2016.06.22. 14:14 - legyes

Apache .htaccess konvertálása nginx konfiggá

Nem vagyok kibékülve az indiánnal, mert hihetetlenül zabálja a memóriát. Plusz olyan default beállításai vannak, amik utat nyitnak a hackeléseknek. Továbbá a .htaccess fájlok miatt sok esetben biztonsági kockázatot is jelent.

Nginx párti vagyok, még ha csak Google alapján konfigolom is. Egyre többször találkozom azzal az igénnyel, hogy Apache-ra írt oldalnak kellene működnie nginx alatt. A Winginx oldala a legnépszerűbb ilyen online konverter, de nekem sohasem volt jó, amit dobott. Viszont találtam egy használhatóbbat: http://www.anilcetin.com/convert-apache-htaccess-to-nginx/

2016.03.29. 13:43 - legyes

WordPress érdekesség, avagy miért nem jó ötlet fröccsöntött rendszereket használni

A minap a segítségem kérték, mert egy szerver spammelt, letiltották és azonosítani kellett a baj forrását. Kiderült, hogy feltörtek rajta egy WordPress blogot, és ezzel elég nagy bajt okoztak, ugyanis a WordPress PHP-ja hozzáfért egyéb könyvtárakhoz is, amiben más PHP oldalak futottak.

  1. Első alkalommal valószínűleg egy kép plugin hibát kihasználva base64-ben kódolva feljutott pár PHP fájl. Általában a szokásos dolgokra voltak kihegyezve:
    • teljes adatbázis leképezés, amihez a WordPress felhasználója hozzáfér
    • teljes könyvtárstruktúra leképezés, amihez a WordPress-t futtató PHP hozzáfér
  2. Következő lépésben elrejtett véletlenszerű könyvtárakban PHP fájlokat, amik több funkciót láttak el:
    • önmagukat terjesztették, mint file proxy
    • spam leveleket küldtek
    • webproxy-t hoztak létre
    • egyéb vicces dolgokat “telepítettek” egykattintásos szolgáltatókon hostolt címekről
  3. A legviccesebb lépése pedig az volt, hogy létező (lehetőleg index.php) PHP fájlok első sorába is elhelyezte magát a 11900. oszloptól! A fájlokba belenézve semmi érdekes nincs. De a grep mégis kidobja, hogy ott van benne az eval, sőt magát a kódot is. Nano-ban vagy mceditben az eval-hoz is ugrik, de belenézve nem látni.wordpress_hack2
    find . -name "*.php" -exec grep -H "eval" {} \; | more

    wordpress_hack

 

Update #1:

Közben találtam még egy finomságot:

wordpress_hack3

 

Mi a tanulság? Ha már fröccsöntött motorokat (WordPress, Joomla, Drupal, …) használunk, frissítsünk, amilyen gyakran csak lehet. Igen, ez is WordPress 🙂

Közel 4 óra volt kibelezni a különféle vicces dolgokat művelő PHP-kat a mappákból és még biztosan találni ezt-azt 🙁

Ui.: Most komolyan, mit nem lehet azon érteni, hogy NE HASZNÁLJ eval()-t, soha, semmiben. De főleg abban nem, ami felhasználó által bevihető inputból származik.

Update #2:

Egy kis Joomla hack. Az 1. sor: assets(), a 2. base64_decode() és már ott is az eval :(
Egy kis Joomla hack. Az 1. sor: assets(), a 2. base64_decode() és már ott is az eval 🙁

Kis olvasnivaló: https://www.exploit-db.com/exploits/17602/ és https://forums.digitalpoint.com/threads/wp-hack.2734636/ és https://jordankueh.com/2014/wordpress-remote-code-execution-base64_decode/ és https://jordankueh.com/2014/wordpress-remote-code-execution-base64_decode/ és http://msurowiecki.pl/index.php/inne/106-wordpress-under-attack-april-2013-tips-to-remove-spyware

2016.03.26. 17:38 - legyes

PHP: HTML fájl feldolgozása és manipulálása

Már az elején lelövöm a poént: Ha a PHP saját XML DOM parserét használod, biztosan kevesebb hajad marad a nap végére. A SimpleXML sajnos kevés ehhez, de a csodafegyver itt van: http://simplehtmldom.sourceforge.net/manual.htm .

Történt ugyanis, hogy HTML sablon alaján kell PDF-et generálnom. A sablonban táblázatok vannak formázva ( na itt bukott el a PHP XML DOM osztály, mert piszok kacifántos vele xHTML-t manipulálni ), aminek a formázását meg kellene őrizni, hisz’ ez adja majd a PDF stílusát. De vannak mezők, amik helyére be kell helyettesíteni a megfelelő értékeket.

Olvass tovább…

2016.02.29. 12:52 - legyes

Thai karakter trollkodás

กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิ

A fenti karaktersorozat kb. minden unicode szöveg kiírására alkalmas eszközön problémát okoz. Ráadásul már régóta ismert hibáról van szó. Először akkor kapott hírverést, amikor az iOS eszközökön okozott gondot.

A jól megírt weboldalakon a felhasználók által bevitt stringek szűrve vannak a különböző jellegű támadások miatt: XSS, SQL injection, JS injection és sok helyen figyelnek arra is, hogy a non-printable karaktereket is kigyomlálják a beírtak közül. Viszont a nemzetközi világban nem diszkriminálhatjuk ki az idegen nyelvű írásjeleket, így jön képbe a fenti poén is.

Az a jó, hogy most (2015. július 19.) a Google keresőbe bemásolt fenti string után a Google hibát dob 🙂
Error 400  Bad Request   1

De még a Google Fordító is furán fest tőle:
Google Fordító

A vicc hatástalanítására az egyik egyszerű trükk az, ha a CSS-ben a font-height -nak megfelelően a line-height -ot is beállítjuk. Ilyenkor is “kenődnek” a karakterek, viszont a saját blokkjukból nem mennek tovább. A másik pedig az, hogy kicserélgetjük őket a karakterkódjuk tartománya alapján.

70 pixel magas line-height:

กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิ

 
14 pixel magas line-height:

กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิ

 
14 pixel magas line-height, 2 sorral:

_________________________________
กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิิิิิิ ก้้้้้้้้้้้้้้้้้้้้ ก็็็็็็็็็็็็็็็็็็็็ กิิิิิิิิิิิิิิิ

 

Így néz ki Windows 8.1 alatt, Chrome böngészőben:

Zandagort online stratégiai játék   S11v4beta szerver 2015 07 17 chat log

2015.07.19. 16:11 - legyes

Írjunk magunknak egy bugyuta játékot :)

Régebben szinte függővé tett a Zandagort nevű játék. Egy tökéletes bizonyíték volt arra, hogy a PHP-MySQL-Javascript (AJAX) is képes lehet élhető és élvezhető játékot kiszolgálni. Sajnos mostanság kissé leáldozóban van a csillaga. Kíváncsi voltam, hogy vajon én képes vagyok-e ilyesmit alkotni? Így hát belekezdtem. Nem hiszem, hogy valaha lesz belőle játék, de megtaláltam a tökéletes hobbit azt hiszem. Hátrányai között van sajnos, hogy ezt is a számítógép előtt kell űzni, valamint nincs az a perc, amikor szabadulni lehetne a gondolattól, hogy ez vagy azt hogyan is lehetne megvalósítani?

Mit is tud most? Jelenleg egy számítógép által vezérelt játékost és egy emberit. A számítógép semmit sem csinál, csak véletlenszerűen cirkál saját bolygói között. Az emberi flották az egérrel vezérelhetők: bal klikkel kiválaszt, jobb klikkre cél koordinátára/flottára/bolygóra megy. Agresszív mód esetén nem a cél flotta pozíciójára megy, hanem üldözőbe veszi, amíg utol nem éri. A térkép x időközönként frissíti a pozíciókat, amit MySQL számol ki tárolt eljárással. A szerver oldali időzítés csak késleltetéssel megy, végtelen ciklusban (php: sleep(3);), a kliens oldalon setInterval+jQuery.post kérdezgeti a flották pozícióit. Sajnos még most nem koordináta rendszer alapján tájékozódnak, csak képpontok alapján, de már próbálkozom többféle megoldással a térkép scrollozására:

A nyilakra kattintva (vagy a billentyűzeten nyomkodva a nyíl billentyűket) a háttérkép és az objektumok is x képpontnyit mozdulnak a kívánt irányba. További célok között szerepel, hogy az egérrel és a képernyő szélére pozicionálással is lehessen scrollozni. Ha ez megvan, akkor át kell alakítani képpont alapú pozíciókról, 2D koordináta rendszer alapúra.

Próbálkoztam pár fejlett megoldással a térkép scrollozásra, és nagyon jókat, látványosakat találtam, SVG-vel és egyéb módon megoldva,, zoom lehetőséggel, hasonlóan a Google Mapshoz. De ezek egyenlőre meghaladják képességeimet. A Zandagort fejlesztője segített nekem 2 példával is, de ezt is szerettem volna magam megoldani, így belefogtam a háttérkép eltolás játékba. Itt jegyzem meg, hogy a background-position-x és background-position-y csak a Chrome-ban és IE kompatibilis módban megy, helyette background-position: 100px -50px; van 🙂 .

A háttérkép a Zandagortból, az ikonok ingyenes ikon letöltőhelyekről származnak egyenlőre. A radarkör és a célvonal a Raphael JS bővítmény segítségével működik. De nem is az a lényeg…

2012.11.03. 01:14 - legyes

Az aktuális MySQL okosság #1

Arra adtam a fejem, hogy egy picit bővebben belevetem magam a MySQL-be. Ez nem jelenti azt, hogy enterspájz adatbázisokat optimalizálok, csak picit tovább megyek a “SELECT * FROM tabla ORDER BY RAND()” szinten. Erre igazából azért van szükség, mert úgy gondoltam, hogy összeütök magamnak egy parányi űrstratégiát PHP, MySQL, JavaScript, HTML4 alapon (lásd: www.zandagort.hu). No nem azért, hogy játsszak kicsit, hanem azért, hogy fejlesszem picit képességeimet.

Korábban már használtam az “EXPLAIN” SQL parancsot, utasítások végrehajtási idejének vizsgálatára. Viszont sajnos ez tárolt eljárásra nem működik. Szerencsére a Google ezt dobta:

set profiling=1;
call proc_name();
show profiles;

Forrás: http://stackoverflow.com/questions/5389611/using-explain-for-mysql-stored-procedure-calls

2012.10.31. 08:42 - legyes

MSN időjárás API (?) XML

Kecskeméti aktuális időjárás, és előrejelzés magyarul alább. Azért az MSN és nem a Yahoo/Google/Weatherbug/AccuWeather, mert az MSN tűnt eddig a legpotosabbnak (ami tulajdonképpen Foreca-t használ).

http://weather.msn.com/data.aspx?wealocations=wc:HUXX0008&weadegreetype=C&culture=hu-HU

#Update: http://weather.service.msn.com/data.aspx?wealocations=wc:HUXX0008&culture=hu-HU&weadegreetype=C

Ahol:

A válasz pedig:

<weatherdata>
<weather weatherlocationcode="wc:HUXX0008" weatherlocationname="Kecskemét, Bács-Kiskun" zipcode="" encodedlocationname="Kecskem%c3%a9t%2c+B%c3%a1cs-Kiskun" url="" imagerelativeurl="http://blu.stc.s-msn.com/as/wea3/i/en/" degreetype="C" provider="Foreca" attribution="Adatforrás: Foreca" attribution2="© Foreca" lat="46.9076996" long="19.692606" timezone="2" alert="" entityid="16370">
<current temperature="15" skycode="9" skytext="Szemerkélő eső" date="2012-10-16" day="kedd" shortday="K" observationtime="10:24:00" observationpoint="Kecskemet" feelslike="15" humidity="100"windspeed="7" winddisplay="7 km/h K"/>
<forecast low="8" high="19" skycodeday="39" skytextday="Záporok / derült" date="2012-10-16" day="kedd" shortday="K" precip="98"/>
<forecast low="8" high="17" skycodeday="30" skytextday="Felhős" date="2012-10-17" day="szerda" shortday="Sze" precip="2"/>
<forecast low="8" high="20" skycodeday="32" skytextday="Derült" date="2012-10-18" day="csütörtök" shortday="Cs" precip="2"/>
<forecast low="9" high="21" skycodeday="32" skytextday="Derült" date="2012-10-19" day="péntek" shortday="P" precip="2"/>
<forecast low="6" high="21" skycodeday="32" skytextday="Derült" date="2012-10-20" day="szombat" shortday="Szo" precip="2"/>
<toolbar timewindow="60" minversion="1.0.1965.0"/>
</weather>
</weatherdata>

Vagy a keresőt használva, az aktuális időjárás:
http://weather.service.msn.com/find.aspx?outputview=search&weasearchstr=Kecskemét&weadegreetype=C&culture=hu-HU

<weatherdata>
<weather weatherlocationcode="wc:HUXX0008" weatherlocationname="Kecskemét, Bács-Kiskun" zipcode="" weatherfullname="Kecskemét, Bács-Kiskun" searchlocation="Hetényegyháza, Kecskemét, Bács-Kiskun, Magyarország" searchdistance="0" searchscore="0.95" url="" imagerelativeurl="http://blu.stc.s-msn.com/as/wea3/i/en/" degreetype="C" provider="Foreca" isregion="False" region="" alert=""searchresult="Kecskemét, Bács-Kiskun" lat="46.9054412841797" lon="19.6877193450928" entityid="16370">
<current temperature="15" skycode="11" skytext="Eső"/>
</weather>
</weatherdata>
2012.10.16. 10:01 - legyes
1 2 3