{"id":19960,"date":"2023-01-17T18:51:58","date_gmt":"2023-01-17T17:51:58","guid":{"rendered":"http:\/\/blog.wenzlaff.de\/?p=19960"},"modified":"2023-01-17T19:03:03","modified_gmt":"2023-01-17T18:03:03","slug":"rest-service-absichern-mit-helmet-in-5-minuten-und-2-zeilen-code","status":"publish","type":"post","link":"http:\/\/blog.wenzlaff.de\/?p=19960","title":{"rendered":"REST-Service absichern mit  Helmet in 5 Minuten und 2 Zeilen Code"},"content":{"rendered":"<p>In <a href=\"http:\/\/blog.wenzlaff.de\/?p=19947\" rel=\"noopener\" target=\"_blank\">diesem Beitrag<\/a>, hatte ich gezeigt, wie man in 5 Min. einen REST-Service erstellen kann. Wer noch 5 Minuten \u00fcber hat, kann den Service auch sicherer machen mit Helmet.<\/p>\n<p><a href=\"https:\/\/www.npmjs.com\/package\/helmet\" rel=\"noopener\" target=\"_blank\">Helmet<\/a> ist ein Express.js-Modul, das es Entwicklern erm\u00f6glicht, sicherheitsrelevante HTTP-Header f\u00fcr ihre Anwendungen zu setzen. Es ist einfach zu installieren und zu verwenden und kann in 2 Zeilen Code integriert werden.<\/p>\n<p><a href=\"https:\/\/www.npmjs.com\/package\/helmet\" rel=\"noopener\" target=\"_blank\">Helmet<\/a> setzt eine Reihe von HTTP-Headern, die die Sicherheit Ihrer Webanwendung erh\u00f6hen k\u00f6nnen, indem sie gef\u00e4hrliche Verhaltensweisen von Browsern und anderen Clients verhindern. Einige Beispiele f\u00fcr die von Helmet gesetzten Header sind:<\/p>\n<ul>\n<li>X-XSS-Protection: Schaltet den XSS-Schutz (Cross-Site Scripting) im Browser ein.<\/li>\n<li> X-Frame-Options: Verhindert, dass die Anwendung in einem Frame oder einem iframe geladen wird, was eine Art von Angriff namens &#8222;Clickjacking&#8220; verhindert.<\/li>\n<li>X-Content-Type-Options: Verhindert, dass der Browser die MIME-Type einer Ressource automatisch erkennt, was eine Art von Angriff namens &#8222;MIME-Sniffing&#8220; verhindert.<\/li>\n<li> Content-Security-Policy: Legt Regeln fest, die festlegen, welche Ressourcen von einer Seite geladen werden d\u00fcrfen und welche nicht, was dazu beitr\u00e4gt, Cross-Site-Scripting-Angriffe zu verhindern.<\/li>\n<\/ul>\n<p>Es gibt noch viele <a href=\"https:\/\/expressjs.com\/de\/advanced\/best-practice-security.html\" rel=\"noopener\" target=\"_blank\">andere<\/a> Header die helmet setzt, um die Sicherheit zu erh\u00f6hen.<\/p>\n<p>Diese Schritte sind n\u00f6tig, in dem Verzeichnis von <a href=\"http:\/\/blog.wenzlaff.de\/?p=19947\" rel=\"noopener\" target=\"_blank\">dem Projekt<\/a>:<\/p>\n<p>1. installieren von <a href=\"https:\/\/helmetjs.github.io\/\" rel=\"noopener\" target=\"_blank\">helmet (github.io)<\/a><\/p>\n<pre class=\"lang:default decode:true \" >npm install helmet<\/pre>\n<p>2. <a href=\"https:\/\/expressjs.com\/de\/advanced\/best-practice-security.html\" rel=\"noopener\" target=\"_blank\">Helmet<\/a> im Code aufrufen<\/p>\n<pre class=\"lang:default decode:true \" >const helmet = require('helmet');\r\n\r\napp.use(helmet());\r\n<\/pre>\n<p>Wenn der REST-Server gestartet wird ohne helmet, sieht der Header so aus:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/blog.wenzlaff.de\/wp-content\/uploads\/2023\/01\/ohne-helmet.png\" alt=\"\" width=\"1168\" height=\"830\" class=\"aligncenter size-full wp-image-19962\" srcset=\"http:\/\/blog.wenzlaff.de\/wp-content\/uploads\/2023\/01\/ohne-helmet.png 1168w, http:\/\/blog.wenzlaff.de\/wp-content\/uploads\/2023\/01\/ohne-helmet-300x213.png 300w, http:\/\/blog.wenzlaff.de\/wp-content\/uploads\/2023\/01\/ohne-helmet-1024x728.png 1024w, http:\/\/blog.wenzlaff.de\/wp-content\/uploads\/2023\/01\/ohne-helmet-768x546.png 768w\" sizes=\"auto, (max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px\" \/><\/p>\n<p>und mit <a href=\"https:\/\/expressjs.com\/de\/advanced\/best-practice-security.html\" rel=\"noopener\" target=\"_blank\">helmet<\/a>, es sind die Header gesetzt:<!--more--><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/blog.wenzlaff.de\/wp-content\/uploads\/2023\/01\/mit-helmet.png\" alt=\"\" width=\"2690\" height=\"1156\" class=\"aligncenter size-full wp-image-19961\" srcset=\"http:\/\/blog.wenzlaff.de\/wp-content\/uploads\/2023\/01\/mit-helmet.png 2690w, http:\/\/blog.wenzlaff.de\/wp-content\/uploads\/2023\/01\/mit-helmet-300x129.png 300w, http:\/\/blog.wenzlaff.de\/wp-content\/uploads\/2023\/01\/mit-helmet-1024x440.png 1024w, http:\/\/blog.wenzlaff.de\/wp-content\/uploads\/2023\/01\/mit-helmet-768x330.png 768w, http:\/\/blog.wenzlaff.de\/wp-content\/uploads\/2023\/01\/mit-helmet-1536x660.png 1536w, http:\/\/blog.wenzlaff.de\/wp-content\/uploads\/2023\/01\/mit-helmet-2048x880.png 2048w\" sizes=\"auto, (max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px\" \/><\/p>\n<p>Hier noch das ganze Beispiel der <strong>index.js <\/strong>mit helmet:<\/p>\n<pre class=\"lang:default decode:true \" >const express = require(\"express\");\r\nconst helmet = require('helmet');\r\nconst app = express();\r\n\r\napp.use(express.json());\r\napp.use(helmet());\r\n\r\n\/\/ http:\/\/localhost:5500\/silbersee.jpeg  Datei muss im \/public Verzeichnis liegen\r\napp.use(express.static(\"public\"));\r\n\r\napp.get(\"\/api\", function (req, res) {\r\n  res.status(200).json({ message: \"Hallo Kleinhirn.eu\" });\r\n});\r\napp.get(\"\/api\/info\", function (req, res) {\r\n  res.status(200).json({ message: \"Thomas Wenzlaff\" });\r\n});\r\napp.get(\"\/api\/pis\", (req, res) =&gt; {\r\n  const pis = [\r\n    { id: 1, name: \"Raspberry Pi W Zero\" },\r\n    { id: 2, name: \"Raspberry Pi 3\" },\r\n    { id: 3, name: \"Raspberry Pi 4\" },\r\n  ];\r\n  res.json(pis);\r\n});\r\n\r\nconst port = process.env.PORT || 5500;\r\n\r\napp.listen(port, () =&gt; console.log(`Server h\u00f6rt an Port: ${port}`));<\/pre>\n<p>Um spezifische Header zu setzen, k\u00f6nnen Sie die entsprechenden Methoden von Helmet verwenden. Beispielsweise k\u00f6nnen Sie den <strong>x-frame-options<\/strong> Header auf &#8222;<strong>deny<\/strong>&#8220; setzen, indem Sie die helmet.frameguard() Methode verwenden:<\/p>\n<pre class=\"lang:default decode:true \" >app.use(helmet.frameguard({ action: 'deny' }));<\/pre>\n<p>Es gibt viele andere Methoden, die von Helmet angeboten werden, um spezifische Header zu setzen. Sie k\u00f6nnen die Dokumentation von Helmet konsultieren, um weitere Informationen dar\u00fcber zu erhalten, welche Methoden verf\u00fcgbar sind und wie sie verwendet werden.<\/p>\n<p>Es ist wichtig zu beachten, dass die Verwendung von Helmet allein die Sicherheit Ihrer Anwendung nicht garantiert, sondern nur eine erg\u00e4nzende Ma\u00dfnahme darstellt. Es ist wichtig, sicherheitsrelevante Best Practices bei der Entwicklung und Konfiguration Ihrer Anwendung zu ber\u00fccksichtigen und regelm\u00e4\u00dfig Sicherheitstests durchzuf\u00fchren.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In diesem Beitrag, hatte ich gezeigt, wie man in 5 Min. einen REST-Service erstellen kann. Wer noch 5 Minuten \u00fcber hat, kann den Service auch sicherer machen mit Helmet. Helmet ist ein Express.js-Modul, das es Entwicklern erm\u00f6glicht, sicherheitsrelevante HTTP-Header f\u00fcr ihre Anwendungen zu setzen. Es ist einfach zu installieren und zu verwenden und kann in &hellip; <\/p>\n<p class=\"link-more\"><a href=\"http:\/\/blog.wenzlaff.de\/?p=19960\" class=\"more-link\"><span class=\"screen-reader-text\">\u201eREST-Service absichern mit  Helmet in 5 Minuten und 2 Zeilen Code\u201c <\/span>weiterlesen<\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[220,1319,7],"tags":[5355,176],"class_list":["post-19960","post","type-post","status-publish","format-standard","hentry","category-anleitung","category-sicherheit-2","category-tools","tag-helmet","tag-sicherheit"],"_links":{"self":[{"href":"http:\/\/blog.wenzlaff.de\/index.php?rest_route=\/wp\/v2\/posts\/19960","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/blog.wenzlaff.de\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/blog.wenzlaff.de\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/blog.wenzlaff.de\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"http:\/\/blog.wenzlaff.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=19960"}],"version-history":[{"count":0,"href":"http:\/\/blog.wenzlaff.de\/index.php?rest_route=\/wp\/v2\/posts\/19960\/revisions"}],"wp:attachment":[{"href":"http:\/\/blog.wenzlaff.de\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=19960"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/blog.wenzlaff.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=19960"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/blog.wenzlaff.de\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=19960"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}