Cela se produit à cause des limitations de PHP (upload_max_filesize, post_max_size, max_execution_time).

La solution : utiliser la ligne de commande MySQL.

1. Ouvrez votre terminal

• macOS / Linux : ouvrez Terminal

• Windows (MAMP/XAMPP) : utilisez CMD, PowerShell, ou Git Bash

2. Allez dans le dossier où se trouve votre fichier .sql

Exemple :

Vérifiez que votre fichier est présent :

Vous devriez voir votre fichier, par exemple ma-bdd.sql.

3. Identifier la configuration MySQL

Tapez la commande :

Vous verrez quelque chose comme :

? Retenez ces deux infos :

• Socket : /Applications/MAMP/tmp/mysql/mysql.sock

• Port : 8889 (si MAMP, sinon par défaut 3306)

4. Vérifier que MySQL est démarré

Si vous ne voyez pas mysqld, démarrez le serveur :

• Via MAMP : cliquez sur Start Servers

• Via Homebrew :

5. Tester la connexion MySQL

Deux façons de se connecter :

Avec le socket :

Avec l’adresse IP et le port :

Entrez le mot de passe (par défaut root sur MAMP).

6. Créez la base de données (si elle n’existe pas)

Avant d’importer :

7. Importer la base de données

Placez-vous dans le dossier où se trouve ma-bdd.sql, puis :

Explications :

• root ? utilisateur MySQL

• -p ? demande le mot de passe

• -h 127.0.0.1 ? connexion via TCP

• -P 8889 ? port (MAMP = 8889, sinon 3306)

• ma-bdd ? nom de la base

• ma-bdd.sql ? fichier à importer

8. Vérifier l’import

Connectez-vous ensuite :

Puis :

Astuce bonus : suivre la progression avec pv

Pour les très gros fichiers, installez pv (pipe viewer) :

Puis :

Section Windows (MAMP ou XAMPP)

1. Ouvrir l’invite de commande MySQL

Avec MAMP ou XAMPP, les exécutables MySQL se trouvent dans leur dossier respectif :

• MAMP : C:\MAMP\bin\mysql\bin\

• XAMPP : C:\xampp\mysql\bin\

Ouvrez CMD, puis déplacez-vous dans ce répertoire :

2. Importer la base

La commande complète :

• Si vous utilisez XAMPP, remplacez le port par 3306 (par défaut) :

Pour réparer l'erreur, repérer la ligne fautive et la commenter (un commentaire dans un fichier .htacces se fait avec un dièse "#" en début de ligne), ou supprimer carrément le fichier .htacces s'il ne contient pas d'informations essentielles.
 

$tableau = array(
"un", // indice commence alors par 0
"deux",
"trois",
"quatre",
"cinq"
);

OU on force l’indice du tableau a commencer par 1

$tableau = array(
1 => "un", // pour commencer de 1 au lieu de 0 ...
"deux",
"trois",
"quatre",
"cinq"
);

foreach($tableau as $valeur)
{
 echo "$valeur<br>";
}

Cette boucle affiche l’index et le valeur de chaque élément du tableau $tableau

 foreach($tableau as $cle => $valeur)
{
 echo "$cle : $valeur<br>";
} 

Cette boucle affiche les chiffres de 2 à 19

for ($i=2; $i<20; $i++) {
    echo $i;
}

in_array() ou Vérifier qu’une valeur est présente dans un tableau (retourne un boolean):

$tab = array("droite", "gauche");

if(in_array("gauche", $tab)) {
    echo 'La gauche existe !!';
}
// Dans notre cas, affiche: La gauche existe !!

body {
cursor: pointer;
}

Les valeurs par défaut étant : pointer, auto, help, wait, crosshair, not-allowed, zoom-in, grab

Vérifier la validité de l’URL avec les expressions régulières :

$monUrl= "http://memo-web.fr";
if (preg_match('#^(http|https)://[w-]+[w.-]+.[a-zA-Z]{2,6}#i', $monUrl))
{
    echo "Mon URL est valide";
}else{
    echo "MonURL n'est pas valide";
}

On vérifie avec les expressions régulières que la chaîne $monUrl commence par ‘http://’ ou ‘https://’ et l’on vérifie qu’elle se termine par un point suivi de 2 à 6 lettres.

Vérifier la validité de l’URL avec filter_var

La fonction PHP filter_var permet de filtrer une variable passée en paramètres à l’aide de différents filtres, l’un deux FILTER_VALIDATE_URL est concu pour filtrer les URL de protocole http

Si la variable n’a pas passé le filtre, la valeur de retour est vide.

$monUrl = "http://memo-web.fr";
$monUrl = filter_var($monUrl, FILTER_VALIDATE_URL);
if ($monUrl!='')
{
    echo "Mon URL est valide";
}else{
    echo "MonURL n'est pas valide";
}

Installez le Add-on Web Developper sur votre navigateur Firefox https://addons.mozilla.org/en-US/firefox/addon/web-developer/

Une fois installé, dans la barre d’outil du plugin, sélectionnez le menu « Information » > « View Document Outline » pour avoir l’illustration de la hierarchisation de votre page.

=importXml("https://www.google.com/search?q=site:http://memo-web.fr&num=100&start=1"; "//cite")

Cela vous listera les URLs des 100 premières pages indexées.

Vous pourrez ensuite récupérer les suivantes en changeant le paramètre start.

On peut remplacer cette fonction sous IE par la fonction attachEvent 

function addEventMultiBrowsers(event, elem, func) {
   if (elem.addEventListener)  // Si le navigateur prend en charge addEventListener
      elem.addEventListener(event,func,false);
   else if (elem.attachEvent) { // Sinon (cas IE < 9)
      elem.attachEvent("on"+event, func);
   }
}

Remarquez que le nom de l’évément passé en paramètre pour addEventListener doit être nommée sous la form click, mouseover, keydown, keypress … tandis que pour attachEvent, ses mêmes évenements doivent être nommés onclick, onmouseover, onkeydown, onkeypress .

Dans notre fonction nouvellement créée addEventMultiBrowsers, on choisi le premier formalisme et l’on rajoute « on »+event 

Exemple d’utilisation :

var mon_element = document.getElementById('mon_div');
addEventMultiBrowsers(mon_element, 'mouseover', function() {
    alert ("Vous avez survolé l'élément d'identifiant mon_div !");
});

Pour cela il convient d'ajouter 2 fichiers au répertoire dont vous souhaitez limiter l'accès : .htaccess et .htpasswd.

Dans l'exemple suivant, nous supposeront que nous voulons restreindre par mot de passe, l'acc« es au répertoire admin de notre site Internet.

Fichier .htaccess apellant un fichier .htpasswd

AuthUserFile /home/monsite/admin/.htpasswd 
AuthName "Accès réservé" 
AuthType Basic 
<Limit GET POST> 
require valid-user 
</Limit>

AuthUserFile  doit comprendre le chemin absolu vers votre fichier .htpasswd.
Pour connaitre ce chemin, créez un fichier temporaire, que vous nommerez path.php, insérez le code ci après :

<?php echo realpath('path.php'); ?>

et placez le fichier path.php dans votre répertoire /admin et enfin appelez le depuis votre navigateur pour récupére la valeur du chemin absolut; 

Fichier .htpasswd

Créez le fichier .htpasswd et placez le dans le répertoire /admin. Ce fichier contiendra une liste de couple identifiant/mot de passe qui permettront aux utilisateurs de visiter le dossier admin.

Apparence de votre fichier .htpasswd :

identifiant1:mot-de-passe-crypte1
identifiant2:mot-de-passe-crypte2

Il existe pléthore de services en ligne pour crypter vos mot de passe, en voici un exemple.

Se déconnecter d'une connexion par .htpasswd

J'ai mis un moment avant de trouver la technique, cela dit, on se déconnecte automatiquement dès que le navigateur est fermé (Attention pas seulement la fenêtre du navigateur)

L'astuce consiste à créer un fichier deconnexion.php que l'on peut appeler via un lien depuis l'un des fichiers du répertoire admin.
Le fichier deconnexion.php redemande en fait les identifiants de connexion à l'utilisateur, puis le redirige vers la page de votre choix.

<?php
    header('WWW-Authenticate: Basic realm="Accès réservé"');
    header('HTTP/1.0 401 Unauthorized');
    echo '<script type="text/javascript">
             window.location.href = "http://monsite.php";
          </script>';
    exit();
?>

Télécharger le logiciel calibre

Cliquez sur le menu "Ajoutez des livres" et sélectionnez votre fichier pdf.

Sélectionnez sur le livre que vous venez d'ajouter et cliquez sur le menu "convertir les livres"

Une fenêtre apparaît qui vous permet de paramétrer les principales données de votre Ebook (titre nom d'auteur, editeur…)  format d'entrée (en haut à gauche), format de sortie (en haut à droit : .MOBI, .EPUP etc ..). J'ai choisi le format .EPUB 

Valider pour convertir votre document .pdf en .epub

Vous voyez alors apparaître votre livre dans la liste, sélectionnez le et clickez droit pour l'enregistrer dans un répertoire à part sous le  format .EPUB.

Ceci est la première partie mais votre livre électronique nécessitera encore certainement de nombreux ajustements avant d'avoir une forme correcte.

Lire le livre électronique avec Sigil

Pour ouvrir le livre que vous venez de créer sous format .epub, téléchargez le logiciel Sigil grâce auquel vous pourrez structurez votre livre. 

Dans la fenêtre de gauche vous trouverez la structure de votre livre, ouvrez les fichiers contenus dans le répertoire text pour avoir accès au contenu du livre. Utilisez la boîte à outils pour hierarchiser votre livre avec des titres de différents niveaux (h1, h2, h3) qui vous permettront ultérieurement de créer chapitres et sous-chapitres. Vous avez aussi la possibilité de faire des liens, mettre en gras, indenter le texte ….

Créer une table des matières avec Sigil 

Créez une table de matières avec le menu "Outil" > "Table of content" > "Generate".
C'est une étape indispensable pour permettre à l'utilisateur de naviguer facilement dans un livre éllectronique.

Grossières estimations :

• Une image pèse entre quelques ko et quelques Mo.
• Un film pèse entre plusieurs centaines de Mo et quelques Go

Formulaire de conversion d’octets

A noter que j’ai utilisé le plugin JQuery joliSelect pour styliser l’élément HTML Select.

Fichier form-octet.html :

Conversion d'octets : 
<form method="POST" action="">
  <input id="valeur_octet" type="text"/>
  <select id="unite_octet">
     <option value="1" >o</option>
     <option value="2" selected="selected">Ko</option>
     <option value="3">Mo</option>
     <option value="4">Go</option>    
  </select>
  <div id="calcul_octet">Calculer</div>
  <div id="resultat"></div>
</form>

Code Javascript :

<script type="text/javascript">
$(document).ready( function () {
$("#calcul_octet").click(function() {
   $.ajax({
      url      : "octet.php",    
      data     : {valeur_octet : $("#valeur_octet").val(), unite_octet : $("#unite_octet").val()},
      cache    : false,
      dataType : "json",
    error : function(request, error) { // Info Debuggage si erreur        
   alert("Erreur : responseText: "+request.responseText);
      },
      success: function(data) {  
           if (data.valeur_o > 0)     
             $("#resultat").html(data.valeur_o + ' octet(s) <br/> '+
                                           data.valeur_ko + ' ko <br/> '+
                                           data.valeur_Mo + ' Mo <br/> '+
data.valeur_Go + ' Go <br/> ' );
          
        }
     });
  });
  });
</script>

Code PHP (octet.php) :

  if (isset($_REQUEST['valeur_octet'])){
    $valeur=$_REQUEST['valeur_octet'];
  }else $valeur=0;
  $unite= $_REQUEST['unite_octet'];
   $result_o  ='';
   $result_Ko ='';
   $result_Mo =''; 
   $result_Go ='';
  switch ($unite)
{
    case 1:
   $result_o   = $valeur;  
      $result_Ko = 1/bcpow(2, 10)  * $valeur;
   $result_Mo = 1/bcpow(2, 20) * $valeur;
      $result_Go = 1/bcpow(2, 30) * $valeur;
   break;
    case 2:
      $result_o   = bcpow(2, 10) * $valeur;
      $result_Ko = $valeur;
   $result_Mo = 1/bcpow(2, 10) * $valeur;
      $result_Go = 1/bcpow(2, 20) * $valeur;
      break;
    case 3:
      $result_o   = bcpow(2, 20) * $valeur;
      $result_Ko = bcpow(2, 10) * $valeur;
   $result_Mo = $valeur;
      $result_Go = 1/bcpow(2, 10) * $valeur;
      break;
case 4:
      $result_o   = bcpow(2, 30) * $valeur;
      $result_Ko =  bcpow(2, 20) * $valeur;
   $result_Mo =  bcpow(2, 10) * $valeur;
      $result_Go = $valeur;
      break;
       default: ;
        break;
}

  header('Content-type: application/json');
  ?>
  {
      "valeur_o": "<?php echo $result_o;?>",
      "valeur_ko": "<?php echo $result_Ko;?>",
   "valeur_Mo": "<?php echo $result_Mo;?>",
   "valeur_Go": "<?php echo $result_Go;?>"
  }
  <?php
exit(0);

Le chargement des fichiers sur un serveur, et en particulier la taille des fichiers uploadés, est soumis à plusieurs limitations au niveau de la configuration dudit serveur. 

Ces paramètres limitatifs sont modifiables dans le fichier php.ini et peuvent être vérifiés avec la commande phpinfo() qui affiche tous les paramètres du serveur.

<?php
  phpinfo();
?>

Les paramètres pris en compte pour maîtriser l'upload des fichiers sont les suivants :

upload_max_filesize : Fixe la taille maximale d'un fichier à charger (exprimée en octets).

post_max_size : Fixe le poids maximum des données envoyées  par le formulaire (donc des fichiers chargés par formulaire sur le serveur). La valeur de post_max_size doit logiquement être  supérieure ou égale à la valeur de upload_max_filesize

Vérifiez aussi la valeur du paramètre memory_limit qui fixe la mémoire maximum qu'un script peut allouer à une requête. La valeur de memory_limit  doit être supérieure ou égale à la valeur de post_max_size.

 Limiter la taille du fichier à uploader au niveau du formulaire HTML

Ci dessous, un exemple de formulaire d'upload de fichiers et traitement des données.

Il est possible de limiter, côté client, la taille des fichiers uploadés, tout en gardant à l'esprit que la taille max fixée côté client ne peut pas être supérieure à celle fixée par le serveur. 

Pour fixer une taille limite sur le fichier à télécharger par le formulaire il faut ajouter un champs de type hidden  et de name MAX_FILE_SIZE (avant la déclaration de l'input file), dont la valeur est la taille limite qu'on veut donner au fichier téléchargé (l'unité est l'octet).

Code HTML :

<form action="upload.php" method="post" name="import_fichier" enctype="multipart/form-data"/>
    <label> Charger un fichier (tous formats) : </label><br />
    <input type="hidden" name="MAX_FILE_SIZE" value="104857600" /> <!-- Limite 100Mo -->
    <input type="file" name="mon_fichier" id="mon_fichier" /><br />  
    <input type="submit" value="Charger un fichier" /><br/> 
 </form>

Limiter la taille du fichier uploadé en sortie de formulaire (partie PHP) 

Nous attaquons ici le traitement des paramètres envoyés par le formulaire de téléchargement de fichiers.

Comme indiqué ci dessus, la vérification HTML n'étant pas suffisante, nous allons refaire un contrôle sur la taille du fichier que l'utlisateur a téléchargé en utilisant la fonction filesize qui calcule la taille d'un fichier.

Code PHP (fichier upload.php) :

<?php
    $repertoireDestination = "uploads/"   ;   
    $NomDuFichier = $_FILES["mon_fichier"]["name"];
    $taille_max    = 104857600;
    $taille_fichier = filesize($_FILES['mon_fichier']['tmp_name']);
    if ($taille_fichier > $taille_max){
      echo "Vous avez dépassé la taille de fichier autorisée";
    }else if ($NomDuFichier !=''){
        if ( is_uploaded_file($_FILES["mon_fichier"]["tmp_name"])) {
          if (file_exists ($repertoireDestination.$NomDuFichier)){
            echo 'Le fichier '.$NomDuFichier.' existe déjà<br/>';
          }else{ 
            if (!rename($_FILES["mon_fichier"]["tmp_name"],
                $repertoireDestination.$NomDuFichier))
            {   
              echo "Le déplacement du fichier temporaire a échoué";
            }
          }    
        } else {
          echo "Le fichier ". $NomDuFichier ." n'a pas été uploadé";
        }
 }
?> 

Voici un script PHP / HTML / Javascript pour convertir un montant donné en Dollars ou en Euros en montant Bitcoins au taux de conversion en temps réel.
Le calcul se fait en allant interroger l’URL officielle https://blockchain.info/ de calcul du taux de conversion bitcoin.

Déclaration du formulaire HTML de conversion de Bitcoins

Fichier bitcoin.html :

Amount in dollars : <input id="montant_dol" type="text"/>$
<div id="calcul_dol">Calculate in Bitcoins</div>
<div id="montant_bit_dol"></div>

Montant en euros : <input id="montant_eur" type="text"/>€
<div id="calcul_eur">Calculer le montant en Bitcoin</div>
<div id="montant_bit_eur"></div>

Partie Javascript – Demande de conversion du montant saisi en Bitcoin

Envoi au serveur du montant Dollars et Euros remplis dans le formulaire.
Récupération du montant converti par le serveur sous format JSON. Le processus se déroule sans rechargement de la page grâce au protocole AJAX

Fichier bitcoin.js :

<script type="text/javascript">
$(document).ready( function () {
$("#calcul_dol,#calcul_eur").click(function() {
   $.ajax({
      url      : "bitcoin-ajax.php",    
      data     : {montant_dol : $("#montant_dol").val(), montant_eur : $("#montant_eur").val()},
      cache    : false,
      dataType : "json",
      error    : function(request, error) { // Info Debuggage si erreur     
                   alert("Erreur : responseText: "+request.responseText);
                 },
      success  : function(data) {  
           if (data.montant_bit_dol > 0)     
             $("#montant_bit_dol").html($("#montant_dol").val()+ '$ =  '+data.montant_bit_dol+' Bitcoins');
            if (data.montant_bit_eur > 0)     
             $("#montant_bit_eur").html($("#montant_eur").val()+ '€ =  '+data.montant_bit_eur+' Bitcoins');    
        }
     });
    });
})
</script>

Partie Serveur PHP – Conversion en Bitcoin en interrogeant blockchain.info

Ce fichier doit contenir uniquement les données de retour en format JSON et ne rien afficher d’autre (voir mémo sur les requêtes AJAX en JQuery). bitcoin-ajax.php récupère  les informations de montant en Dollars et en Euros envoyées par le navigateur et interroge le site blockchain.info avec les paramètres montant (value) et devise (currency) qui convertira ces valeurs en montant de Bitcoin au taux de conversion en temps réel.
En sortie de fichier, on affiche sous format JSON les montants Bitcoin convertis qui vont être reçus par la requête success  de la fonction $.ajax du fichier bitcoin.js

Fichier bitcoin-ajax.php :

<?php
  $root    = "https://blockchain.info/"; 
  if (isset($_REQUEST['montant_dol'])){
    $price_in_usd=$_REQUEST['montant_dol'];
  }else $price_in_usd=0;
  $price_in_btc = file_get_contents($root . "tobtc?currency=USD&value=" . intval($price_in_usd));
 
  if (isset($_REQUEST['montant_eur'])){
    $price_in_eur=$_REQUEST['montant_eur'];
  }else $price_in_eur=0;
  $prix_en_btc = file_get_contents($root . "tobtc?currency=EUR&value=" . intval($price_in_eur));
  header('Content-type: application/json');
  ?>
  {
      "montant_bit_dol": "<?php echo $price_in_btc;?>",
      "montant_bit_eur": "<?php echo $prix_en_btc;?>"
  }
  <?php
exit(0);
?>

Cette propriété pourtant bien utile permettait de connaitre l'identité du navigateur ainsi que sa version. 

Aucun remplacement facile à mettre en place apparemment pour l'instant. Vous pouvez régler le problème en déclarant le plugin jQueryMigrate après votre déclaration jQuery.

<script src="http://code.jquery.com/jquery-migrate-1.1.0.js"></script>

Ce plugin permet de patcher les fonctions jQuery obsolètes. Pas super optimisé mais ça peut servir.

Plus d'info sur le site officiel de jQuery 

Vous pouvez la personnonaliser en créant un fichier 404.html et en le déclarant dans votre fichier .htaccess après la commande ErrorDocument

Déclaration de votre fichier 404.php dans le .htaccess

ErrorDocument  404  http://memo-web.fr/404.php

Votre fichier s'affichera avec votre design et message personnalisé lorsque l'internaute tapera une mauvaise adresse ou que l'une de vos page n'existe plus et que vous avez oublié (mal) de faire une redirection !

Nous supposeront que les coordonnées GPS des points à indiquer sur la carte sont stockés dans une table de notre base de données.
Nous construisons donc notre carte, centrée sur un point précis à définir, et nous iront récupérer les coordonnées des lieux à afficher dans la base de données grâce au binôme AJAX / JQuery et nous créeront sur la carte et à la volée des marqueurs représentant chacun de ces points.
Il est possible d’ajouter du texte en légende de chacun de ces marqueurs qui apparait lorsqu’on clique sur le marqueur google map (titre_lieu dans l’exemple ci dessous) et de leur affecter un lien html (url_lieu).

Créez 3 fichiers :

• index-map.php
• index-map.js
• index-map-ajax.php

Vous pouvez relire le memo : Principe des requêtes Ajax en Jquery pour vous remettre les idées au claire concernant l’utilisation des appels Ajax en JQuery.

Mise en place du code HTML ,  conteneur de la carte Google map

index-map.php

<div id="carte" style="width:300px; height:300px"></div>

Déclaration du script de l’API Google Map

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false&language=fr">

Code Javascript de création de la carte Google Map. Ajout de lieux sur la carte Google Map

Paramétrage des marqueurs (taille, couleur)
Création de l’objet Google Map new google.maps.Map() , paramétrage de ses options (zoom, point central, type de carte …)
Récupération en AJAX de données concernant les lieux et création de marqueurs associés à chaque lieu.

index-map.js

$(document).ready( function () {
    // Paramétrage des marqueurs
    var pinColor = "29aec3";// couleur des épingles google MAP
    var pinImage = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|" + pinColor,
        new google.maps.Size(21, 34),
        new google.maps.Point(0,0),
        new google.maps.Point(10, 34));
    var pinShadow = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_shadow",
        new google.maps.Size(40, 37),
        new google.maps.Point(0, 0),
        new google.maps.Point(12, 35));
 
  function initialiser() {
    // Récupération de la latitude et longitude pour centrer notre carte
    var latlng = new google.maps.LatLng(43.295309,5.374457);

    //Objet contenant des les propriétés d'affichage de la carte Google MAP
    var options = {
          center    : latlng,
          zoom      : 14,
          mapTypeId : google.maps.MapTypeId.ROADMAP
                  };
  
    //Constructeur de la carte
    var carte = new google.maps.Map(document.getElementById("carte"), options);
  
    // Récupération en AJAX des données des lieux à épingler sur la carte Google map
    $.ajax({
       url   : 'index-map-ajax.php',
       error : function(request, error) { // Info Debuggage si erreur         
                 alert("Erreur sous genre - responseText: "+request.responseText);
                },                
    dataType : "json",  
    success  : function(data){
                  $("#carte").fadeIn('slow');
                  var infowindow = new google.maps.InfoWindow();    
                  var marker, i;   
                  // Parcours des données reçus depuis le fichier index-map-ajax.php
                  // Récupération de LatLng, Hint et Legende de chaque lieu et création d'un marqueur
                  $.each(data.items, function(i,item){
                     if (item) {
                        if (item.LatLng_lieu!=''){
                           // On sépare la latitude et la longitude
                           var strLatLng = item.LatLng_lieu.split(',');
                           marker = new google.maps.Marker({
                             position : new google.maps.LatLng(strLatLng[0], strLatLng[1]),
                             map      : carte,
                             icon     : pinImage,
                             shadow   : pinShadow,
                             title    : item.Titre_lieu
                            });          
                  google.maps.event.addListener(marker, 'click', (function(marker, i) {
                   return function() {
                   // Affichage de la légende de chaque lieu
                   infowindow.setContent('<a target="_blank" href="'+item.Url_lieu+'"><br/>'+item.Titre_lieu+' </a> ');
                   infowindow.open(carte, marker);
                  }
                })(marker, i));                              }         
                //alert('Vérification données reçues '+item.Titre_lieu+' -- '+item.Url_lieu+ ' -- '+item.LatLng_lieu);
              }
            });                        
          }
        }); 
      }initialiser();
  })

Récupération en AJAX  des lieux à afficher sur la carte Google Map

Nous chargerons dans ce fichier les données de localisation enregistrées en base de données et les afficherons sous forme de données JSON.

Nous supposerons donc ici que nous avons une table nommée lieux comprenant les champs

• latlng_lieu :  « latitude,longitude » du lieu. Doit être enregistré sous la forme « 43.295309,5.374457 »
• titre_lieu
• url_lieu

Mémo pour connaître la latitude et longitude d’un lieu

index-map.ajax.php

<?php
  // Accès à la base de données
  $serveur     = "monserveur.com";
  $utilisateur = "dbxxxxxx";
  $motDePasse  = "mon_mot_de_passe_BDD";
  $base        = "dbxxxxxxxx";
  mysql_connect($serveur, $utilisateur, $motDePasse);
  mysql_select_db($base) or die("Base de données inactive. ");
  // $items est la chaîne contenant l'objet JSON des données
  $items = '';

  // Parcours des lieux
  $result = mysql_query("SELECT* FROM lieux ");
  WHILE ($row = mysql_fetch_object($result)) {   
   // Ecriture des données sous format JSON   
$items .= <<<EOD
   { "LatLng_lieu" : "$row->latlng_lieu",
     "Titre_lieu"  : "$row->titre_lieu",
     "Url_lieu"    : "$row->url_lieu"},
EOD;
    }
    mysql_free_result($result);
 
  // On enlève la dernière virgule
  if ($items != ''){
     $items = substr($items, 0, -1);
  }
 
  // Ecriture de la liste des lieux en format JSON
    header('Content-type: application/json');
    ?>
    {   
        "items": [
                  <?php echo $items;?>
                  ]
    }

Le lieu à insérer étant tapé dans un formulaire de recherche sur le site Internet (Voir exemple sur cette page), c’est l’API Google map qui cherche ses coordonnées latitude longitude pour ensuite afficher l’adresse sur la carte.

Déclarer le script de l’API Google Map

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false&language=fr">
</script>

Créer le formulaire HTML de recherche d’une adresse ou d’un lieu sur Google Map

Ce code HTML comprend :

• Un formulaire de recherche de lieu
• Un conteneur div de la carte Google Map
• Un <span></span>, qui contiendra les coordonnées latitude et longitude du lieu s’il est trouvé par l’API google map.

<form>
  <input type="text" id="adresse"/>
  <input type="button"  value="Localiser sur Google Map" onclick="TrouverAdresse();"/>
</form>
<span id="text_latlng"></span>
<div id="map-canvas" style="float:right;height:220px;width:45%"></div>

Code javascript d’appel à l’API de Google Map : Trouver une adresse sur la carte

Le code javascript comprend

• la fonction de création de la carte google map initialiserCarte() avec des paramètres par défaut concernant le point sur lequel elle est centrée exprimé en (latitude, longitude) [Connaitre la latitude et longitude d’un point avec Google Map], le pourcentage de zoom sur la carte et le type de carte.
• La fonction TrouverAdresse() lancée sur la validation du formulaire qui
  – Va rechercher les coordonnées GPS du lieu tapé dans le formulaire de recherche (input text d’identifiant « adresse »)
  – Passe ensuite ces coordonnées en tant que centre de la carte google map
  – Affiche ces coordonnées dans le span  d’identifiant text_latlng
    – Crée un marqueur (épingle) de lieu à l’emplacement du lieu trouvé

<script type="text/javascript">
var geocoder;
var map;
// initialisation de la carte Google Map de départ
function initialiserCarte() {
  geocoder = new google.maps.Geocoder();
  // Ici j'ai mis la latitude et longitude du vieux Port de Marseille pour centrer la carte de départ
  var latlng = new google.maps.LatLng(43.295309,5.374457);
  var mapOptions = {
    zoom      : 14,
    center    : latlng,
    mapTypeId : google.maps.MapTypeId.ROADMAP
  }
  // map-canvas est le conteneur HTML de la carte Google Map
  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}

function TrouverAdresse() {
  // Récupération de l'adresse tapée dans le formulaire
  var adresse = document.getElementById('adresse').value;
  geocoder.geocode( { 'address': adresse}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      map.setCenter(results[0].geometry.location);
      // Récupération des coordonnées GPS du lieu tapé dans le formulaire
      var strposition = results[0].geometry.location+"";
      strposition=strposition.replace('(', '');
      strposition=strposition.replace(')', '');
      // Affichage des coordonnées dans le <span>
      document.getElementById('text_latlng').innerHTML='Coordonnées : '+strposition;
      // Création du marqueur du lieu (épingle)
      var marker = new google.maps.Marker({
          map: map,
          position: results[0].geometry.location
      });
    } else {
      alert('Adresse introuvable: ' + status);
    }
  });
}
// Lancement de la construction de la carte google map
google.maps.event.addDomListener(window, 'load', initialiserCarte);
</script>

Les coordonnées latitude longitude apparaissent dans la barre de recherche de google map.

Côté 1&1, où se trouve votre hébergement

Dans l'interface d'administration 1&1 :

• Dans la rubrique Domaines & Espaces Web​, cliquer sur le lien "Ajouter un Domaine".
• Tapez alors le nom de domaine que vous souhaitez rediriger sur cet hébergement.
• Validez, 1&1 vous indiquera alors, logiquement, que "Ce nom de domaine est déjà enregistré."
• Choisissez l'option : "Utiliser les serveurs DNS 1&1 et conserver votre registrar actuel (bureau d'enregistrement)".
• 1&1 vous communiquera le nom des serveurs DNS qu'il vous faudra paramétrer chez Gandi. Gardez les sous le coude pour la prochaine étape chez Gandi.

Côté Gandi, où se trouve votre Nom de Domaine 

Dans l'interface d'administration Gandi :

• Rendez vous dans la page de gestion de votre nom de domaine (en cliquant sur le nom de domaine désiré dans la liste de vos domaines)
• Rubrique Serveurs de nom (en bas à droite), cliquez sur "Modifier les serveurs DNS"
• recopiez alors le nom des serveurs DNS communiqués précédemment par 1&1

Vous devrez maintenant attendre 24h pour que le processus suive son cours.

Encodage des fichiers : utf8 (sans BOM)

Encodage de la base de données : utf8_general_ci

Encodage des tables de la base de données : utf8_general_ci

Meta dans la balise <head> du site :
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />