Pour les développeurs : intégrer votre site dans iCar

Comment iCar affiche votre site

Votre page est chargée dans un cadre (iframe), sur toute la largeur de l'écran de la voiture, sous un bandeau iCar qui porte le nom de votre site et un bouton Retour.

iCar affiche la page telle quelle : votre en-tête, vos menus et vos bandeaux de consentement restent visibles. Rien ne peut être masqué ni restylé dans une page d'un autre domaine.

Si votre site refuse d'être encadré, la tuile fonctionne quand même : elle ouvre votre site dans le navigateur de la Tesla, hors d'iCar.

Autoriser iCar à encadrer vos pages

Un navigateur refuse d'afficher une page dans un autre site si la page ne l'autorise pas. Deux en-têtes HTTP en décident.

Retirez X-Frame-Options (DENY ou SAMEORIGIN), au moins sur les pages que vous souhaitez proposer.

Autorisez iCar dans Content-Security-Policy avec la directive frame-ancestors : Content-Security-Policy: frame-ancestors 'self' https://geticar.com

Si vous envoyez déjà une Content-Security-Policy, ajoutez https://geticar.com à votre liste frame-ancestors existante plutôt que d'envoyer un second en-tête.

Exemple nginx : add_header Content-Security-Policy "frame-ancestors 'self' https://geticar.com" always;

Pour vérifier vos en-têtes : curl -sSLI https://votre-site.com | grep -i 'x-frame-options\|content-security-policy'

Concevoir pour l'écran de la voiture

Taille : le navigateur de la Tesla est en paysage, environ 1 180 × 600 pixels CSS, et plus étroit (autour de 770 pixels) sur les versions logicielles récentes. Le bandeau d'iCar occupe le haut de l'écran : visez une mise en page qui fonctionne dès 768 pixels de large.

Tactile uniquement : pas de souris ni de survol. Menus, infobulles et actions doivent fonctionner d'un appui, avec des cibles d'au moins 44 pixels, idéalement 64 : l'écran se touche à bras tendu, souvent dans une voiture qui roule.

Lisible en plein soleil : grands textes, contrastes marqués, et un thème sombre via prefers-color-scheme.

Dessinez vos icônes : les polices du navigateur de la Tesla ne couvrent pas de nombreux symboles Unicode. Une croix, une flèche ou une coche en caractère peuvent s'afficher en carré vide : utilisez des icônes SVG.

HTTPS partout : une image, un script ou un flux en http:// est bloqué comme contenu mixte.

Restez léger : la voiture est souvent connectée en réseau mobile, et une page lourde donne l'impression d'un écran figé. Vos bandeaux de consentement restent visibles : ils doivent se fermer d'un grand appui.

Sessions, cookies et connexion

Dans un cadre, votre site est en contexte tiers : les navigateurs cloisonnent ou bloquent les cookies tiers, et une connexion qui tient dans un onglet peut ne pas tenir dans iCar.

La meilleure expérience est un contenu utilisable sans connexion. Si une session est nécessaire, posez vos cookies avec SameSite=None; Secure; Partitioned, et vérifiez qu'elle survit à un rechargement.

Évitez les connexions qui ouvrent une fenêtre ou un nouvel onglet : elles font sortir d'iCar.

Audio et vidéo

Utilisez de la vidéo H.264 et de l'audio AAC ou MP3 : le HEVC peut ne pas être décodé.

Le navigateur de la Tesla (Chromium) ne lit pas le HLS nativement : passez par une bibliothèque comme hls.js. Les contenus protégés (Widevine) ne sont pas garantis.

Pas de lecture automatique avec le son : le navigateur la bloque tant que l'utilisateur n'a pas touché la page. Et concevez la vidéo pour l'arrêt ou la recharge, pas pour la conduite.

Ce que le cadre d'iCar n'autorise jamais

Une page ouverte dans iCar n'a accès ni à la géolocalisation, ni à la caméra, ni au micro, ni au plein écran. C'est un choix délibéré et définitif : iCar n'accorde aucune de ces permissions à un site tiers. Concevez votre page pour s'en passer.

Confidentialité : iCar ne vous transmet rien

iCar ne transmet à votre site aucune donnée personnelle et aucune position. L'adresse ouverte est exactement celle de la tuile : iCar n'y ajoute ni identifiant, ni information de compte, ni coordonnées, et n'en envoie pas autrement.

Le référent est réduit à l'origine, https://geticar.com : vous pouvez mesurer le trafic venu d'iCar, sans rien savoir de plus sur la personne.

Comme pour tout site web, votre serveur voit l'adresse IP de la connexion, celle du réseau mobile ou du Wi-Fi de la voiture. Elle vient du navigateur, pas d'iCar.

Être référencé dans iCar

iCar n'ouvre à l'intérieur de l'application que des domaines vérifiés, pour ne jamais montrer un cadre vide à un conducteur. Écrivez à support@geticar.com avec : l'adresse à ouvrir, un logo carré en SVG ou en PNG d'au moins 256 × 256 pixels sur fond transparent, le nom à afficher sur la tuile, les pays et les langues de votre site, et une phrase sur ce que les conducteurs peuvent y faire.

Nous vérifions vos en-têtes, puis nous chargeons réellement votre page dans iCar. Une fois validé, votre domaine s'ouvre dans iCar pour tous les utilisateurs qui l'ajoutent, et peut être proposé dans les tuiles par défaut des pays concernés.