{"id":1210,"date":"2020-11-07T11:44:56","date_gmt":"2020-11-07T10:44:56","guid":{"rendered":"https:\/\/ekiwi.de\/?p=1210"},"modified":"2022-12-26T11:27:40","modified_gmt":"2022-12-26T10:27:40","slug":"apache-webserver-dateiliste-ausgeben-mit-htaccess-und-fancyindexing","status":"publish","type":"post","link":"https:\/\/ekiwi.de\/index.php\/1210\/apache-webserver-dateiliste-ausgeben-mit-htaccess-und-fancyindexing\/","title":{"rendered":"Apache Webserver &#8211; Dateiliste ausgeben mit .htaccess und FancyIndexing"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Inhalt<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/ekiwi.de\/index.php\/1210\/apache-webserver-dateiliste-ausgeben-mit-htaccess-und-fancyindexing\/#Videoanleitung\" >Videoanleitung<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/ekiwi.de\/index.php\/1210\/apache-webserver-dateiliste-ausgeben-mit-htaccess-und-fancyindexing\/#Anleitung\" >Anleitung<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/ekiwi.de\/index.php\/1210\/apache-webserver-dateiliste-ausgeben-mit-htaccess-und-fancyindexing\/#Index_anzeigen\" >Index anzeigen<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/ekiwi.de\/index.php\/1210\/apache-webserver-dateiliste-ausgeben-mit-htaccess-und-fancyindexing\/#Fancy_Indexing\" >Fancy Indexing<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/ekiwi.de\/index.php\/1210\/apache-webserver-dateiliste-ausgeben-mit-htaccess-und-fancyindexing\/#Aussehen_von_FancyIndexing_anpassen\" >Aussehen von FancyIndexing anpassen<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/ekiwi.de\/index.php\/1210\/apache-webserver-dateiliste-ausgeben-mit-htaccess-und-fancyindexing\/#Eigene_Icons_verwenden\" >Eigene Icons verwenden<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/ekiwi.de\/index.php\/1210\/apache-webserver-dateiliste-ausgeben-mit-htaccess-und-fancyindexing\/#Verzeichnisse_ausblenden\" >Verzeichnisse ausblenden<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/ekiwi.de\/index.php\/1210\/apache-webserver-dateiliste-ausgeben-mit-htaccess-und-fancyindexing\/#Beschreibungen_hinzufuegen\" >Beschreibungen hinzuf\u00fcgen<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/ekiwi.de\/index.php\/1210\/apache-webserver-dateiliste-ausgeben-mit-htaccess-und-fancyindexing\/#Eigene_Header_und_Footer\" >Eigene Header und Footer<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/ekiwi.de\/index.php\/1210\/apache-webserver-dateiliste-ausgeben-mit-htaccess-und-fancyindexing\/#Fazit\" >Fazit<\/a><\/li><\/ul><\/nav><\/div>\n<p>Wie aktiviere ich das <a title=\"directory path where to find iTunes.exe!\" href=\"https:\/\/ekiwi-blog.de\/en\/26678\/where-is-itunes-exe-found-location-directory-path\/\" target=\"_blank\" rel=\"noopener\">Directory<\/a>-Listing auf meinem Webserver mit .htaccess?<\/p>\n<p><!--more--><\/p>\n<p>Standardm\u00e4\u00dfig erlaubt der Apache-Webserver keine Aufl\u00f6sung von Verzeichnisinhalten. Entweder wird die Standard-Datei, wie die &#8222;index.html&#8220; aufgerufen oder eine Fehlermeldung angezeigt.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1211\" src=\"\/wp-content\/uploads\/2020\/11\/dirlist_1.png\" alt=\"\" width=\"1054\" height=\"310\" srcset=\"\/wp-content\/uploads\/2020\/11\/dirlist_1.png 1054w, \/wp-content\/uploads\/2020\/11\/dirlist_1-300x88.png 300w, \/wp-content\/uploads\/2020\/11\/dirlist_1-1024x301.png 1024w, \/wp-content\/uploads\/2020\/11\/dirlist_1-768x226.png 768w\" sizes=\"auto, (max-width: 1054px) 100vw, 1054px\" \/><\/p>\n<p>Damit soll verhindert werden, dass man Zugriff auf beliebige Ordner erh\u00e4lt und den Inhalt einsehen kann. Manchmal ist dies jedoch erw\u00fcnscht f\u00fcr einen Ordner, z.B. f\u00fcr die Bereitstellung von Downloads.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Videoanleitung\"><\/span>Videoanleitung<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/vtCCUvXaGMU\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<h2><span class=\"ez-toc-section\" id=\"Anleitung\"><\/span>Anleitung<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h3><span class=\"ez-toc-section\" id=\"Index_anzeigen\"><\/span>Index anzeigen<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Mit einer .htaccess-Datei k\u00f6nnen wir das &#8222;DirectoryListing&#8220; jederzeit f\u00fcr einen Ordner und Unterordner aktivieren. Dazu legen wir eine .htaccess Datei mit folgendem Inhalt an:<\/p>\n<pre>Options +Indexes\r\n<\/pre>\n<p>Statt der Fehlermeldung erscheint nun der Verzeichnisindex:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1212\" src=\"\/wp-content\/uploads\/2020\/11\/dirlist_2.png\" alt=\"\" width=\"500\" height=\"254\" srcset=\"\/wp-content\/uploads\/2020\/11\/dirlist_2.png 500w, \/wp-content\/uploads\/2020\/11\/dirlist_2-300x152.png 300w\" sizes=\"auto, (max-width: 500px) 100vw, 500px\" \/><\/p>\n<p>Der Anwender kann nun Dateien anklicken und herunterladen.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Fancy_Indexing\"><\/span>Fancy Indexing<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Funktional ist die Sache, aber schick ist es nicht, alle Dateien und Ordner werden als einfache Liste angezeigt. Besser geht es mit FancyIndexing:<\/p>\n<pre>Options +Indexes\r\nIndexOptions FancyIndexing\r\n<\/pre>\n<p>Rufen wir erneut das Verzechnis auf, erscheinen nun nicht nur Icons, sondern auch weitere Informationen wie das Dateidatum und die Gr\u00f6\u00dfe. Auch eine Sortierung ist m\u00f6glich.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Aussehen_von_FancyIndexing_anpassen\"><\/span>Aussehen von FancyIndexing anpassen<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Die Darstellung l\u00e4sst sich mittels Optionen anpassen:<\/p>\n<ul>\n<li>IconHeight=[px] &#8211; H\u00f6he des Icons<\/li>\n<li>IconWidth=[px] &#8211; Breite des Icons<\/li>\n<li>IconsAreLinks &#8211; Icons sind anklickbar<\/li>\n<li>NameWidth=[N] &#8211; Spaltenbreite des Names, entweder eine Zahl oder * f\u00fcr Breite des l\u00e4ngsten Dateinamens\/li&gt;<\/li>\n<li>ScanHTMLTitles &#8211; Titel einer HTML-Datei als Beschreibung verwenden, Title-Tag wird ausgelesen<\/li>\n<li>SuppressColumnSorting &#8211; Spaltensortierung deaktivieren<\/li>\n<li>SuppressDescription &#8211; Beschreibungsspalte ausblenden<\/li>\n<li>SuppressLastModified &#8211; Letzte \u00c4nderung ausblenden<\/li>\n<li>SuppressSize &#8211; Dateigr\u00f6\u00dfe ausblenden<\/li>\n<li>SuppressHTMLPreamble &#8211; HTML-Header unterbinden, z.B. bei eigenem Header<\/li>\n<li>FoldersFirst &#8211; Verzeichnisse zuerst ausgeben<\/li>\n<li>ShowHidden &#8211; versteckte Dateien anzeigen<\/li>\n<li>HTMLTable &#8211; Listing in HTML-Tabelle ausgeben, z.B. f\u00fcr eigenes CSS<\/li>\n<\/ul>\n<p><strong>Ein Beispiel:<\/strong><\/p>\n<pre>Options +Indexes\r\nIndexOptions FancyIndexing\r\nIndexOptions NameWidth=20 IconHeight=48 IconWidth=48 FoldersFirst SuppressDescription\r\n<\/pre>\n<p>Wir blenden Spalten aus, Ordner kommen an erster Stelle und vergr\u00f6\u00dfern die Icons:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1213\" src=\"\/wp-content\/uploads\/2020\/11\/dirlist_3.png\" alt=\"\" width=\"504\" height=\"521\" srcset=\"\/wp-content\/uploads\/2020\/11\/dirlist_3.png 504w, \/wp-content\/uploads\/2020\/11\/dirlist_3-290x300.png 290w\" sizes=\"auto, (max-width: 504px) 100vw, 504px\" \/><\/p>\n<h3><span class=\"ez-toc-section\" id=\"Eigene_Icons_verwenden\"><\/span>Eigene Icons verwenden<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Wer mag, kann Dateien oder Ordnern eigene Icons verpassen, welche etwas schicker sind:<\/p>\n<pre>Options +Indexes\r\nIndexOptions FancyIndexing\r\nIndexOptions IconHeight=24 IconWidth=24\r\nAddIcon icons\/folder.png ^^DIRECTORY^^\r\nAddIcon icons\/word.png *.doc *.docx\r\n<\/pre>\n<p>Wir f\u00fcgen eigene Icons f\u00fcr Ordner und Word-Dateien ein:<\/p>\n<pre>AddIcon icons\/folder.png ^^DIRECTORY^^\r\nAddIcon icons\/word.png *.doc *.docx\r\n<\/pre>\n<p>Die Ansicht zeigt nun die Icons an.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1214\" src=\"\/wp-content\/uploads\/2020\/11\/dirlist_4.png\" alt=\"\" width=\"591\" height=\"365\" srcset=\"\/wp-content\/uploads\/2020\/11\/dirlist_4.png 591w, \/wp-content\/uploads\/2020\/11\/dirlist_4-300x185.png 300w\" sizes=\"auto, (max-width: 591px) 100vw, 591px\" \/><\/p>\n<h3><span class=\"ez-toc-section\" id=\"Verzeichnisse_ausblenden\"><\/span>Verzeichnisse ausblenden<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Die Icons liegen im Ordner &#8222;icons&#8220;, soll der Benutzer darauf keinen Zugriff mehr haben, k\u00f6nnen wir den Ordner auch ausblenden.<\/p>\n<pre>IndexIgnore icons\r\n<\/pre>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1219\" src=\"\/wp-content\/uploads\/2020\/11\/dirlist_icons_ausblenden.png\" alt=\"\" width=\"340\" height=\"250\" srcset=\"\/wp-content\/uploads\/2020\/11\/dirlist_icons_ausblenden.png 340w, \/wp-content\/uploads\/2020\/11\/dirlist_icons_ausblenden-300x221.png 300w, \/wp-content\/uploads\/2020\/11\/dirlist_icons_ausblenden-90x65.png 90w\" sizes=\"auto, (max-width: 340px) 100vw, 340px\" \/><\/p>\n<p>Auch Dateien und Dateiendungen lassen sich filtern:<\/p>\n<pre>IndexIgnore icons *.docx *.pdf\r\n<\/pre>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1215\" src=\"\/wp-content\/uploads\/2020\/11\/dirlist_5.png\" alt=\"\" width=\"551\" height=\"268\" srcset=\"\/wp-content\/uploads\/2020\/11\/dirlist_5.png 551w, \/wp-content\/uploads\/2020\/11\/dirlist_5-300x146.png 300w\" sizes=\"auto, (max-width: 551px) 100vw, 551px\" \/><\/p>\n<h3><span class=\"ez-toc-section\" id=\"Beschreibungen_hinzufuegen\"><\/span>Beschreibungen hinzuf\u00fcgen<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Verzeichnisse und Dateien lassen sich auch mit einer Beschreibung versehen:<\/p>\n<pre>AddDescription \"X-Akten\" Unterverzeichnis\r\nAddDescription \"Stopp-Uhr f\u00fcr Windows\" TimeTool.exe\r\n<\/pre>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1216\" src=\"\/wp-content\/uploads\/2020\/11\/dirlist_6.png\" alt=\"\" width=\"622\" height=\"282\" srcset=\"\/wp-content\/uploads\/2020\/11\/dirlist_6.png 622w, \/wp-content\/uploads\/2020\/11\/dirlist_6-300x136.png 300w\" sizes=\"auto, (max-width: 622px) 100vw, 622px\" \/><\/p>\n<h3><span class=\"ez-toc-section\" id=\"Eigene_Header_und_Footer\"><\/span>Eigene Header und Footer<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Das Design l\u00e4sst sich mit einem eigenen Header, Footer oder CSS-Code erweitern. Wichtig ist, dass man bei den &#8222;IndexOptions&#8220; die Option &#8222;SuppressHTMLPreamble&#8220; setzt, welche die HTML-Ausgabe entsprechend anpasst.<\/p>\n<pre>IndexOptions SuppressHTMLPreamble\r\nHeaderName icons\/head.html\r\nReadmeName icons\/foot.html\r\n<\/pre>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1217\" src=\"\/wp-content\/uploads\/2020\/11\/dirlist_7.png\" alt=\"\" width=\"632\" height=\"490\" srcset=\"\/wp-content\/uploads\/2020\/11\/dirlist_7.png 632w, \/wp-content\/uploads\/2020\/11\/dirlist_7-300x233.png 300w\" sizes=\"auto, (max-width: 632px) 100vw, 632px\" \/><\/p>\n<p>Die Dateien legen wir der Einfachheit halber in den Ordner &#8222;icons&#8220; mit ab. Der Inhalt ist HTML-Code f\u00fcr den Header und den Footer:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1218\" src=\"\/wp-content\/uploads\/2020\/11\/dirlist_8.png\" alt=\"\" width=\"858\" height=\"273\" srcset=\"\/wp-content\/uploads\/2020\/11\/dirlist_8.png 858w, \/wp-content\/uploads\/2020\/11\/dirlist_8-300x95.png 300w, \/wp-content\/uploads\/2020\/11\/dirlist_8-768x244.png 768w\" sizes=\"auto, (max-width: 858px) 100vw, 858px\" \/><\/p>\n<h2><span class=\"ez-toc-section\" id=\"Fazit\"><\/span>Fazit<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Mit der Indexoption und FancyIndexing kann man sehr flexibel den Verzeichnisinhalt von Ordnern kontrollieren und das Design grafisch ansprechend aufbereiten. Viel Spa\u00df beim Ausprobieren.<\/p>","protected":false},"excerpt":{"rendered":"<p>Wie aktiviere ich das Directory-Listing auf meinem Webserver mit .htaccess?<\/p>\n","protected":false},"author":1,"featured_media":159,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_links_to":"","_links_to_target":""},"categories":[12],"tags":[73,26,172,108],"class_list":["post-1210","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-server","tag-apache","tag-htaccess","tag-tutorial","tag-video"],"_links":{"self":[{"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/posts\/1210","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/comments?post=1210"}],"version-history":[{"count":0,"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/posts\/1210\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/media\/159"}],"wp:attachment":[{"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/media?parent=1210"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/categories?post=1210"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/tags?post=1210"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}