Erstellen eines JavaScript-Bookmarklets, das die aktuelle URL anfordert

Question

Ich versuche ein JavaScript-Bookmarklet zu erstellen, das die aktuelle URL an meine API sendet. Zum Beispiel, etwas Ähnliches wie das Bookmarks von Instapaper. Ich habe das folgende Skript geschrieben, es durch einen Minifier geleitet und es als href zu einem <a> Tag hinzugefügt, das ich als Schaltfläche verwende. Ich möchte dieses Tag in die Lesezeichenleiste ziehen können.

javascript: (function() { 
    var url = document.location.href 
    var uri = "http://localhost:3001/api/v1/links/bookmarklet?url=" + url + "&id=1" 

    xhr = new XMLHttpRequest(); 
    xhr.open("POST", encodeURI(uri)); 

    xhr.send(); 
}()); 

Aktuell teste ich dies nur auf localhost auf meinem lokalen Server aus: 3001 und bin mit meiner App auf localhost: 3000. Wenn ich den Knopf während meiner App drücke (auf localhost: 3000), wird zwar die Post-Anfrage gestellt, aber das Skript selbst wird zur Adressleiste oberhalb der aktuellen URL hinzugefügt.

http://localhost:3000/!function()%7Bvar%20e=%22http://localhost:3001/api/v1/links/bookmarklet?url=%22+document.location.href+%22&id=1%22;xhr=new%20XMLHttpRequest,xhr.open(%22POST%22,encodeURI(e)),xhr.send()}();

Wenn ich die Taste, um die Lesezeichenleiste und klicken Sie, von einer anderen Seite ziehen, leitet es automatisch zurück auf localhost: 3000 und macht das Gleiche. Fehle ich etwas Offensichtliches hier? Ich kann im Web keine Anleitung finden, wie man ein Bookmarklet implementiert, um eine aktuelle URL zu posten.

Das HTML sieht wie folgt aus:

<a href='!function(){var e="http://localhost:3001/api/v1/links/bookmarklet?url="+document.location.href+"&id=1";xhr=new XMLHttpRequest,xhr.open("POST",encodeURI(e)),xhr.send()}();' id="button">post link</a> 

Die eingehenden params für meine Rails-API wie folgt aussehen

<ActionController::Parameters {"url"=>"http://localhost:3000/!function()%7Bvar%20e=%22http://localhost:3001/api/v1/links/bookmarklet?url=%22 document.location.href %22", "id"=>"1", "xhr"=>"new%20XMLHttpRequest,xhr.open(%22POST%22,encodeURI(e)),xhr.send()}()", "format"=>:json, "controller"=>"api/v1/links", "action"=>"create_link_from_web"} permitted: false> 

So ist es in Rails auf den richtigen Weg nicht schreiben, aber es ist alles durcheinander. Vielen Dank im Voraus für Anregungen!

Answer 1

Ihr href Attribut wird als relativer Pfad ohne ein explizites Protokoll in der Zeichenfolge, z. http: oder javascript:, usw. Deshalb wurde die Ursprungsdomäne Ihrer URL-Zeichenfolge vorangestellt.

Beachten Sie, dass Bookmarklets nicht in allen Browsern funktionieren. Stellen Sie daher sicher, dass Sie zumindest mit Ihrer Zielgruppe kompatibel sind.

um dieses Problem zu beheben, ändern Sie Ihre HTML

<a href='javascript:!function(){var e="http://localhost:3001/api/v1/links/bookmarklet?url="+document.location.href+"&id=1";xhr=new XMLHttpRequest,xhr.open("POST",encodeURI(e)),xhr.send()}();' id="button">post link</a>