
Es gibt Artikel, für die mich meine Kollegen wirklich lieben: Ein einziger unendlich winziger Einsatzzweck, umgesetzt mit obskuren Mitteln, und dann noch abartig schlechtes Bildmaterial. So wie hier: localhost-URLs auf der aktuellen Webseite durch 192.168.178.100-Links ersetzen, mittels JavaScript-Bookmarklet und das alles passiert unsichtbar im Hintergrund. Kann man doch nur gut finden, woll?!
Hier ein Link auf localhost/mysite - der hier natürlich nicht funktioniert, weil es 192.168.178.68/mysite sein müsste.
localhost-Links
Aber dennoch ist das Ganze für mich ziemlich nützlich! Das Problem: Ich bin häufiger mit irgendwelchen Verweisen auf bestimmte Funktionen in Webanwendungen konfrontiert, zum Beispiel im Messenger. Ebenso mit Links zur Dokumentation. Und da Anwendung und Dokumentation bei den Link-Erstellern jeweils auf dem lokalen Rechner laufen, heißen die Links eben beispielsweise http://localhost/main.php?create_account oder http://localhost/guide/step1.
Das Phänomen gibt es aber auch immer wieder mal in Dokumentationen und Artikeln zu Webanwendungen. Aus zwei Gründen: Zum einen bietet es sich häufig an, den Localhost gibt es schließlich immer. Zum anderen gibt es auch viele Desktop-Anwendungen, die auf eine Weboberfläche setzen. Und dann kann die Hilfe zum Beispiel einfach direkt zur richtigen Stelle in der App hinleiten - weil localhost eben tatsächlich die korrekte Adresse ist.
Egal, jedenfalls kann ich solche Links nicht anklicken, weil die Webanwendung und deren Dokumentation auf einem anderen Server laufen. Also habe ich bislang 192.168.178.100 eingetippt und dann den Rest des Links hinzukopiert, also etwa /guide/step1. Aber spätestens beim vierten, fünften Mal bin ich von derlei sinnlosen Redundanzen genervt. Ich will Links anklicken, nicht de- und rekonstruieren.
Hier das Ganze im Bewegtbild:

Das Bookmarklet
Eigentlich will ich also nur Suchen und Ersetzen auf die aktuelle Webseite (oder Messenger-App, Doku, im Browser halt) anwenden. Und wie kommuniziert man mit dieser? Natürlich mit JavaScript. Zum Beispiel in der Konsole der Developer Tools, die Ihr mit F12 öffnen könnt.
Der Code:
javascript: document.querySelectorAll('a').forEach(x => {
let url = new URL(x.href);
if (url.hostname === 'localhost') {
url.hostname = '192.168.178.100';
x.href = url.toString();
}
});
Es wird einfach nur der Wert von url.hostname ausgetauscht. Und die einfachste Methode, diesen Code auszuführen, ist nun mal ein Bookmarklet: Das sind schlicht Lesezeichen in der Lesezeichenleiste :) Anstatt einer URL wird der Code eingegeben und per Klick ausgeführt.

Bookmarklets sind wohl nie das große Ding gewesen und dürften in Zeiten KI-generierter Filme den Charme von typischem Matheunterricht haben. Aber um mal eben im Browser etwas zu manipulieren, sind sie ein plausibles Mittel. Auch für populärere Zwecke: Hier noch ein sehr alter Artikel zu einem Bookmarklet, das zwei Webseiten im Browser nebeneinander zeigen kann.
Ihr mögt die Funktion, aber hasst Bookmarklets? Das finde ich zwar verwerflich, habe aber eine Lösung: Es gibt Online-Konverter, die aus Bookmarklets echte Chrome-Addons machen - dieser hat hier tadellos funktioniert. Das ist jetzt aber fancy. Bestimmt.
Achso, damit das mit der Liebe der Kollegen nicht überbordet, habe ich noch was Massentaugliches, Nützliches geschrieben.