Rating von Bildern - Angehensweise

mrfogel · 21. August 2014

Hallo Community,

ich würde gern, auf meiner Seite eine Art Bildrating implementieren.
Nichts großartiges, es sollen Bilder angezeigt und man soll sie mit + oder - bewerten können.

So sieht es im Moment aus. Ich lass die Bilder der letzten 7 Tage einfach auswerfen.

PHP

<?php
require "db_connect_test.php";




//Selects only data not older than one week
$img = mysqli_query($con, "SELECT id, link, title FROM images WHERE upload_date BETWEEN CURRENT_TIMESTAMP - INTERVAL '7' DAY AND CURRENT_TIMESTAMP ORDER BY id");




while ($row = mysqli_fetch_array($img)) {
	echo "<h4>" . $row['title'] . "</h4><img src="" . $row['link'] . "" title="" .  $row['title'] . "" alt=""><br />";
}
?>

Alles anzeigen

Nun denke ich, wenn ich unter jedem Bild 2 Buttons haben will, die jeweils das Rating in der DB erhöhen oder verringern, werde ich um AJAX ja nicht drum rumkommen, wenn ich nicht immer die Seite neu laden will.

Ich will jetzt keinen fertigen Code, aber mir fehlt irgendwie der Ansatz, wie ich das logisch angehen sollte? Lass ich jetzt direkt über das PHP-Script auch immer die Formularbuttons erstellen? Und wo/wie bastel ich das AJAX rein?

Könnte mir da jemand Starthilfe geben?^^

wolf · 21. August 2014

Beim echo im while gibst du noch einfach zwei buttons aus

PHP

echo: '
    <button class="act-btt" data-act="+" data-id="'.$deineBildId.'">Like</button>
    <button class="act-btt" data-act="-" data-id="'.$deineBildId.'">Dislike</button>
';

Dann kannst du mit JS oder JQ(uerry) alle elemente mit der klasse »act-butt« beim kliken abfangen, ihre »data-id« auslesen und ihre »data-act« und dann über ajax die id und positiv oder negativ an ein phpscript senden und dieses in der db das ganze vermerken lassen

EDIT:
Wie du die datan ausliest kannst du in diesem Beitrag ganz unten mit JQ sehen oder recht weit oben und etwas umständlicher mit normalem JS von Cotton
Einkaufsliste App jQuery / HILFE !

Das mit ajax, dazu hat theScout in den letzten Tagen ein 'tutorial' hier im Forum gepostet

EDIT2:
Ja Lool man merkt das ich grad seit Stunden im CSS rumpfusch, ich schreib schon echo:

mrfogel · 21. August 2014

Vielen Dank für deine Antwort.
Dann war mein erster Gedanke ja gar nicht mal so verkehrt.

Nun habe ich auch mehr oder weniger die Logik dahinter verstanden. Das Tutorial werd ich mir in nächster Zeit mal zu Gemüte führen.
Ich meld mich dann, obs funktioniert hat oder nicht

cottton · 21. August 2014

Du solltest via ajax aber aufpassen, dass Du eine Identifikation des Nutzers vornimmst, wenn nur Registrierte Benutzer voten dürfen.
Wenn "Gast" voten darf, dann solltest Du klären, wie oft er auf das jeweilige Bild voten darf.

Vom Sinn her sollten nur Reg. Nutzer voten dürfen.
Als Gast kann man immer wieder eine Neue Identität annehmen (IP, cookie oder localStorage(-löschen)).

Wie:
per PHP erstellst Du di Button (zB wie wolf schon schrieb).
Dabei hast Du sicherlich festgestellt, ob der Nutzer existiert und eingeloggt ist.

(jetz kommt was falsches)
Nun könntest Du die User_id mitgeben, um diese via Ajax an den Server zu identifikation zu senden.
Aber: via "Bruteforce" könnte jemand sämmtliche möglichen IDs an diese Adresse senden und ... naja.

(richtig)
einen ident erstellen, den man nicht "erraten" kann:
via PHP stellst Du fest: user ist eingeloggt.
Nun erstellst Du eine Session:

PHP

$ident = getRandomStr();
$_SESSION['ajax_ident'] = $ident; 
 
function getRandomStr($length=13){
    return substr(
        str_shuffle(
            'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$%^&*()_-=+;:,.?'
        )
        ,0,$length
    );
}

Alles anzeigen

$ident schreibst Du mit in JS/HTML, dmait es dort verfügbar ist. Via Ajax sendest Du diese id dann mit, damit Du auf der Serverseite via PHP prüfen kannst,
ob der User existiert - also:

PHP

if(isset($_POST['ajax_ident'])and isset($_SESSION['ajax_ident'])and $_POST['ajax_ident'] == $_SESSION['ajax_ident']){
    // ok
}else{
    // nicht ok
}

Besser wäre wohl ein Cookie, denn die SESSION ist ja nach x min Untätigkeit weg.
(btw: eine SESSION wird bei jedem Ajax-Aufruf erneuert)

mrfogel · 21. August 2014

Vielen Dank auch dir Cotton.

Im Grunde hast du recht, dass eigentlich nur registrierte Benutzer voten sollten. Aber eigentlich waren auf der Seite keine registrieten Benutzer vorgesehen.
Das Rating ist von der Semantik auch nicht sehr wichtig. Es dient eigentlich nur dazu die Bilder später nach Beliebtheit zu ordnen. Daher denke ich, ist es auch nicht weiter schlimm, wenn ein Gast mehrmals für ein Bild votet, sollte er denn seine IP ändern oder die Cookies löschen.

Zudem kommt noch hinzu, dass ich in PHP erst seit ein paar Wochen drin bin und mir Sachen wie Cookies etc. erstnoch anschauen muss
Und von meiner Ahnung über Ajax will ich erst gar nicht anfangen

wolf · 21. August 2014

Naja dann solltest du auch keine registrierung erfordern.
Schreib lieber einfach mit JS ein cookie mit der BildId beim benutzer rein und prüfe vorm ajax aufruf ob das cookie schonmal existiert und wenn ja dann einfach kein ajax aufruf starten..

Rating von Bildern - Angehensweise

Jetzt mitmachen!

Teilen