Developer Tools verstecken?

Wie kann ich Sachen von den Developer Tools verstecken wie zB meinen Code von Microsoft Clarity oder meinen Code für die Formulare von Formspree? Also diese Anbieter geben ja Codes her damit die sich mit der Website verbinden können, aber diesen Code kann man in den Dev Tools sehen, weil sie im Html text integriert sind und wenn das jemand sieht kann er meine Codes nutzen, wahrscheinlich nichts gefährliches, aber wird mir Kopfschmerzen bereiten wenn da Sachen von anderen Webseiten sind. Vielleicht fragt man sich warum, jemand sowas machen sollte, weil es ja keinem was bringt, aber ich glaube es wird Leite geben, denne es Spaß macht anderen zu schaden. Die Code von denen ich rede sind:

Formspree: form action=“Link“

Microsoft Clarity ist im head Bereich auch mit einem Link verbunden

3 Antworten

Mirko Marek

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

Mediengestalter Digital und Print

01.03.2024, 11:20

Hallo Maxim8862,

leider lässt sich HTML, CSS und JavaScript nicht verstecken. Man kann mit Minify den Code etwas komplexer machen, aber er bleibt für die User immer noch lesbar.

Woher ich das weiß:Berufserfahrung – Ich bin gelernter Mediengestalter Digital und Print(IHK)

Maxim8862

Fragesteller

01.03.2024, 12:17

Kann ich mir Vs Studio irgendwie den Code minifizieren von html css und js

regex9

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

HTML, Webseite, CSS

29.02.2024, 23:11

Alles was an den Browser geht, kann in den Entwicklungstools auch gefunden werden. Mal mit mehr oder weniger Aufwand.

Wolltest du solche Verbindungsdaten vor Nutzern wirklich verbergen, müsstest du die Kommunikation serverseitig lösen.

Mit Blick auf Formspree würde das heißen, dass die Formulardaten erst an deinen Server gehen müssten, der sie wiederum an Formspree weiterleitet. Das läuft technisch gegen das Konzept von Formspree (Formulare einbinden, ohne eigenen Servercode). Eine Lösung dafür wäre eine Eigenimplementation von Formularen oder du suchst dir irgendeine Bibliothek, die dir zumindest beim Feldaufbau (Rendering) hilft und die Daten nicht an eine externe Quelle schickt.

Hinsichtlich Clarity wäre ein Server-Side-Tracking die Alternative. Mit JavaScript hängst du dich an die Events, auf die du hören möchtest und schreibst die getrackten Daten in ein Objekt, welches spätestens beim Verlassen der Seite an den Server geschickt werden muss. Der wiederum gibt die Daten weiter an den Tracking-Dienstleister. Da Clarity meines Wissens keine API hat, über die man Daten übermitteln kann, wäre wohl ein anderer Tracking-Dienstleister (wie Google Analytics, Matomo, Plausible, o.ä.) in dieser Angelegenheit die bessere Wahl.

(...) und wenn das jemand sieht kann er meine Codes nutzen (...)

Bezüglich Clarity kannst du im System selbst einen URL Filter setzen. Ein Botfilter ist bereits inkludiert.

Auch Formspree hat einen Filter. Schau dazu in den Projekteinstellungen nach dem Feld Restrict to Domain.

FaTech

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

HTML, Programmiersprache, Programmieren & Softwareentwicklung

29.02.2024, 18:36

Keine Chance. Du kannst Client Code nicht verstecken. Code, den man verstecken will, der muss auf dem Server ausgeführt werden. Hierbei beziehe ich mich auf das Muss, denn es gibt keinen anderen Weg. Alles, was Nutzer nicht sehen dürfen, muss über den Server geschehen. Wenn die Anbieter sowas nicht anbieten, dann kannst du es nicht verstecken

Maxim8862

Fragesteller

29.02.2024, 18:38

Kann ich nicht mit Php einen js script über den Server laufen lassen?

FaTech

29.02.2024, 21:53

@Maxim8862

Ja und nein. Also mit PHP schon mal gar nicht. Wenn du JavaScript ausführen willst, musst du NodeJS oder ähnliche Runtimes verwenden. Problem: Es darf kein JavaScript für den Browser sein. Ich denke mal, das ist hier der Fall und somit fällt es raus. Mit PHP müsstest du das JavaScript per echo oder ähnlichen Methoden einfügen. Demnach wird es auch im Client wieder sichtbar. Also hast du denselben Effekt, als wenn du es direkt ins HTML tust.

Auch hier bin ich absoluter Newby!

Ich habe eine nette kleine Funktion:

--------------------------------------------------------------------------------------------------------------

$({ countNum: $('.code2').html() }).animate({ countNum: 5360 }, {

duration: 10000,

easing: 'linear',

step: function () {

$('.code2').html(Math.floor(this.countNum));

complete: function () {

$('.code2').html(this.countNum + "+");

//alert('finished');

}

});

--------------------------------------------------------------------------------------------------------------

Das funktioniert - alles supi - nun möchte ich, dass die Animation nach einem kleinen Zeitintervall erneut startet. Habe dazu über Google 'setInterval' gefunden und einen Code. Leider fehlt mir noch das Verständnis was ich wo einfügen muss.

Hier der Code von Google:

Edit: Ist der Code vielleicht falsch, javascript vs jquery???

function meineFunktion() { 
    // ... 
} 

setInterval(function() { 
    // alle 3 Sekunden ausführen 
    meineFunktion(); 
}, 3000);

Habe das so in meine Scriptdatei eingebunden:

--------------------------------------------------------------------------------------------------------------

$({ countNum: $('.code').html() }).animate({ countNum: 1295365}, {

duration: 10000,

easing: 'linear',

step: function () {

$('.code').html(Math.floor(this.countNum));

setInterval(function() {

// alle 3 Sekunden ausführen

meineFunktion();

}, 3000);

complete: function () {

$('.code').html(this.countNum + "+");

//alert('finished');

}

--------------------------------------------------------------------------------------------------------------

Ich nehme an mindestestens "meineFunktion()" ist nur ein Platzhalter, aber ich bin nicht sicher, was da vom Code rein soll.

Stört das complete eigentlich die Wiederholung oder zeigt das nur an, was passiert, wenn es fertig hochgezählt hat?

Freue mich wie immer über Antworten! :)

Aber auch über Links z.B. mit einer leicht verständlichen Übersicht der Anatomie eines Jquery Codes, damit ich zukünftig besser allgemeine Beispiele an meine anpassen kann.

Bonusfrage:

Ich würde ganz gerne zu der Zahl noch eine einfache sich drehende Grafik (Kreis, Pfeil oä) hinzufügen. Hat da jemand zufällig nen leicht verständlichen Link oä dazu?

...zur Frage

Visual Studio Code, Python Command Line Dev Tools?

Guten Tag, ich habe letztens angefangen mir Programmieren selber beizubringen. Ich setze mich zur Zeit nur mit den Basics von Python auseinander. Jedesmal wenn ich Visual Studio Code öffne möchte er dass ich die python 3 Command Line Developer Tools Installiere. Diese hatte ich schon öfters über "installieren" installiert, bei jedem Neustart kommt diese unten gezeigte Meldung neu. Mache ich etwas falsch?

Danke im Voraus.

...zur Frage

Link Ziel verstecken?

Hey, bin gerade dabei eine Website zu erstellen nur nervt es mich das bei einfachen sachen wie Verlinkungen auf der seite das unten Links angezeigt wird und weiß leider nicht wie ich das verhinder, habe schon ein paar Möglichkeiten probiert leider hat noch nichts geklappt. :/

MfG

...zur Frage

Welche WYSWYG Editioren sind empfehlenswert?

Suche einen guten und einfachen WYSWYG Editor für HTML, CSS, PHP, JavaScript.

Habe früher Webocton Scriptly genommen, das ist aber auch schon in die Jahre gekommen (neueste Version von 2010). Daher suche ich einen schönen einfachen WYSWIG Editor mit Syntax Highlighting und Autocompletion. Visual Studio Code ist nicht so mein Fall dafür. Vielleicht hat jemand ein paar Empfehlungen für mich.

Gerne für Windows/Linux/MacOS

...zur Frage

Css div Container weissen Rand los werden?

Hey Leute, Lerne derzeit CSS und bin gerade bei einem Hindernis gelandet. Irgendwie ist ein weisser Rand aussen von meinem div Container entstanden und egal mit welchen Befehl, er geht einfach nicht weg. Habe es auch schon mit margin: 0%; versucht.

Nix hat funktioniert.

Ich würde den Code gerne einfügen jedoch ist er zu lang. Wenn jemand Interesse hat mir im privat Chat zu helfen kann ich gerne den Code zuschicken.

Hat jemand anderes trotzdem eine Ahnung was das sein kann und wie ich es loswerden kann? Habe den Code bereits kontrolliert und und nix finden können.

...zur Frage

Cross Origin Anfrage blockiert?

Ich möchte gerade eine REST-API für mein Heimnetzwerk einrichten um über z.B. einen button einen CMD befehl auf dem Server PC auszuführen.

Mein Pythonscript für die API:

from flask import Flask, request, jsonify
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

@app.route('/execute-command', methods=['POST'])
def execute_command():
  # Hier wird der Code zum Ausführen des Befehls eingefügt
  result = "Befehl wurde ausgeführt."
  return jsonify({"response": result})

if __name__ == '__main__':
  app.run(host='0.0.0.0', port=5000)

Mein HTML Script<!DOCTYPE html>
<html>
<head>
  <title>API Test</title>
</head>
<body>
  <button id="executeBtn">Befehl ausführen</button>
<script>
  document.getElementById('executeBtn').addEventListener('click', function() {
    fetch('http://localhost:5000/execute-command', { // Verwende absolute URL
      method: 'POST',
    })
    .then(response => response.json())
    .then(data => {
      console.log(data);
    })
    .catch(error => {
      console.error('Fehler:', error);
    });
  });
</script>
</body>
</html>

Ich bekomme als Fehler von Firefox in der Konsole:

Quellübergreifende (Cross-Origin) Anfrage blockiert: Die Gleiche-Quelle-Regel verbietet das Lesen der externen Ressource auf http://localhost:5000/execute-command. (Grund: CORS-Anfrage schlug fehl). Statuscode: (null).

Fehler: TypeError: NetworkError when attempting to fetch resource

Entschuldigung wenn es offensichtlich ist, bin da noch sehr frisch und habe keine Lösung gefunden.

...zur Frage

Ist es noch sinnvoll, NextJS zu lernen?

SEO ist kein Punkt, wenn ich ehrlich bin. Heutzutage können auch Crawler normales React crawlen.

Als Zweites kommt das Server Side Rendering doch nur beim ersten Aufruf der Seite wirklich etwas bringt.

Danach ist es stinknormales React, das nicht mehr im Server für mich ausgeführt wurde und als HTML geschickt wird.

Natürlich sind 0.5-1 Sekunden wichtig, um den Nutzer ein gutes Gefühl zu geben und alles.

Aber warum sollte man sich den Stress mit NextJS antun? So wichtig wie mir diese 0.5 Sekunden auch sind. Man kann auch an anderen Ecken leichter optimieren und komprimieren.

React ist eine leichtgewichtige Bibliothek für ein bisschen Rendering und Next ein richtiges Framework.

Vielleicht ist da noch der Vorteil, das Leute ohne JavaScript wenigstens irgendwas sehen, aber wenn ich ehrlich bin, können einem Menschen mit JavaScript aus egal sein. Das sind fast alle Aluhutträger und die will man nicht in irgendeiner Art ansprechen als Kunde.

Auch keine Menschen die noch Internet Explorer und veraltete Smartphones nutzen. Da nehme ich lieber Rücksicht auf Sehbehinderte.

Was sagt ihr? Macht es noch Sinn, NextJS zu lernen? Warum nutzt ihr das?

...zur Frage

Element-Inhalt abrufen?

Ich programmiere seit einiger Zeit mit HTML CSS und JS und habe mit Getboostrap eine Website erstmals geschrieben, wo mein Ziel es war dass man dort einen Key eingeben kann womit man dann auf eine weitere HTML Datei umgeleitet wird die den Namen hat. Damit meine ich das wenn man als Key hallo123 eingibt das man auf die Seite Hallo.html umgeleitet wird. Ist zwar nicht gerade so sicher aber es reicht für den Start aus. Ich habe jetzt aber das Problem das ich bei "document.getElementById()" nicht dem Inhalt aus dem Eingabe Feld erhalte wodurch man egal was man eingibt zu null.html umgeleitet wird. Weiß jemand wie ich das Behebe?

<!doctype html>
<html lang="en">


<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Mit Projekt-Key herunterladen | LSprojects</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
</head>
<style>
body {
    background-color: rgb(26, 24, 24);
    color: white;
}
.btn  {
    background-color: rgb(161, 156, 156);
    color: white;
}
</style>
<script>
    function submit() {
        let code = document.getElementById(codeinput);
        window.location = "/codes/" + code + ".html"
    }
</script>


<body>
    <div class="vertical-center horizontal-center">
        <h1>Geben sie den Key hier ein:</h1>
        <div class="input-group mb-3 dark-backround">
            <button href="submit()" onclick="submit()" class="btn btn-outline-secondary" type="button"
                id="load">Laden</button>
            <input type="text" class="form-control" placeholder="Projekt-Key" id="codeinput" aria-label=""
                aria-describedby="load">
        </div>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN"
        crossorigin="anonymous"></script>
</body>


</html>

...zur Frage

Erstellte website nicht aufrufbar?

Bin Anfänger im Thema Webseiten und programmieren und habe mir mal ein Tutorial angeschaut. In dem wurde mir erzählt, dass ich mit dem Editor und HTML eine Website erstellen kann. Wenn ich aber nach abspeichern des Editors etc. den Link, der in der Suchtleiste bei Chrome steht bei einem anderen Gerät eingebe, finde ich diese Seite nicht. Ich hatte auch nicht erwartet, dass das erstellen von einer Website auf diese Weise funktioniert, aber was fehlt mir, dass diese Seite, auch wenn es nur eine Testseite sein soll im Internet aufrufbar ist?

...zur Frage

Sollte man nach HTML/CSS nicht lieber PHP lernen, weil man damit die Formulare auf einer Webseite funktionstüchtig machen kann?

Weiß gerade nicht, was ich nach HTML und Css lernen soll... PHP oder Javascript.

Mit dem HTML und CSS kurs bin ich ja bald fertig. Aber wenn man zum Beispiel Formulare in die Seite einbaut, kann man sie doch ohne eine Programmiersprache nicht wirklich benutzen...

Ich hoffe ihr habt verstanden, was ich meine... Danke :)

...zur Frage

Wo kann man eine Internetseite selber programmieren (selbst HTMLund CSS Code schreiben)?

...zur Frage

Website schrift ändert sich nicht?

Font face wurde verwendet.

Ich hatte vorher eine andere Schriftart installiert und ausgewählt in der css datei .

nun zeigt mir die webseite noch immer die alte schrift an, sogar dann, wenn ich die schriftart aus dem ordner entferne oder in der css datei den namen umbenenne. (dann müsste es normalerweise die standard html schrift anzeigen)

...zur Frage

Spenden in HTML erstellen?

Hi,

möchte in meine Website ein Spendenlink einbauen allerdings nicht mit PayPal sondern mit giropay oder Kreditkarte wie bekommt man sowas hin? PS:Kann HTML,CSS und JS

Danke Schonmal

...zur Frage

Wie kann ich den Abstand zwischen HTML-Tags entfernen?

HI, ich programmiere gerade einen Taschenrechner in HTML/CSS/JavaScript und möchte den Abstand zwischen den Elementen entfernen. Margin, Padding und Border sind bereits auf 0 gestellt. Der Abstand ist auch nur horizontal zwischen den Elementen. Vielen Dank im Voraus :-)

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen