Vous avez déjà voulu afficher la source d'une page Web à partir d'un iPad ou d'un iPhone ? Malheureusement, Safari mobile n'inclut pas la fonctionnalité en elle-même et n'a pas encore de boîte à outils d'inspecteur Web mobile intégrée, mais à l'aide d'un bookmarklet personnalisé, vous pouvez afficher la source de n'importe quelle page Web directement dans iOS et iPadOS.

Cet article vous montrera comment vous pouvez vous configurer pour pouvoir afficher la source dans Safari pour iPad et iPhone en utilisant un bookmarklet et une astuce javascript.

Comment afficher la source dans Safari pour iPad et iPhone

1. Ouvrez Safari si vous ne l'avez pas déjà fait
2. Ajoutez cette page Web (ou toute autre) avec Safari sur un iPad, iPhone ou iPod touch et nommez le signet "Afficher la source"
3. Cliquez ici pour afficher le javascript du bookmarklet, puis choisissez de Tout sélectionner -> Copier
4. Appuyez sur l'icône Signet sur le nouvel écran du navigateur Safari et appuyez sur "Modifier", puis appuyez sur le signet que vous avez enregistré à l'étape 2
5. Collez le code javascript que vous avez copié à l'étape 3 dans la barre d'URL, puis enregistrez les modifications apportées au signet en appuyant sur "Terminé"
6. Maintenant, lorsque vous souhaitez afficher une source de pages Web sur iPad ou iPhone, ouvrez le menu Signets et sélectionnez "Afficher la source"
7. Le code source apparaîtra dans une syntaxe en surbrillance avec des URL source cliquables

Une chose importante à noter est que le javascript utilisé ici envoie la source de la page que vous consultez au serveur michelsen.dk pour traitement. Si vous n'êtes pas à l'aise avec cela, il existe d'autres solutions, mais elles ne mettront pas en évidence la syntaxe et ne sont pas aussi élégantes dans l'ensemble.

Par exemple, vous pouvez utiliser le Javascript ci-dessous comme bookmarklet pour afficher également la source qui ne sera pas traitée via un serveur distant, mais il n'utilise pas la coloration syntaxique :

javascript:(function(){var a=window.open('about:blank').document;a.write('Source de '+location. href+'');a.close();var b=a.body.appendChild(a.createElement('pre'));b.style.overflow='auto';b.style.whiteSpace='pre-wrap ';b.appendChild(a.createTextNode(document.documentElement.innerHTML))})();

Une astuce similaire utilise un signet modifié pour vous permettre d'exécuter Firebug avec Mobile Safari sur un iPhone ou un iPad également, ce qui peut être un peu plus utile pour certains développeurs Web.

Cette astuce géniale vient de Michelsen.dk. Trouvé via Twitter, vous pouvez nous suivre là aussi

Qui sait, peut-être qu'un jour Safari sur iOS et iPadOS aura la capacité native d'afficher la source ? Jusque-là, vous devrez compter sur ces applications ou outils de fête comme celui-ci.

Cela a bien fonctionné lors des tests, mais certains utilisateurs signalent des résultats différents sur diverses versions ultérieures de Safari et d'iOS. Faites-nous savoir dans les commentaires ci-dessous ce qui fonctionne pour vous et quelle version iOS et iPad ou iPhone vous utilisez.