Skip to main content

Die 5 besten VS-Code-Erweiterungen für mehr Sicherheit

Artikel von
blog feature toolkit

24. August 2023

0 Min. Lesezeit
Top 5 VS Code SECURITY Extensions

Die Entwicklung hochwertiger Softwareanwendungen kann mühsam sein, denn für eine funktionierende Lösung müssen viele Komponenten zusammenspielen. Deshalb brauchen Entwickler jede verfügbare Unterstützung und Erleichterung – besonders, wenn es darum geht, ihre Anwendungen abzusichern.

Visual Studio Code (VS Code) zählt aus mehreren Gründen zu den beliebtesten Open-Source-Code-Editoren. Es ist mit den drei wichtigsten Betriebssystemen (OS) kompatibel – Windows, macOS und Linux – und lässt sich ganz einfach an die eigenen Vorlieben anpassen. Besonders wichtig: Mit Erweiterungen können wir seinen Funktionsumfang ausbauen.

Für VS Code gibt es eine Vielzahl von Erweiterungen, von einfachen Änderungen an der Benutzeroberfläche (UI) bis hin zu fortschrittlicher Schwachstellenerkennung. Dieser Artikel konzentriert sich auf Letztere und stellt die fünf besten VS-Code-Erweiterungen vor, mit denen wir sichereren Code schreiben und bewährte Sicherheitspraktiken einhalten können.

1. Schützen Sie Geheimnisse und Passwörter mit 1Password

Passwörter und Geheimnisse als Klartext im Code zu speichern, ist ein erhebliches Sicherheitsrisiko, da dadurch vertrauliche Informationen leicht offengelegt werden können. Es empfiehlt sich, diese Werte in einem externen Tresor abzulegen und über Variablen darauf zuzugreifen.

Beim Schreiben von Code ist es jedoch mühsam, ständig zwischen Code-Editor und Passwort-Tresor hin und her zu wechseln, um neue Geheimnisse und Passwörter zu erstellen oder vorhandene Werte zu überprüfen. 1Password für VS Code ist eine Erweiterung, die dieses Problem beheben soll, indem sie den Zugriff auf den Tresor direkt im VS-Code-Editor ermöglicht.

Hier finden Sie einen Überblick über die wichtigsten Funktionen von 1Password.

Zunächst können Sie über die Befehlspalette von VS Code ein neues Passwort erstellen. Markieren Sie einfach einen Wert und führen Sie anschließend den Befehl `1Password: Save in 1Password` aus.

Visual Studio Code zeigt eine .env-Datei mit ACCESS_TOKEN- und PASSWORD-Einträgen, während die Befehlspalette „1Password: In 1Password speichern“ anbietet.

So können Sie den Eintrag benennen, automatisch in 1Password speichern und den Verweis im Code ersetzen.

Mit der automatischen Erkennung von Geheimnissen lässt sich diese Funktion noch erweitern. Die 1Password-VS-Code-Erweiterung erkennt und markiert potenzielle Geheimnis- oder Passwortwerte im Code und in Konfigurationsdateien für Umgebungsvariablen.

Dunkler Code-Editor mit einer .env-Datei, in der ACCESS_TOKEN und PASSWORD stehen, sowie den Hinweisen „In 1Password speichern“

Die CodeLens-Funktion von VS Code – ein leistungsstarkes Tool, das Beziehungen zwischen Codeelementen direkt im Code-Editor anzeigt – blendet über der markierten Option In 1Password speichern ein. Wie im Bild oben zu sehen, erhalten wir über diese Option schnellen Zugriff auf den Befehl `Save in 1Password`.

Mit den Befehlen `1Password: Get from 1Password` und `1Password: Generate password` können Sie außerdem vorhandene Einträge aus dem Tresor abrufen und neue erstellen. Auch diese Funktionen erleichtern Entwicklern die Arbeit mit geheimen Werten: Sie müssen den Code-Editor nicht verlassen und können im Arbeitsfluss bleiben.

Schließlich können Sie mit der 1Password-VS-Code-Erweiterung im Tresor gespeicherte Geheimnisse einsehen und in der Vorschau anzeigen, wenn im Code auf sie verwiesen wird. Wenn Sie den Mauszeiger über ein Geheimnis bewegen, wird sein aktueller Wert angezeigt – allerdings nur bei nicht vertraulichen Geheimnissen. Vertrauliche Werte wie Passwörter lassen sich nicht in der Vorschau anzeigen und bleiben so geschützt.

2. Führen Sie mit Decompiler ein Reverse Engineering von ausführbaren Dateien durch

Decompiler werden manchmal verwendet, um kompilierten Code zurück in den Quellcode zu übersetzen, damit Entwickler ihn untersuchen können. Dekompilierung ist ein wertvolles Werkzeug im Sicherheitsbereich. Sie ermöglicht es Sicherheitsexperten, die Sicherheit von Software zu bewerten und sogar das Verhalten von Malware zu verstehen. Dafür ist je nach Art der ausführbaren Datei häufig spezielle oder unterschiedliche Software erforderlich.

Decompiler ist eine VS-Code-Erweiterung, die Dekompilierungsfunktionen direkt in VS Code bereitstellt. Sie können Binärdateien wie Windows-PE-, Linux-ELF-, IOS-, JAR- und Android-APK-Dateien in VS Code dekompilieren. Klicken Sie dazu einfach mit der rechten Maustaste auf die Datei und wählen Sie Dekompilieren aus.

Kontextmenü von Visual Studio Code mit der Option „Decompile“ für test-jar-1.0.jar und einem Hinweis, dass die Datei binär ist oder eine nicht unterstützte Textkodierung verwendet.

Die dekompilierten Dateien werden anschließend in einem Ordner namens Decompiler bereitgestellt. Bei JAR-Dateien wird das Archiv in die darin enthaltenen Ordner und Dateien entpackt. So erhalten Sie Zugriff auf die ursprünglichen Java-Dateien, wie im folgenden Bild zu sehen.

Visual Studio Code zeigt App.java mit einem Java-Hello-World-Programm und einem aufgeklappten Test-JAR-Paket im Explorer.

Durch die Dekompilierung können potenzielle Sicherheitslücken im Code sichtbar werden, etwa Pufferüberläufe oder Race Conditions. Wenn wir diese Schwachstellen aufdecken, können wir feststellen, ob die Software sicher ist, und sie beheben, bevor die Software veröffentlicht wird.

Mit der Dekompilierung können wir auch das Verhalten von Code aus Drittanbieterquellen verstehen, etwa von Bibliotheken und APIs, die häufig in kompilierter Form bereitgestellt werden. Durch die Dekompilierung solcher Komponenten können wir ihre Eignung für Entwicklungsprojekte bewerten und Sicherheitslücken erkennen.

3. Verbergen Sie vertrauliche Werte mit Cloak

Entwickler, die an Anwendungen mit Konfigurationsdateien für Umgebungsvariablen arbeiten, in denen Geheimnisse und Passwörter stehen, möchten diese vielleicht vor anderen verbergen. In einer kollaborativen Umgebung oder an einem öffentlichen Ort wie einem Café ist das jedoch schwierig, denn dort kann jeder auf den Bildschirm schauen. Es ist umständlich und beeinträchtigt die Produktivität, die Werte zu schützen, indem man ständig über die Schulter schaut oder die Datei gar nicht erst öffnet.

Hier sehen Sie ein Beispiel für eine .env-Datei mit einem API-Schlüssel und einem Passwort. Jeder, der den Bildschirm sehen kann, kann die Werte dieser Variablen lesen:

Visual Studio Code zeigt eine .env-Datei mit sichtbaren Umgebungsvariablen für ACCESS_TOKEN und PASSWORD.

Abhilfe schafft die VS-Code-Erweiterung Cloak. Cloak wurde dafür entwickelt, geheime Werte auf dem Bildschirm auszublenden, wenn eine Konfigurationsdatei für Umgebungsvariablen geöffnet ist. Um Cloak zu aktivieren, öffnen Sie die Befehlspalette von VS Code und führen Sie den Befehl `Cloak: Hide Secrets` aus. Die Werte werden daraufhin auf dem Bildschirm ausgeblendet:

Visual Studio Code mit einer .env-Datei, die leere Felder für die Umgebungsvariablen ACCESS_TOKEN und PASSWORD zeigt

Diese Erweiterung verändert die Dateien in keiner Weise. Sie maskiert lediglich die Werte von Geheimnissen, damit sie nicht angezeigt werden. Cloak schützt Geheimnisse und Passwörter vor neugierigen Blicken in öffentlichen Umgebungen. So können wir weiterarbeiten und gleichzeitig die Sicherheit unserer Anwendungen gewährleisten.

4. Bewährte Sicherheitspraktiken mit der ESLint-Erweiterung

Bei der Absicherung von JavaScript-Projekten erkennen die meisten modernen Erweiterungen lediglich Sicherheitsindikatoren. Entwickler brauchen jedoch häufig Tools, die sich in Softwarebereitstellungspipelines integrieren lassen, um Sicherheitsprüfungen zu automatisieren.

Die ESLint-Erweiterung ist ein Open-Source-Linting-Tool, das beim Schreiben von JavaScript in VS Code zum Einsatz kommt. Aufgrund seiner dynamischen und schwach typisierten Natur ist JavaScript bekanntermaßen anfällig für Entwicklerfehler. ESLint wirkt dem entgegen, indem es den Code analysiert und sicherstellt, dass er syntaktisch korrekt ist und bewährten Praktiken und Standards entspricht. Die Erweiterung hebt Syntaxfehler im Code hervor, damit wir sie schnell erkennen und beheben können. Außerdem hilft sie dabei, Fehler und potenzielle Code-Schwachstellen aufzuspüren und so die Codeintegrität zu verbessern.

ESLint eignet sich gut dazu, Code-Standards durchzusetzen – besonders bei Teamprojekten. Mit dieser Erweiterung halten sich alle Teammitglieder an dieselben automatisierten Stil- und Standardvorgaben.

Sehen wir uns dazu das folgende Codebeispiel an:

Visual Studio Code mit einer JavaScript-Datei mit Begrüßungsvariablen und console.log-Anweisungen

Hier verwendet die Konstante greeting doppelte Anführungszeichen, während `secondGreeting` in einfache Anführungszeichen gesetzt ist. Beachten Sie außerdem, dass einige Zeilen mit einem Semikolon enden und andere nicht. Trotz dieser kleinen Abweichungen wird der Code korrekt ausgeführt, da die Zeilen syntaktisch gültig sind.

Bei der Arbeit an einem gemeinsamen Projekt ist es jedoch wichtig, dass alle Teammitglieder einheitliche Konventionen einhalten. Mit ESLint können wir das durchsetzen, indem wir Regeln festlegen oder die Standard-Linting-Einstellungen des ESLint-Pakets verwenden. Diese Einstellungen lassen sich auch anpassen:

Visual Studio Code zeigt eine ESLint-Warnung, dass in JavaScript-Code einfache Anführungszeichen verwendet werden müssen.

Für ESLint gibt es außerdem eigene Plugins, etwa das Security-Plugin. Damit lassen sich schlechte Sicherheitspraktiken erkennen, darunter die Verwendung unsicherer regulärer Ausdrücke oder der Funktion `eval`. Mit diesem Plugin können wir den Code bereits während der Entwicklung in VS Code überprüfen. So stellen wir sicher, dass die Anwendung geschützt ist und Probleme behoben werden, bevor der Code die Build-Pipelines durchläuft.

5. Scannen Sie Code und Pakete von Drittanbietern mit Snyk

Schwachstellen im Code zu erkennen und zu beheben, ist entscheidend für die Entwicklung sicherer Softwaresysteme. Wir müssen diese Probleme schnell angehen, bevor Angreifer sie ausnutzen können. Der ständige Wechsel zwischen Code-Editor und Schwachstellen-Scanner kann jedoch mühsam und zeitaufwendig sein.

Die Snyk-VS-Code-Erweiterung schafft Abhilfe, indem sie Schwachstellenscans und die Behebung von Problemen direkt im VS-Code-Editor ermöglicht. Die Erweiterung scannt den Code auf folgende Arten von Problemen:

  • Open-Source-Sicherheit – Sicherheitslücken in den Open-Source-Abhängigkeiten unserer Projekte.

  • Code-Sicherheit – Sicherheitslücken in unserem Code.

  • Codequalität – die Qualität unseres Codes.

  • Infrastructure-as-Code-Sicherheit (IaC) – Konfigurationsprobleme in IaC-Vorlagendateien, etwa für Kubernetes und Terraform.

Die Snyk-Codeanalyse wird automatisch ausgeführt, wenn wir einen Projektordner öffnen. Manuelle Scans können wir ebenfalls ganz einfach starten, indem wir in der Befehlspalette `Snyk: Rescan` ausführen.

Visual Studio Code mit der Snyk-Erweiterung. Der Befehl „Snyk: Rescan“ ist ausgewählt, und die Sicherheitsscans laufen.

Die Snyk-Erweiterung erkennt außerdem potenzielle Schwachstellen und hebt sie bereits während des Schreibens im Code hervor. Sie beschreibt das Problem und seinen Schweregrad und gibt Hinweise auf bewährte Praktiken zur Vorbeugung.

Visual Studio Code markiert einen fest codierten API-Schlüssel in JavaScript mit einer Snyk-Warnung zu CWE-798.

Außerdem bietet die Erweiterung einen Überblick über die Ergebnisse verschiedener Scans unseres Codes:

Snyk-Sicherheitsdashboard in Visual Studio Code mit Open-Source-Sicherheit, Sicherheitslücken im Code, Konfigurationsstatus und Problemen mit der Codequalität

Mit der Schwachstellenerkennung in Echtzeit und detaillierten Schritten zur Behebung hilft uns Snyk für VS Code, Sicherheit zu priorisieren, ohne unseren Arbeitsablauf zu unterbrechen.

Fazit

Die besten Entwickler schreiben sicheren, sauberen und wartbaren Code – und diese fünf Erweiterungen können uns dabei helfen. 1Password schützt Passwörter vor Dritten, indem sie nicht im Code gespeichert werden. ESLint unterstützt beim Schreiben von syntaktisch korrektem und fehlerfreiem Code, der bewährten Praktiken entspricht. Mit Decompiler können wir den Quellcode ausführbarer Dateien untersuchen und auf Malware prüfen. Cloak blendet vertrauliche Werte auf dem Bildschirm aus. Und schließlich scannt die Snyk-VS-Code-Erweiterung Code schnell und präzise auf Schwachstellen.

Bevor Sie VS-Code-Erweiterungen installieren, sollten Sie sich über die Erweiterung und das dahinterstehende Unternehmen informieren. Erweiterungen können die Sicherheit verbessern, doch eine schlechte Erweiterung kann Geheimnisse und Passwörter Ihrer Anwendung offenlegen.

Wer einem Drittanbieter die Passwortspeicherung anvertraut, überträgt ihm auch die Verantwortung für deren Sicherheit. Deshalb sollten Sie Drittanbieter vor der Installation von Erweiterungen überprüfen – insbesondere, wenn es um die Verwaltung von Passwörtern und Geheimnissen geht.

Eine Universallösung für sicherere Anwendungen gibt es nicht. Je nach Projekt eignen sich manche dieser Erweiterungen besser oder sind relevanter als andere. Jede bietet jedoch einzigartige Vorteile, die den VS-Code-Editor noch praktischer machen können.

Probieren Sie diese Erweiterungen noch heute aus und erleben Sie selbst, was sie bewirken können.

Gepostet in: