0

Buenas estoy haciendo un contador de corazones, es un detalle para poner en el blog que estoy desarrollando, aparece en la muestra de la noticia.

La idea es que la gente si le gusta le de y se queden memorizados lo likes, de momento tengo el corazón y si cuenta cada vez que se le da, pero claro al actualizar se restaura el contador y tampoco se como hacer para utilizar ese mismo corazón en la demás noticias.

Código corazón:

<div id="contador" class="pull-right"><?php echo $res['like'] ?></div>
<img src="images/blog/heart.svg" id="boton" alt="" class="pull-right">

Script:

var contador = 1;
  var time;
  var on = false;
  var seconds = 0;

  $( "#heart" ).click(function() {
    if(seconds >= 10){
      document.getElementById('contador').innerHTML = contador + 0;
      }else{
      document.getElementById('contador').innerHTML = contador += 1;
      }
          $.ajax({
          url: "getLikes.php",
          type: "post",
          dataType: "html",
          data: {
          'id': id,
          //'contador': contador,
          },
          success: function (resultado){
            $("#resva").html(resultado);
          }
        });
    });

Archivo getLikes:

include "conexion/conexion.php";
$id =$_POST['id'];

$results = "Update noticiasBlog Set like=like+1 where idNoticia= " . 
$_POST['id'];

if ( !mysqli_query($mysqli, $results)) {
  die( 'Error en isercción: ' . mysqli_error() );
}
mysqli_close($mysqli);

Alguna sugerencia GRACIAS...

1

2 respuestas 2

1

Sin meternos en código.


Funcionamiento y componentes de un sistema de *likes*

El funcionamiento previsto de un sistema de conteo de likes asociado a algo, en este caso una noticia será:

  1. Al activarse el botón de like se actualiza el contador, tanto en la interfaz que está viendo el usuario como en el sistema que persiste los datos. Lo que asegura que el número de likes de la noticia queda registrado y se reflejado en el futuro.

  2. Un usuario sólo puede hacer like una vez en una noticia.


Un contador de likes está compuesto básicamente de:

  1. A nivel de interfaz de 1 botón que se le muestra al usuario junto con la noticia.
  2. Un sistema que persista los likes.
  3. Un sistema que comunique el botón que acciona el usuario con el sistema que persiste los datos.

Además de lo anterior, debería existir un sistema intermedio que controle que un usuario no pueda introducir más de un like para una noticia. Esto suele estar controlador gracias a la sesión de usuario, la id de usuario queda asociada a la noticia al hacer like. Si no existe una forma de identificar al usuario pueden prevenirse likes consecutivos, programáticamente, mediante varios mecanismos implementados de forma aislada o combinadamente (cookies, control de IP, etc) pero son mecanismos que pueden ser fácilmente hackeados, son para los espontáneos.


Se controlan los likes que puede hacer un "usuario"

si se controlan los likes que puede hacer un usuario (entendiendo como tal aquel que está autenticado), tendríamos, un diseño de BD (si es relacional) como el siguiente:

introducir la descripción de la imagen aquí

donde la tabla "likes" tiene los campos: id, noticia_id y usuario_id y tiene definido, en la estructura de la tabla: UNIQUE(noticia_id, usuario_id)


Los registros almacenados se verían como:

1 1 1
2 1 2
3 1 4
4 2 4
5 2 1
6 1 7
7 2 2
8 1 9

los "likes vienen" dados por los likes registrados para una noticia.


No se controlan los likes que puede hacer un "usuario"

Si no se controlan los likes del usuario porque éste como tal no está autenticado, solo añadimos un campo "likes" de tipo numérico a la tabla usuarios y lo vamos incrementando cuando corresponda.

Esta es la modalidad en que se establecerán o no, mecanismos de control por IP, cookies, etc.

0

Bueno di con la solución, resulta que la palabra "like" esta reservada para sql y no la podía gastar.

HTML:

<div class="col-12 corrigeEtiquetas">
 <div id="contador" class="pull-right"><?php echo $res['likeS'] ?></div>
 <div id="val" class="pull-right" style="display:none;"><?php echo $res['idNoticia'] ?></div>
 <img src="images/blog/heart.svg" id="heart" alt="" class="pull-right">
</div>

AJAX:

  var contador = 1;
  var time;
  var on = false;
  var seconds = 0;

  $( "#heart" ).click(function() {
    if(seconds >= 10){
      document.getElementById('contador').innerHTML = contador + 0;
      }else{
      document.getElementById('contador').innerHTML = contador += 1;
      }
      $('#heart').attr('src', 'images/blog/heart2.svg');
      $('#heart').css("transition","2s");
      $('#heart').addClass('pulse');
      $('#heart').addClass('animated');
      $('#contador').css("color","#f54645");
      $('#contador').css("transition","0s");

      var id ="";
        if ($("#val").text() !=null){
          id = $("#val").text();
        }

      $.ajax({
          url: "getLikes.php",
          type: "post",
          dataType: "html",
          data: {
          'id': id,
          'contador': contador,
          },
          success: function (resultado){
            $("#resva").html(resultado);
          }
        });
    });

QUERY:

$id =$_POST['id'];
$contador =$_POST['contador'];

$result = null;
//echo "'$id'.'$contador'";
$results = "Update noticiasBlog Set likeS='$contador' where idNoticia= " . $_POST['id'];

if ( !mysqli_query($mysqli, $results)) {
  die( 'Error: ' . mysqli_error() );
}
mysqli_close($mysqli);

Lo que pasa, que necesito que puedan diferenciarse las muestras de las noticias, porque solo le puedo dar al corazón de la primera noticia, y el resto de noticias también llevan el corazón. Y por otro lado lo guarda correcto, pero si le vuelvo a dar empieza desde el dos, si lleva 5 vuelve a empezar desde 2 :(

4
  • Lo que pasa, que necesito que puedan diferenciarse las muestras de las noticias, porque solo le puedo dar al corazón de la primera noticia, y el resto de noticias también llevan el corazón. No comprendo a lo que te refieres. ¿Podrías explicarte mejor? Y por otro lado lo guarda correcto, pero si le vuelvo a dar empieza desde el dos, si lleva 5 vuelve a empezar desde 2 :( El contador que le pasas al PHP se va a reiniciar a 1 cada vez que recargues la página de la noticia. Tienes que hacer lo que te comentaba, sumarle 1 a lo que tenga el campo likeS.
    – phpMyGuel
    el 10 ene. 2019 a las 10:15
  • Vale te explico mejor perdona @PHPMyguel. Tengo dos cuadros que son dos noticias ahora mismo, en cada uno de ellos hay un corazón, ahora solo me funciona el primero, el segundo no. Piensa que es un ciclo while y al tener dos noticias en la bd solo saca dos pero va solo el corazón de una. Referente lo otro de los likes, yo imprimo en en contador la variable que hay en la BD, al darle al corazón suma uno más y ese numero se lo lleva a el UPDATE. Y actualizas y por ejemplo se queda el 5, cual es el problema, que si le vuelvo a dar empieza de nuevo por cero, creo que es por esto: var contador = 1;
    – Miguel
    el 10 ene. 2019 a las 10:27
  • Bien visto @PHPMyguel, like es una palabra reservada. Pero (al otro Miguel): tu consulta no aumenta en 1 el dato. No entiendo cómo dices que lo resolviste así. Ahí lo que hará será asignar a likeS el valor de $contador ¿acaso mantienes un contador aparte? Sería más sencillo aumentar en 1 el valor actual.
    – A. Cedano
    el 10 ene. 2019 a las 10:53
  • La función click que tienes asociada al elemento con ID heart solamente afectará a uno de los corazones. Recuerda que el ID debe ser único por lo que si tienes dos elementos con el mismo ID la función solamente afectará a uno de ellos. Puedas usar una clase en vez de una ID.
    – phpMyGuel
    el 10 ene. 2019 a las 11:09

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.