Arxiu de l'autor: admin

Autocompletar

Publicat el per

flux

Usuari tecleja → onkeyup= cercar_bd(); → AJAX envia ‘cercar’ → PHP te dades+cercar, processa i retorna #resultats → JavaScript mostra el resultat

Tot el procés de consulta es fa de manera asincrònica a través d’AJAX, la qual cosa permet que la pàgina no es recarregui completament i els resultats es mostrin dinàmicament sense interrupcions. Això fa que l’experiència de l’usuari sigui més fluida.

Estructura

/autocompletar
│── /css
│   ├── style.css
│── /js
│   ├── script.js
│── index.html
│── cercar.php
│── db_config.php

cercar.php


if (isset($_POST['cercar'])) {
    $paraula = $conn->real_escape_string($_POST['cercar']);
    error_log("Paraula rebuda: " . $paraula); // Registra la paraula rebuda per la crida AJAX

    $sql = "SELECT catala FROM catala_iec WHERE catala LIKE '$paraula%' LIMIT 5";
    $result = $conn->query($sql);

    $respostes = array();
    
    if ($result->num_rows > 0) {
        while ($row = $result->fetch_assoc()) {
            $respostes[] = htmlspecialchars($row['catala']);
        }
    } else {
        $respostes[] = "No s'han trobat resultats.";
    }
    
    // Retornem les dades en format JSON
    echo json_encode($respostes);
    error_log("Resposta JSON enviada: " . json_encode($respostes)); // Registra la resposta enviada en format JSON
}

$conn->close();
?>



index.html

<!DOCTYPE html>
<html lang="ca">
<head>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>Autocompletar</title>
    <link rel="stylesheet" href="styles.css">
    <script src="js/jquery.min.js"></script>
</head>
<body>

    <h1>Cercador & autocompletat</h1>

    <!-- Formulari de cerca -->
    <form id="cercaForm" method="POST" action="cercar.php">
        <div class="search-container">
            <input 
                type="text" 
                id="cercar"
                name="cercar" 
                onkeyup="mostrarAutocompletar()" 
                placeholder="Cerca..." 
                autofocus
            >
            <button type="submit">Cercar</button>
        </div>
    </form>

    <!-- Contenidor de l'autocompletat -->
    <div id="resultats_autocompletar_container">
        <ul id="resultats_autocompletar">
            <!-- Resultats dinàmics via JavaScript -->
        </ul>
    </div>
   
    <script src="js/scripts.js" defer></script>
</body>
</html>

CSS

body {
    font-family: Arial, sans-serif;
    text-align: center;
    margin: 50px;
}

input {
    padding: 10px;
    width: 300px;
    font-size: 16px;
    margin-bottom: 10px;
}

#resultats {
    margin-top: 20px;
    border: 1px solid #ddd;
    width: 300px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    padding: 10px;
}

js/script.js (AJAX per a la cerca)

$(document).ready(function () {
    $("#cercar").on("keyup", function () {
        var paraula = $(this).val();
        console.log("Tecla premuda: " + paraula);

        if (paraula.length > 0) {
            $.ajax({
                url: "cercar.php",
                type: "POST",
                data: { cercar: paraula },
                success: function (resposta) {
                    console.log("Resposta AJAX rebuda");
                    var resultats = JSON.parse(resposta);
                    var htmlResultats = resultats.map(function (item) {
                        return "<li class='resultat'>" + item + "</li>";
                    }).join("");
                    $("#resultats_autocompletar").html(htmlResultats);
                },
                error: function () {
                    console.error("Error en la crida AJAX.");
                }
            });
        } else {
            $("#resultats_autocompletar").html(""); // Esborra els resultats si no hi ha text
        }
    });

    // Afegir esdeveniment de clic per als elements de resultat
    $(document).on("click", ".resultat", function () {
        var paraulaSeleccionada = $(this).text();
        console.log("Paraula seleccionada: " + paraulaSeleccionada);
        $("#cercar").val(paraulaSeleccionada);
    });
});

db_config.php

<?php
$host = "localhost";
$user = "root";       // Canvia-ho si cal
$pass = "beseit00";           // Canvia-ho si cal
$dbname = "polidic_cat"; // Nom de la teva BD

$conn = new mysqli($host, $user, $pass, $dbname);

// Comprovar la connexió
if ($conn->connect_error) {
    die("Error de connexió: " . $conn->connect_error);
}
?>

Interacció entre HTML, JavaScript (JS), AJAX i PHP

Publicat el per

HTML -> JavaScript (JS) -> AJAX <-> PHP

El flux d’interacció seria així:

  • Es capturen els esdeveniments d’usuari amb onkeyup.
  • Es crida la funció cercar_bd() de JavaScript, que obté el valor de l’entrada de text i realitza una crida AJAX al fitxer PHP (prova.php).
  • El fitxer PHP processa la sol·licitud, pot interactuar amb la base de dades i retorna una resposta.
  • La resposta del servidor és gestionada per la funció success d’AJAX i es pot mostrar o utilitzar segons sigui necessari.
function cercar_bd() {   
    var cercar = $("#cercar").val(); // Obtenir el valor de l'entrada de text
    alert('Valor de cercar: ' + cercar);    
}

Capsa Replicadora

Publicat el per

Aquest tipus d’entrada s’han de fer com HTML

<!DOCTYPE html>
<html lang="ca">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Capsa Replicadora</title>
    <link rel="icon" href=".ico" type="image/x-icon">
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: flex-start;
            background-color: #f0f0f0;
            min-height: 100vh;
        }
        .container {
            background-color: rgb(213, 225, 225);
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            width: 80%;
            max-width: 800px;
            margin-top: 50px;
            box-sizing: border-box;
        }
        h1 {
            text-align: center;
            color: #333;
        }
        p {
            margin: 5px 0;
            color: #444;
        }
        .input-wrapper {
            width: 50%;
            margin: 0 auto 10px auto; /* Centra les entrades */
        }

        /* Responsivitat per a dispositius petits */
        @media (max-width: 600px) {
            .container {
                width: 90%;
                margin-top: 30px;
            }
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>Capsa Replicadora</h1>
        
        <div class="input-wrapper">
            <label for="cercar">Cercar:</label>
            <input type="text" id="cercar" name="cercar" autofocus onkeyup="replicarText()">
        </div>
        <div class="input-wrapper">
            <label for="replicar">Replicar:</label>
            <input type="text" id="replicar" name="replicar">
        </div>
    </div>
    <script>
        function replicarText() {
            //alert('entra a replicar');
            var cercarInput = document.getElementById('cercar');
            var replicarInput = document.getElementById('replicar');
            replicarInput.value = cercarInput.value;
        }
    </script>
</body>
</html>

$_GET[‘dic’] i $_GET[‘lang] per passar informació a un formulari (dintre de la mateixa carpeta)

Publicat el per

Per recollir les variables $_GET['dic'] i $_GET['lang] de la informació passada a través del navegador, podeu utilitzar el següent codi PHP:

<?php
// Recollir les variables del GET
$diccionari = isset($_GET['dic']) ? $_GET['dic'] : 'No definit';
$llenguatge = isset($_GET['lang']) ? $_GET['lang'] : 'No definit';

// Mostrar les variables
echo "El diccionari és: " . htmlspecialchars($diccionari) . "<br>";
echo "El llenguatge és: " . htmlspecialchars($llenguatge);
?>

per example si al navegador veiem: 192.168.1.41/poli/BD_conexions/conexio_diccionari_bd.php?dic=catala_castella&lang=cat

Al formulari que mostra les variables podem llegir:

El diccionari és: catala_castella
El llenguatge és: cat

$idioma = isset($_GET[‘lang’]) ? $_GET[‘lang’] : ‘cat’;

Aquesta instrucció és una forma concisa de definir una variable $idioma en funció de si el paràmetre lang existeix a l'URL. Això es fa utilitzant l'operador ternari, que és una alternativa compacta al condicional if-else. Aquí tens com funciona pas a pas:

isset($_GET['lang']):

Verifica si existeix el paràmetre lang a l'URL. Si l'usuari accedeix a la pàgina amb un enllaç del tipus index.php?lang=eus, llavors isset($_GET['lang']) tornarà true.

$_GET['lang']:

Si el paràmetre lang existeix (és a dir, isset($_GET['lang']) és true), el valor d'aquest paràmetre s'assignarà a $idioma. Per exemple, si l'URL és index.php?lang=eng, el valor de $idioma serà 'eng'.

: 'cat':

Si el paràmetre lang no existeix (és a dir, isset($_GET['lang']) és false), el valor per defecte 'cat' (català) s'assignarà a $idioma.

Python per llegir qualsevol àrea de text de Polidic

Publicat el per

Sí, pots utilitzar Python per llegir qualsevol àrea de text del teu diccionari i convertir-lo a veu utilitzant biblioteques de text a veu com pyttsx3 o gTTS.

Aquí tens un exemple de com podries fer-ho amb la biblioteca pyttsx3:

Primer, instal·la la biblioteca pyttsx3: pip install pyttsx3.

import pyttsx3
from bs4 import BeautifulSoup

# Exemple de contingut HTML amb una àrea de text
html_content = """
<textarea id="myTextarea">Aquest és un text d'exemple que vull convertir a veu.</textarea>
"""

# Analitzar el contingut HTML
soup = BeautifulSoup(html_content, 'html.parser')

# Trobar l'àrea de text pel seu id
textarea = soup.find('textarea', {'id': 'myTextarea'})

# Llegir el contingut de l'àrea de text
if textarea:
    text_content = textarea.get_text()
    
    # Inicialitzar el motor de text a veu
    engine = pyttsx3.init()
    
    # Configurar les propietats de la veu (opcional)
    voices = engine.getProperty('voices')
    engine.setProperty('voice', voices[0].id)  # Selecciona la veu
    
    # Convertir text a veu
    engine.say(text_content)
    engine.runAndWait()
else:
    print("No s'ha trobat l'àrea de text.")

Això llegirà el contingut de l'àrea de text identificada pel seu id i el convertirà a veu. Pots adaptar aquest codi per llegir àrees de text del teu diccionari i convertir el text a veu.



Estructura del projecte Polidic

Publicat el per
Respon 
// Includes inicials
include_once('inicia_variables_sessio.php')
require('func.php'); 
---------------------------
<body>
    <!-- Inclou el menú -->
    <?php include_once('mes_taules_lang.php'); ?>
    <?php include_once('menu.php'); ?>

Estructura del projecte Polidic
<?php
/*
Estructura
/project/
│
├── index.php
|   ├── <body>:mes_taules_lang.php(include)
|   ├── <body> include'menu.php' ( necesita
|        la variable  $mes_taules_lang ->
|        a  $_GET[lang])|   
|  
├──inicia_variables_sessio.php
├── 
├── func.php
├── styles.css
├── images/
│
├── js/
│   ├── scripts.js !-- Gestiona el menú sandwich $_GET[lang];
│   ├── jquery.min.js
│   └── tiny.js
├── admin.php
|   └── ($_SESSION['admin']=1 retornar a admin)
├──Inicia.php
    ├──//reseteja SESSION i redirigeix a index.php
    ├──header('Location: /polidic/');
    └──($_SESSION['admin']=1 retornar a admin)

Busquedes d’Auto-compleció

Publicat el per

“suggeriments automàtics” o “auto-compleció”. Aquest mètode es pot implementar en cercadors de diccionaris i altres aplicacions web per a oferir suggeriments mentre l’usuari escriu.

Per crear aquest efecte, pots utilitzar JavaScript amb una base de dades que contingui les paraules i les seves definicions. Aquí tens un exemple bàsic utilitzant JavaScript i HTML:

<!DOCTYPE html>
<html>
<head>
  <title>Auto-compleció</title>
  <style>
    .suggestions {
      border: 1px solid #ccc;
      max-height: 150px;
      overflow-y: auto;
      position: absolute;
      background-color: white;
    }
    .suggestion-item {
      padding: 10px;
      cursor: pointer;
    }
    .suggestion-item:hover {
      background-color: #ddd;
    }
  </style>
</head>
<body>
  <input type="text" id="search" placeholder="Escriu per cercar..." oninput="showSuggestions(this.value)">
  <div id="suggestions" class="suggestions"></div>

  <script>
    const dictionary = ['calamar', 'calamarsa', 'calamarsada', 'calamarsejar', 'calamar', 'calamars'] // Afegeix més paraules aquí
    
    function showSuggestions(query) {
      const suggestionsContainer = document.getElementById('suggestions');
      suggestionsContainer.innerHTML = ''; // Neteja les suggeriments anteriors
      if (query.length > 0) {
        const filteredWords = dictionary.filter(word => word.startsWith(query));
        filteredWords.forEach(word => {
          const suggestionItem = document.createElement('div');
          suggestionItem.textContent = word;
          suggestionItem.className = 'suggestion-item';
          suggestionItem.onclick = () => selectSuggestion(word);
          suggestionsContainer.appendChild(suggestionItem);
        });
      }
    }

    function selectSuggestion(word) {
      const searchInput = document.getElementById('search');
      searchInput.value = word;
      document.getElementById('suggestions').innerHTML = ''; // Neteja les suggeriments després de seleccionar una
    }
  </script>
</body>
</html>

Executar un script Python des de PHP:

Publicat el per

Executar un script Python des de PHP:

<?php
// Executa un script Python i captura la seva sortida
$output = shell_exec('python3 script.py');
echo "Sortida de Python: " . $output;
?>

Contingut de script.py

print("Hola des de Python!")

Aquest metode permet fer projecte mitjans amb Python?

Aquest mètode permet integrar Python amb PHP i pot ser molt útil per a projectes mitjans. Utilitzant aquest mètode, pots aprofitar les capacitats de Python per a tasques específiques mentre utilitzes PHP per gestionar la interfície web i altres funcionalitats del servidor.

Alguns casos d’ús comuns:

  • Anàlisi de dades: Utilitza Python per realitzar anàlisis de dades complexos i presenta els resultats a través d’una interfície web construïda amb PHP.
  • Machine Learning: Executa models de Machine Learning amb Python i mostra els resultats en una pàgina web PHP.
  • Automatització de tasques: Utilitza scripts Python per automatitzar tasques com l’enviament de correus electrònics, la generació d’informes, etc.
  • Gestió de fitxers: Utilitza Python per a la manipulació avançada de fitxers, com ara la lectura, l’escriptura i el processament de dades, i gestiona la interfície amb PHP.

Consideracions:

  • Rendiment: Assegura’t que els scripts Python no s’executin durant massa temps per evitar bloquejos o retards en la resposta del servidor web.
  • Seguretat: Verifica que els scripts Python no tinguin vulnerabilitats de seguretat i que només acceptin dades segures des del client.
  • Depuració: Utilitza eines de depuració adequades per a ambdós llenguatges per assegurar-te que pots identificar i solucionar errors ràpidament.

1 Punts clau per executar Python des de PHP

Executa això al terminal per assegurar-te que Python funciona correctament:

C:\Users\urqte\AppData\Local\Programs\Python\Python313\python.exe C:\AppServ\www\python\script.py

Si funciona aquí, però no des de PHP, el problema és Apache o PHP.

2 Configura script.py (Sortida en UTF-8)

import sys
sys.stdout.reconfigure(encoding='utf-8')  # Garanteix que la sortida sigui UTF-8

print("Content-Type: text/html; charset=utf-8\n")
print("Hola des de Python!")
print("Versió de Python:", sys.version)

3 Executa Python des de PHP

Assegura’t que el teu python.php té la ruta correcta i forci UTF-8:

<?php
header('Content-Type: text/html; charset=utf-8'); // Assegura UTF-8
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);

$python_path = 'C:\\Users\\urqte\\AppData\\Local\\Programs\\Python\\Python313\\python.exe';
$script_path = 'C:\\AppServ\\www\\python\\script.py';

$command = escapeshellarg($python_path) . ' ' . escapeshellarg($script_path) . ' 2>&1';
$output = shell_exec($command);

$output = mb_convert_encoding($output, 'UTF-8', 'auto'); // Converteix a UTF-8 per si de cas
echo "Sortida de Python: <br>" . nl2br($output);
?>

4 Comprova que shell_exec() està habilitat

Executa això en un arxiu PHP (test.php):

<?php
if (function_exists('shell_exec')) {
    echo "✅ shell_exec() està habilitat!";
} else {
    echo "❌ shell_exec() ESTÀ DESACTIVAT! Habilita’l a php.ini.";
}
?>

5️⃣ Reinicia Apache i esborra la memòria cau

Després de fer canvis a php.ini o httpd.conf, reinicia Apache

PHP al llarg del anys

Publicat el per

PHP ha experimentat moltes millores significatives des de la seva creació fins a l’actualitat. Aquí tens un resum de les millores més destacades a través dels anys:

PHP 4 (2000)

  • Zend Engine 1: Millorat el rendiment i la gestió de la memòria.
  • Sessions: Introducció de la gestió de sessions.
  • Objectes i classes: Millor suport per a la programació orientada a objectes (OOP).

PHP 5 (2004)

  • Zend Engine 2: Millorat encara més el rendiment i la gestió de la memòria.
  • XML i Web Services: Suport millorat per XML i serveis web.
  • Namespaces: Introducció de namespaces per evitar col·lisions de noms.
  • Anonymous Functions: Suport per a funcions anònimes i closures.

PHP 5.3 (2009)

  • Namespaces: Millorat el suport per a namespaces.
  • Funcions anònimes: Suport per a funcions anònimes.
  • Funcions de fitxer: Suport per a funcions de fitxer.

PHP 5.6 (2014)

  • Expressions constants: Suport per a expressions constants.
  • Desempaquetat d’arguments: Suport per a desempaquetar arguments en les funcions.

PHP 7.0 (2015)

  • Tipus escalars: Declaracions de tipus escalars.
  • Rendiment: Major millora de rendiment, podent manejar el doble de sol·licituds per segon.
  • Tipus de retorn: Declaracions de tipus de retorn.

PHP 7.4 (2019)

  • Propietats tipades: Suport per a propietats tipades.
  • Separador numèric sota línies: Introducció del sota línies com a separatòr numèric.

PHP 8.0 (2020)

  • Tipus de unió: Suport per a tipus de unió.
  • JIT (Just-In-Time): Compilador JIT per millorar el rendiment.
  • Propietats de constructors: Promoció de propietats de constructors.

PHP 8.1 (2021)

  • Enums: Suport per a enums.
  • Fibres: Suport per a fibres.
  • Tipus d’intersecció: Suport per a tipus d’intersecció.

PHP 8.2 (2022)

  • Classes de nomès lectura: Suport per a classes de només lectura.
  • DNF tipus: Suport per a DNF tipus.
  • Tipus per a null, fals i cert: Suport per a tipus específics per a null, fals i cert.

PHP 8.3 (2023)

  • Propietats redactades: Suport per a redacció de propietats sensitives.
  • Extensió aleatòria: Nova extensió aleatòria.

PHP 8.4 (2024)

  • Propietats de només lectura: Suport per a propietats de només lectura.
  • Millorat el rendiment: Continuació de millores de rendiment.

PHP ha evolucionat molt des de la seva primera versió, convertint-se en una eina poderosa i versàtil per a la desenvolupament web. La comunitat PHP també ha jugat un paper important en aquesta evolució, oferint suport i innovació contínua.

*PHP (Hypertext Preprocessor) va ser creat l’any 1995 per Rasmus Lerdorf. Originalment, es va desenvolupar com a eina per gestionar el seu currículum en línia, però amb el temps va evolucionar fins a convertir-se en el llenguatge de programació web que coneixem avui.

Hi ha alguna altra cosa sobre PHP que t’agradaria saber?

El popular lloc de xarxes socials va ser inicialment desenvolupat en PHP actualment quin llenguate utilitza?

Facebook, inicialment desenvolupat en PHP, ha evolucionat significativament i ara utilitza una combinació de llenguatges per a diferents parts de la seva plataforma. Els llenguatges més utilitzats actualment a Facebook inclouen:

  • Hack: Una extensió de PHP que ofereix tipus estàtics i millors eines de desenvolupament.
  • Python: Utilitzat per tasques de processament de dades i aprenentatge automàtic.
  • Java: Utilitzat per a aplicacions empresarials i serveis backend.
  • C++: Utilitzat per a parts crítiques de rendiment.
  • Erlang: Utilitzat per a serveis de xarxa i comunicacions.
  • JavaScript: Utilitzat per a la interfície d’usuari i aplicacions web dinàmiques.

Aquesta diversitat de llenguatges permet a Facebook mantenir una plataforma robusta, escalable i eficient.

Python s’utilitza a Facebook per a diverses tasques clau. Aquí tens algunes de les aplicacions principals de Python en la infraestructura de Facebook:

  1. Processament de Dades:
  • Facebook recull enormes quantitats de dades dels usuaris, i Python s’utilitza àmpliament per processar, analitzar i extreure informació útil d’aquestes dades.
  • Llibreries com Pandas, NumPy i SciPy són utilitzades per a l’anàlisi de dades i el càlcul científic.
  1. Aprenentatge Automàtic (Machine Learning):
  • Python és molt popular en el camp de l’aprenentatge automàtic gràcies a les seves potents llibreries com TensorFlow, PyTorch i scikit-learn.
  • Facebook utilitza Python per desenvolupar i desplegar models d’aprenentatge automàtic que milloren l’experiència de l’usuari, com ara recomanacions personalitzades i detecció de contingut inadequat.
  1. Infraestructura de Serveis:
  • Python s’utilitza per escriure microserveis i altres components de backend que ajuden a gestionar i mantenir la infraestructura de la plataforma.
  • Frameworks com Flask i Django poden ser utilitzats per desenvolupar aquests serveis.
  1. Automatització i Scripts:
  • Python és ideal per a tasques d’automatització, com la gestió de servidors, la distribució de recursos i el desplegament de codi.
  • Scripts de Python s’utilitzen per automatitzar tasques rutinàries i millorar l’eficiència dels desenvolupadors.
  1. Anàlisi de Xarxes Socials:
  • Python permet analitzar patrons de comportament i interacció entre usuaris a Facebook, utilitzant llibreries com NetworkX per a l’anàlisi de xarxes.

Aquestes són algunes de les formes principals en què Python s’aplica a Facebook. La seva flexibilitat i potència fan que sigui una eina valuosa en molts aspectes del desenvolupament i manteniment de la plataforma.

Si tens alguna altra pregunta o necessites més informació, estic aquí per ajudar-te! ?