Wstęp

Wyobraźmy sobie sytuację, w której użytkownik wchodzi na naszą stronę aby pobrać jakieś dane. Skrypt szybciutko łączy się z bazą i przekazuje mu je najszybciej jak to możliwe. Założenia naszego systemu wymagają jednak, aby każde działanie użytkownika było logowane do bazy. Normalnie połączenie użytkownik->skrypt pozostałoby otwarte, co skutkowałoby tym, że musiałby on bezsensownie czekać na zakończenie działania programu. To jest tylko przykładowa sytuacja, ale są i takie, w których skrypt po wysłaniu odpowiedzi musi się jeszcze wykonywać nawet przez dobre parę sekund. Rozwiązanie, które wam zaprezentuje rozwiąże ten problem.

Sytuacja pierwsza – skrypt zwraca użytkownikowi dane

Skorzystamy tutaj z możliwości PHP do buforowania danych wyjścia. Kluczem do zaoszczędzenia cennego czasu jest tutaj wysyłanie odpowiednich nagłówków, które powiedzą przeglądarce, czy i w którym momencie ma zamknąć połączenie/zakończyć ładowanie strony. Na początek kod:

<?php
// otwieramy bufor
ob_start();
// tutaj przetwarzamy i wyświetlamy wszystkie dane

// pobieramy wielkość bufora
$wielkoscOdpowiedzi = ob_get_length();

// wysyłamy nagłówki mówiące przeglądarce o zamknięciu połączenia
header("Content-Length: $wielkoscOdpowiedzi");
header('Connection: close');
header('Content-Encoding: none');
// wysyłamy dane z bufora
ob_end_flush();
ob_flush();
flush();

// zamykamy obecną sesję
if (session_id()) session_write_close();
//proces który leci sobie dalej w tle
sleep(10);
?>

Teraz małe objaśnienie. Na początku otwieramy bufor, wszystkie dane jakie potem wyślemy w nim lądują, następnym krokiem jest pobranie rozmiaru bufora, aby potem przekazać przeglądarce po ilu bajtach może skończyć ładowanie strony. Potem wysyłamy wszystkie nagłówki, w tym momencie należy pamiętać, że w tym przykładzie kompresja gzip musi być wyłączona. Jest to spowodowane faktem, że normalnie kompresja następuje po wykonaniu skryptu, co skutkuje różnicą pomiędzy wielkością przesyłanych danych a zadeklarowanym rozmiarem w nagłówku Content-Length. Kolejnym krokiem jest wysłanie całej zawartości bufora oraz zamknięcie sesji dla danego pliku tak aby nie nastąpiła interferencja, kiedy użytkownik będzie przeglądał dalej stronę podczas gdy skrypt nie zakończy jeszcze swojego działania. I teraz najlepsze, cała praca skryptu wykonywana po tych działaniach będzie miała miejsce tak jakby „w tle” i nie będzie już odczuwalna dla użytkownika. Warto dodać ignore_user_abort(true); na początku skryptu, co uczyni go niewrażliwym na zatrzymanie poprzez kliknięcie przycisku STOP w przeglądarce.

Sytuacja druga – skrypt nie zwracający żadnych danych

Tutaj sytuacja wygląda prościej i nie wymaga „przemeblowywania” kodu. Jeśli skrypt nic nie wyświetla podczas wykonywania a chcemy uzyskać taki sam efekt jak najszybszego uruchomienia programu i zamknięcia połączenia wystarczy na początku skryptu dodać:

header("HTTP/1.0 204 No Content");

Spowoduje to natychmiastowe zakończenie połączenia przez przeglądarkę/cURL/fsockopen przy dalszym wykonywaniu skryptu. Bajecznie prosta metoda, której warto używać zawsze wtedy, kiedy nie przekazujemy nic do przeglądarki.

Podsumowanie

To będzie na tyle moich dzisiejszych wypocin Mam nadzieje, że te dwa sposoby pozwolą wam na tworzenie jeszcze bardziej rozbudowanych a mimo to jeszcze szybszych serwisów.

Pozdro!

Sposób pierwszy – CSS3

Jak wiadomo, najnowsza wersja arkuszy stylów pozwala na uzyskanie krągłości na naszej stronie. Aby to zrobić wystarczy nadać danemu elementowi odpowiedni selektor, np. klasę a następnie dodać mu poniższe style:

-khtml-border-radius: 10px / 10px;

-webkit-border-radius: 10px / 10px;

-moz-border-radius: 10px / 10px;

border-radius: 10px / 10px;

Dla wyjaśnienia, pierwsza wartość to szerokość zaokrąglenia, z kolei wartość po slash’u „/” definiuje jego wysokość. W tym wypadku godna polecenia jest strona CSS Border Radius Generator dzięki której wpisując odpowiednie wartości w pola przy rogach możemy na bieżąco obserwować kształt boków a następnie skopiować cały kod CSS.

Zalety

• Wymaga niewielkich zmian w kodzie,
• Używa najnowszych rozwiązań.

Wady

• Rozwiązanie obsługiwane tylko przez najnowsze przeglądarki.

Sposób drugi – HTML i CSS

Według mnie to całkiem ciekawe rozwiązanie, z którego korzysta chociażby iGoogle. Na tą metodę natrafiłem na blogu Piotra Nalepy w artykule [CSS] Zaokrąglone rogi bez używania obrazków, tam również dostępne jest demo Nie wdając się w szczegóły powiem tylko, że jest to jedna z najlepszych i najbardziej kompatybilnych metod.

Zalety

• Działa na wszystkich graficznych przeglądarkach www,
• Nie wymaga włączonej obsługi JavaScript.

Wady

• Wymaga ingerencji w strukturę strony.

Sposób trzeci – jQuery Corner

Jak się można łatwo domyślić metoda ta wykorzystuje popularną bibliotekę JavaScript jQuery. Plugin pochodzi od twórcy znanego jQuery Cycle. Jego użycie jest banalnie proste, wystarczy do pliku html dołączyć bibliotekę jQuery, plik z pluginem i wywołać metodę:

$('#kanciasty').corner(rodzaj_rogu);


Gdzie #kanciasty to selektor elementu jakiemu chcemy zmienić rogi a rodzaj_rogu to jeden z typów krawędzi. Masę dem, oraz rodzajów rogów znajdziecie na stronie projektu. Warto również zauważyć, że nie musimy ograniczać się tylko do zaokrągleń, opcji do wyboru jest mnóstwo.

Zalety

• Działa na wszystkich graficznych przeglądarkach www,
• Ogromna ilość wariacji i to dla każdego boku jednocześnie,
• Nie wymaga ingerencji w kod strony.

Wady

• Nie działa przy wyłączonej obsłudze JavaScript,
• Przy bardziej wymyślnych kształtach zaśmieca kod.

Sposób czwarty – DD_roundies

Nie będę się tutaj zbytnio rozpisywał. DD_roundies, jest to biblioteka, która korzysta z VML obsługiwanego przez IE oraz czystego JavaScript. Więcej o tej metodzie możecie przeczytać na blogu batman’a:  Rubensowskie kształty na stronie, czyli o zaokrąglaniu rogów słów kilka. Znajdziecie tam również proste demo.

Zalety

• Działa na wszystkich graficznych przeglądarkach www,
• Nie wymaga jQuery,
• Stosuje rozwiązanie adekwatne do możliwości przeglądarki,
• Nie wymaga ingerencji w kod strony.

Wady

• Nie działa przy wyłączonej obsłudze JavaScript.

To już wszystkie sposoby jakie chciałem wam przedstawić. Oczywiście nie są to wszystkie, brakuje chociażby metody obrazkowej, ale chciałem pokazać te według mnie najlepsze i najefektywniejsze

Przypuśćmy, że posiadamy następujący kod html:

<div style="float:left">Blok float'owany</div>
<div>Tego już nie chcemy opływać.</div>

Normalnie w takim przypadku większość programistów wstawiłaby po pierwszym bloku następny, ze stylem clear:both. Istnieje jednak łatwiejsza metoda.

W tym rozwiązaniu skorzystamy skorzystamy z pseudoklasy :after, żeby automatycznie wstawić za element z atrybutem float niewidoczną treść która nam wszystko ładnie wyclearuje.

Kod wygląda następująco:

<style type="text/css">

  .clear:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }

.clearfix {display: inline-block;}  /* hack dla IE pod Mac'iem */

</style>
<!--[if IE]>  /* Hack dla IE */
<style type="text/css">
  .clear {
    zoom: 1;
    display: block;
  }</style>
<![endif]-->

Teraz wystarczy do naszego div’a z ustawionym float dodać klasę .clear a powyższy kod doda za nim niewidzialną kropkę, która całkowicie rozwiąże problem zbędnych znaczników. Jedynym minusem jest wątpliwa obsługa tego kodu pod starszymi przeglądarkami, nawet pomimo zastosowanych przeze mnie hacków. No ale jeśli cały czas będziemy się oglądać do tyłu to nie pójdziemy na przód, takie życie

Blokowanie dostępu do całej strony

Na początek zajmiemy się całkowitym zablokowaniem strony, tak aby nikt nie mógł jej otworzyć. Aby to zrobić, wystarczy utworzyć plik .htaccess z poniższym kodem:

Order allow,deny
Deny from all

Następnie umieszczamy nasz pliczek w katalogu root’a. Jeśli nasz serwer obsługuje .htaccess to po wejściu na naszą stronę powinniśmy otrzymać błąd 403(access denied).

Jeśli chcielibyśmy udostępnić naszą stronę tylko osobom o danym ip to wystarczy zmienić nasz plik na:

Order allow,deny
Allow from 101.102.103.104
Deny from all

Dzięki temu wyłącznie osoba o ip podanym powyżej będzie mogła przeglądać witrynę.

Blokowanie dostępu do folderów

W tym wypadku, efekt jaki chcemy uzyskać to uniemożliwienie dostępu do wybranych przez nas folderów. Możemy to zrobić za pomocą dyrektywy <Directory>.

Aby dzięki niej zablokować dostęp do folderu o nazwie wazne_pliki umieszczamy plik z poniższym kodem w roocie:

<Directory /wazne_pliki/>
Deny from all
</Directory>

Blokowanie dostępu do pojedynczych plików

Za powyższe odpowiedzialna jest z kolei dyrektywa <Files>. Składnia jest identyczna, przykład z zabezpieczeniem pliku .htaccess, o czym wielu programistów często zapomina:

<Files .htaccess>
Deny from all
</Files>

To tyle, mam nadzieję, że mój post się komuś przyda i tradycyjnie zapraszam do komentowania