Weboldal készítés, internetes alkalmazások fejlesztése

Weboldal költöztetés - új szerver ideiglenes elérése

Amikor egy weboldalt költöztetünk egyik szolgáltató szerveréről a másik szolgáltató szerverére, akkor lesz egy rövid időszak, amikor már szeretnénk látni az új helyen lévő rendszerünket (hogy működik-e rendesen, jól csináltuk-e az adatbázisok létrehozását, fájlok másolását).

A probléma az, hogy ilyenkor a valami.hu domain név még a régi szerveren lévő tartalmát mutatja, hisz a domain ip címe még oda mutat.

Ilyenkor azt tudjuk tenni, hogy megnyitjuk a C:\Windows\System32\Drivers\etc mappában található "host" nevű fájlt (notepad++ tökéletes a megnyitásra), és a végére beírjuk az alábbi bejegyzést:

94.199.178.222 valami.hu
94.199.178.222 www.valami.hu

Ezzel a bejegyzéssel arra utasítjuk a win 10-et, hogy a domain név előtti ip címet keresse fel, és az ottani fájlokat futtassa. Amint elmentjük ezt a fájlt, és böngészőben megnyitjuk a valami.hu domaint, az új helyen lévő tartalmat fogjuk látni.

Fontos, hogy amennyiben már befejeztük a tesztelést, a host fájlt módosítsuk vissza az eredeti állapotára.

Mysql adatbázisba rögzítés esetén szükség lehet a rögzített adat egyedi azonosítójára, ami általában az adatbázis tábla elsődleges kulcsa, egy autoincrement érték ("id" az általánosan használható név erre, de ezt mindenki maga dönti el.).

Tehát menjen egy sor beszúrás az adatbázisba:

Az adatbázis tábla szerkezete legyen ez:

- id

- varos

- orszag

$mysql = mysqli_connect($hostName, $username, $password, $databaseName); -> kapcsolódunk az adatbázishoz

$adat_tarolas = "INSERT INTO tabla (id, varos, orszag) VALUES (NULL, 'Stuttgart', 'Németország')"; -> adatok meghatározása
$adat_tarolas1 = mysqli_query($mysql, $adat_tarolas); -> adatok tárolása

$uj_adat_azonosito = mysqli_insert_id($mysql)); -> új adatsor azonosítójának lekérdezése

 A mysqli_insert_id() függvénnyel az új adatsor "id" értékét kérdezzük le.

Ha Joomshaper sablont használ valaki weboldalán, akkor előfordulhat, hogy egy menüpont szerkesztésénél az edmin felületen hibaüzenettel találkozik. A hibaüzenet ez:

Cannot Use Object Of Type StdClass 

A következőt kell tenni:

A joomla fájlok között keresd meg a /plugins/system/helix3/helix3.php fájlt

Ezt kell szerkeszteni egy kicsit:

 

A 25. sor környékén van ez a rész:

$doc = JFactory::getDocument();
$plg_path = JURI::root(true).'/plugins/system/helix3';
JForm::addFormPath(JPATH_PLUGINS.'/system/helix3/params');


Ez után kell beszúrni ezt a kódrészletet:

if (is_object($data)) {
$data = (array)$data;
}


Mentsd el a fájlt, írd felül a szerveren és már kész is!

$tomb = array();

//tegyük egy tömbbe az adatbázisból lekérdezett adatokat

//adatbázis lekérdezés...
while {
	$tomb[] = array(
	'adat1'=> $lekerdezes['adat1'],
	'adat2'=> $lekerdezes['adat2'],
	'adat3'=> $lekerdezes['adat3'],
	'adat4'=> $lekerdezes['adat4']
	);	
}

//Azt a tömb elemet kell meghatározni, amely szerint rendezni akarjuk a tömböt, itt az adat3 lesz a rendezési elv
$rendezes = array_column($tomb, 'adat3');

//Tömb új sorrendbe állítása
array_multisort($rendezes, SORT_ASC, $tomb);

//És most listázzuk ki a sorba rakott tömb tartalmát
for($i=0;$i<$rekordok_szama;$i++)
{
	$tomb[$i]['adat1']
	$tomb[$i]['adat2']
	$tomb[$i]['adat3']
	$tomb[$i]['adat4'] 
}

A Tinymce 5 html editor letölthető itt:

http://download.tiny.cloud/tinymce/community/tinymce_5.0.3.zip

A magyar nyelvi fájl letölthető itt:

https://www.tiny.cloud/get-tiny/language-packages/

Telepítés:

A letöltött editor fájlokat tömörítsd ki, majd másold fel a weboldalad gyökerébe, pl. tinymce mappába (almappa már ne legyen).

A weboldalad <head></head> szekciójába tedd be az editor működéséhez szükséges fájl elérési útját. Ha a fenti fájlt töltötted le, akkor valahogy így néz ki ez a sor:

<script src='tinymce/js/tinymce/tinymce.min.js'></script>

Ezután ugyanebbe a részbe kell tenni az editor konfigurációját meghatározó bejegyzéseket, mint az eszköztár, a mérete, kép feltöltéshez szükséges adatok...

<script>
  tinymce.init({
    selector: '#textarea_teljes', //a form textarea ezt az id-t kell, hogy kapja
		language: 'hu_HU', //alapértelmezett nyelv
		
        //kép feltöltésekor a teljes elérési útvonalat rögzíti (abszolut url). Ennek akkor van jelentősége, ha emailben kell kiküldeni egy képet tartalmazó szöveget
        relative_urls : false, 
		remove_script_host : false,
		convert_urls : true,
        
		images_upload_url: 'postAcceptor.php', //a kép kezelését végző fájl
		images_upload_base_path: '/kepek', //a képeket tartalmazó mappa a gyökérhez képesti útvonal
		images_upload_credentials: true,
    
		plugins: 'image code anchor link fullscreen insertdatetime media wordcount visualchars',
    toolbar: 'undo redo | styleselect | bold italic | image code anchor link alignleft aligncenter alignright forecolor backcolor fullscreen insertdatetime media wordcount visualchars',
		
		width: 700,
		height: 500,
    menubar: 'file edit insert view format table tools help',
		//Itt pedig a kép feltöltését kezelő kódsorok vannak:
		images_upload_handler: function (blobInfo, success, failure) {
		var xhr, formData;
		xhr = new XMLHttpRequest();
		xhr.withCredentials = false;
		xhr.open('POST', 'postAcceptor.php');
		xhr.onload = function() {
			var json;

			if (xhr.status != 200) {
			failure('HTTP Error: ' + xhr.status);
			return;
			}
			json = JSON.parse(xhr.responseText);

			if (!json || typeof json.location != 'string') {
			failure('Invalid JSON: ' + xhr.responseText);
			return;
			}
			success(json.location);
		};
		formData = new FormData();
		//A következő sorban a fileName(blobInfo) helyett blobInfo.filename()
		formData.append('file', blobInfo.blob(), fileName(blobInfo));
		xhr.send(formData);
		}
  });
  </script>

Nyelv telepítése:

A fent letöltött nyelvi fájlt tömörítsd ki, és másold a tinymce\js\tinymce\langs\ mappába. A fájl neve hu_HU.js lesz.

És akkor jöjjön a form:

<form method="post">
<textarea id="textarea_teljes" name="uj_leiras"> </textarea> //az id értéke ugyanaz, amit fent megadtunk az editor configjában
<input type="submit" value="Mehet" />
</form>

A képek feltöltéséhez kell egy feltöltést kezelő külső fájl, aminek a nevét ugyancsak meghatároztuk már fent, az a fájl a postAcceptor.php. A fájl tartalma pedig:

/*A kép feltöltés csak az itt meghatározott domainekre engedélyezett*/
  $accepted_origins = array("http://localhost", "http://192.168.1.1", "http://example.com");

  /*A feltöltendő képekk mappája a gyökérhez képest*/
  $imageFolder = "kepek/";

  reset ($_FILES);
  $temp = current($_FILES);
  if (is_uploaded_file($temp['tmp_name'])){
    if (isset($_SERVER['HTTP_ORIGIN'])) {
      // a fenti domainek érvényesek csak, ha nincs megadva a működési hely fent, akkor nem engedélyezi a feltöltést
      if (in_array($_SERVER['HTTP_ORIGIN'], $accepted_origins)) {
        header('Access-Control-Allow-Origin: ' . $_SERVER['HTTP_ORIGIN']);
      } else {
        header("HTTP/1.1 403 Origin Denied");
        return;
      }
    }

    // bemeneti fájlnév struktúrájának ellenőrzése
    if (preg_match("/([^\w\s\d\-_~,;:\[\]\(\).])|([\.]{2,})/", $temp['name'])) {
        header("HTTP/1.1 400 Invalid file name.");
        return;
    }

    // A kiterjesztés ellenőrzése (tuti kép legyen)
    if (!in_array(strtolower(pathinfo($temp['name'], PATHINFO_EXTENSION)), array("gif", "jpg", "png"))) {
        header("HTTP/1.1 400 Invalid extension.");
        return;
    }

    // A célmappa, és a fájl eredeti nevének változóba tétele
    $filetowrite = $imageFolder . $temp['name'];
    move_uploaded_file($temp['tmp_name'], $filetowrite);

    
    echo json_encode(array('location' => $filetowrite));
  } else {
    // Szerver hiba eseteén a válasz
    header("HTTP/1.1 500 Server Error");
  }

Hogy lehet megjeleníteni karakterkódot weboldalon

A karakterkódok & jelből és további karakterekből állnak ;-vel lezárva. Pl. a < jelnek ez a karakter kódja: &lt;

Viszont ha leírod a &lt; jelet, rögtön a < fog megjelenni a böngészőben.
Ezért szét kell bontani ezt a karakterkódot, és a & jel helyett is egy karakterkódot kell alkalmazni.
A & jel karakterkódja: & a m p ; (természetesen szóközök nélkül)
Tehát a < karakterkódot így kell leírni, hogy valóban kódként jelenjen meg: & a m p ; l t ; (természetesen szóközök nélkül)

preg_match() - Karakter keresése stringben

a preg_match függvénynél a keresett karaktereket slash, vagy [] közé kell tenni. A mögötte lévő i karakter azt jelzi, hogy nem érzékeny a keresés a kis/nagy betűkre.

$valtozo_neve = 'torolt elem';
if(preg_match('[torolt]i', $valtozo_neve))

substr() - sztring darabolás, a függvény egy szöveg részletét adja vissza.

A függvénynek meg kell adni, hogy mi az alap sztring, annak hányadik elemétől vagyunk rá kíváncsiak, és opcionálisan megadhatjuk a kívánt karaktersorozat hosszát is.

$rest = substr('abcdef', 1, 3);  // eredmény: bcd
$rest = substr('abcdef', 0, 4);  // eredmény: abcd
$rest = substr("abcdef", 0, -1);  // eredmény: "abcde"
$rest = substr("abcdef", 2, -1);  // eredmény: "cde"
$rest = substr("abcdef", 4, -4);  // eredmény: false
$rest = substr("abcdef", -3, -1); // eredmény: "de"

A strip_tags() függvény eltávolítja a html cimkéket, a második részben írt kivételekkel

Itt a kérdés az, hogy engedjük-e az űrlapot kitöltő felhasználónak, hogy html kódokat alkalmazzon, vagy nem.
A függvény: strip_tags($valtozo, '<b>,</b>')
Ebből: <div style="width:150px"><b>Mókuska</b></div>
Ez lesz: <b>Mókuska</b>

A htmlentities() függvény a minden olyan karaktert átalakít, melynek létezik karakterkódja.

Az ENT_QUOTES paraméter azt jelenti, hogy az idézőjelet, és az aposztrofot is átalakítja
A függvény: htmlentities($valtozo, ENT_QUOTES);
Ebből: <idézőjel:" & aposztrof:'>
Ez lesz: &lt;id&eacute;zőjel:&quot; &amp; aposztrof:&#039;&gt;

A htmlspecialchars() függvény a ", ', &, < és > karaktereket kódolja át karakterkódokra.

Az ENT_QUOTES paraméter azt jelenti, hogy az idézőjelet, és az aposztrofot is átalakítja.
  A függvény: htmlspecialchars($valtozo, ENT_QUOTES);
Ebből: <idézőjel:" & aposztrof:'>
Ez lesz: &lt;idézőjel:&quot; &amp; aposztrof:&#039;&gt;

A mysqli_real_escape_string() függvény az SQL injekció nevű támadás ellen próbál védelmet adni.

Backslash-t tesz az olyan karakterek elé, meyek megváltoztatnák az eredeti programsor értelmét. Az adatbázisba írás előtt is szükséges ezt a függvényt alkalmazni, mert pl '-jelet (aposztrof) nem igazán lehet adatbázisba írni.
A függvény: mysqli_real_escape_string($mysql,$valtozo); A $mysql itt az adatbázis kapcsolódás változója.
Ebből: <idézőjel:" & aposztrof:'>
Ez lesz: <idézőjel:\" & aposztrof:\'>

Weboldal URL:

Ha egy oldal több címen is elérhető, akkor meg kell adni, hogy a google melyik címet tekintse fő (gyűjtő) oldalnak. Pl. a fromme.hu elérhető ezen a két címen:

https://www.fromme.hu/index.php

és

https://www.fromme.hu/

Mivel mindkét címen ugyanaz a tartalom érhető el, a google számára ez tartalom duplikálást jelent, és az kerülendő. Adjuk meg a head részben, hogy mi melyik címet tekintjük gyűjtő címnek:

<link rel="canonical" href="https://www.fromme.hu/"/>

Másik, gyorsabb megoldás, ha a .htaccess fájlban létrehozunk egy 301-es átirányítást, amely átlövi az oldalt az index.php-ról, az index.php nélküli url-re

Ezt a tartalmat szúrd be a .htaccess fájlba:

#index.php-s verzióról átirányítás az index.php nélkülire, hogy ne legyen tartalom duplázás a googlenál
#ez a gyorsabb megoldás, de jó az is, ha a head részben megadjuk a canonical url-t: 
#az első sorban azért kell pontosan megadni az url-t, mert ha tartalomkezelő oldalról van szó, akkor az alkönyvtárban lévő admin rendszert nem fogja elindítani
RewriteCond https://www.oldalad-pontos-cime.hu/index\.php? [NC]
RewriteRule ^(.*/)?index\.php?$ /$1 [R=301,L]

robot.txt:

A robot.txt fájlban meg kell adni az oldaltérkép fájl nevét, elérési útját.
Sitemap generálható pl. itt: https://www.xml-sitemaps.com/
Sitemap: https://www.oldalad-pontos-cime.hu/sitemap.xml

H(1,2,3,4) tagek

Adatbázis lekérdezés ciklusába beszúrt dinamikus változónév
$szamlalo=0;
//adatbázis lekérdezés...
{
	$szamlalo++;
	${'telefon_'.$szamlalo} = $lekerdezes['adat'];
}
echo $telefon_1;
echo $telefon_2;
echo $telefon_3;
echo $telefon_4;
echo ...amennyi lekérdezési eredmény van

A ckeditor html szerkesztő letöltése:

https://ckeditor.com/ckeditor-4/download/ (Ki kell választani, hogy melyik verzió kell.)

A ckeditor beüzemelése:

Ezután a letöltött fájlt ki kell csomagolni és a ckeditor mappát (nincs további ckeditor mappa, csak az editor fájlszerkezete) el kell helyezni a szerveren, a head szekcióban pedig meg kell adni a ckeditor elérési útját:

script src="/ckeditor/ckeditor.js"

ha ez is megvan, akkor már csak a html editort tartalmazó form-ot kell létrehozni az alábbi módon:

textarea id="editor1" rows="20" name="mod_modul_leiras"
script alatta:CKEDITOR.replace( 'editor1' );

Karakterek átalakításának megakadályozása

Annak érdekében, hogy a magyar karaktereket ne alakítsa át speciális karakterekké, a ckeditor gyökerében található config.js fájlt kell módosítani. Az alábbi tartalom csak a kódolás megelőzésére szolgál:

CKEDITOR.editorConfig = function( config ) {
	CKEDITOR.config.basicEntities = false;
	CKEDITOR.config.entities = false;
	CKEDITOR.config.entities_greek = false;
	CKEDITOR.config.entities_latin = false;
	CKEDITOR.config.htmlEncodeOutput = false;
	CKEDITOR.config.entities_processNumerical = false;
};

ckeditor hibaüzenet spec. tartalom mentése esetén:

AmikorChrome böngészőben ckeditort használva elküldünk egy űrlapot (a ckeditorba beszúrtunk egy iframe-et, pl youtube filmet), akkor a chrome hibaüzenettel elérhetetlenné teszi az oldalt. A hibaüzenet: ERR_BLOCKED_BY_XSS_AUDITOR

Erre az a megoldás, hogy arra az oldalra letiltjuk az XSS védelmet az alábbi módon:

Header('X-XSS-Protection: 0');

Az ezzel foglalkozó oldalak kiemelik, hogy az Xss védelem egy fontos biztonsági megoldás, nem szabad a teljes weboldal szerkezetnél élni ezzel a lehetőséggel!

Weboldal lassan jelenik meg

Csak akkor jelenik meg az oldal, ha szerver oldalon a teljes weboldal előállításra került

Előállhat olyan helyzet, amikor egy sok lekérdezést végrehajtó oldal csak nagyon lassan jelenik meg. Ennek oka a szerver beállítása, ugyanis a szerver csak akkor küldi vissza a böngésző felé a teljesített kérést, amikor azzal teljesen elkészült.

A felhasználó csak vár és vár, miközben a szerver a háttérben ezerrel dolgozik. A felhasználó "jobban érezné magát", ha az oldal rögtön elkezdene megjelenni, és elemenként, soronként állna össze.

A szerver beállításokra sok esetben nincs hatásunk, viszont néhány szerver beállítás módosítható .htaccess segítségével. Ennél a helyzetnél segíthet rajtunk a szerver tömörítés (gzip) letiltása.

Helyezzük el az alábbi sort a .htacces fájlunkba, a RewriteEngine On után:

RewriteRule ^(.*)$ $1 [NS,E=no-gzip:1]

Amennyiben nem az egész domainre akarjuk érvényesíteni ezt a változtatást, akkor meg kell határoznunk, hogy melyik alkönyvtárra vonatkozzon a szabály:

A fenti sor ekkor két soros lesz:

RewriteCond %{REQUEST_URI} "/almappa_neve/"
RewriteRule ^(.*)$ $1 [NS,E=no-gzip:1]

A .htaccess szerverre másolásával az eredmény azonnal érzékelhető.

1. oldal / 2

Szolgáltatások

Weboldal készítés - Szombathely

Internetes alkalmazások fejlesztése

Keresőoptimalizálás - SEO

Domain, tárhely

frommeweb

Adatkezelési tájékoztató

Weboldal készítés kapcsolat

info@fromme.hu

36703346491

alpoktrans.hu - atriumhaz-szombathely.hu - novadom.hu - caffewest.com - cery.hu - betonlab.hu - kapuvaribringaut.hu - cargoprofil.hu - perfektfehernemu.hu - csehimindszenti-iskola.hu - designtheworld.hu - egyetemi-menza.hu - foldmeres-dunantul.hu