Accéder à son site local depuis son smartphone ou un autre périphérique sous linux, mac et windows.

Il est utile quand l'on développe un site de pouvoir le tester depuis différents supports (tablette, téléphone...) pour en vérifier son bon fonctionnement, encore plus quand l'on développe un site mobile ou responsive (private joke : kikou les M1!).

Pour cela il faut être connecté sur le même réseau local, par exemple derrière la box de votre fournisseur d'accès ou un routeur. Peut importe le type de connexion (wifi ou câble réseau RJ45)

Déterminer son adresse ip «Locale»

Première chose à faire récupérer l'IP de la machine qui fait office de serveur local (la machine ou est installé lamp, wamp ou mamp...) pour cela il faut ouvrir un terminal.

  • Sous windows : ouvrez le menu démarrer, cherchez « invite de commande » ou tapez directement cmd.
  • Sous mac : dans Applications/Utilitaires/terminal
  • Sous linux : normalement le raccourci CTRL+ALT+T vous ouvrira un terminal

puis dans la fenêtre qui s'est ouverte tapez

  • sous windows : ipconfig
  • sous mac et linux : ifconfig

Terminal sous linux

ifconfig sous linux

cmd ipconfig windows

Une adresse ip est constituée d'une suite de 4 nombres, pouvant aller jusqu'à 255, séparés par des points .

Généralement l'adresse ip commencera par 192.168....

C'est cette adresse que l'on va taper sur le périphérique sur lequel on veut tester le site, et vous tomberez sur la page d'accueil de votre serveur, comme si vous aviez utilisé l'adresse « localhost » sur votre ordinateur principal.

Exceptions

Sous windows avec wamp : si vous avez un message du type « Forbidden You don't have permission to access / on this server »

modifiez le fichier httpd.conf (ou bien votre virtual host si vous en utilisez un) entre le les balises <directory ...>, remplacez la ligne

Allow from 127.0.0.1

par :

allow from all

Sous mac, il se peut que vous ayez à configurer le firewall intégré pour autoriser les connexion depuis l’extérieur vers apache.

Aussi, si vous utilisez un port non standard (par exemple localhost:8888 depuis votre machine) ajoutez ce port à la fin de l'adresse ip : 192.168.XX.XX:8888

Android serveur local

Commentaires

Je trouve pas la ligne : Allow from 127.0.0.1

sur mon serveur apache ?? je suis sous Wamp

moi aussi

Sous OS X, même pas besoin d'ouvrir le terminal, sauf si vous voulez frimer devant vos clients:

Préférences système / réseau, et vous aurez accès votre adresse wi-fi ou Ethernet
puis comme indiqué, ajoutez le port (par défaut :8888 sous Mamp) et voilà...

jai fais un virtual hist comment acceder a ma page?

Tutoriel très intéressant, et efficace ! J'ai pu tester mon site en localhost ainsi. Un grand merci

Bonjour
Alors effectivement, j'arrive à la racine de localhost et je peux naviguer dans les sites qu'il y a dedans. C'est génial !

Mais ...

Je suis en train de tester le contrôle de la camera d'un smartphone ou d'une webcam avec html/js. Concrètement, avec le code suivant :

Capture

const player = document.getElementById('player2');
const canvas = document.getElementById('canvas');
const context = canvas.getContext('2d');
const captureButton = document.getElementById('capture');

const constraints = {
video: true,
};

captureButton.addEventListener('click', () => {
// Draw the video frame to the canvas.
context.drawImage(player, 0, 0, canvas.width, canvas.height);
});

// Attach the video stream to the video element and autoplay.
navigator.mediaDevices.getUserMedia(constraints)
.then((stream) => {
player.srcObject = stream;
});

Le script de test fonctionne sur l'ordinateur. Il me renvoie l'image de la webcam. En revanche, le smartphone affiche bien la page mais le contrôle vidéo, bien présent, n'affiche rien.

Comment je peux faire pour que ça affiche la même chose que l'ordinateur ?

Merci pour les conseils si important et interessant. Mias je crois que de nos jours il en existe deja quelque plugins et services permettant de tester son site web en cours de developement sans utiliser un appareils réel. et meme sur plusieurs plateforme et systeme d'operation.

j'ai vraiment aimé le tuto,d'autant plus que j'ai essayé et ça marché d'un coup devant mon jury à la soutenance
merci beaucoup;

Bonjour, je n'arrive toujours pas à accéder à mon site en local depuis mon smartphone qui est sous android... Merci de votre aide !

Oui très merci beaucoup

Ajouter un commentaire

Ne sera pas publié
CAPTCHA
Désolé, pour ça, mais c'est le seul moyen pour éviter le spam...