Most web servers have directory browsing disabled, but sometimes you want it to work for certain directories. Most web servers also allow you to setup specific settings for your directories for instance you could do it with an .htaccess file on Apache. But if you don't have access to your web server, you can create a directory index pretty easily with ColdFusion's cfdirectory tag.
I have whipped up a simple one you can use, just save the following code as index.cfm in the directory where you want to see a file listing:
<!DOCTYPE html>
<html>
<head><title><cfoutput>#Replace(cgi.script_name, "index.cfm", "")#</cfoutput></title>
<style type="text/css">
body,td { font-family: verdana; padding: 2px 0px 2px 0px; color:silver; }
th { border-bottom: 1px solid silver;text-align:left;margin-bottom: 2px; color:black; }
a.sort { text-decoration: none; color: silver; }
a:hover { background-color: blue; color: white; }
p { font-size: x-small; }
</style>
</head>
<body>
<cfparam name="url.sort" default="datelastmodified desc">
<cfdirectory directory="#ExpandPath("./")#" action="list" name="dir" sort="#url.sort#">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<th>Name <a href="?sort=name" class="sort" title="Sort By Name">∨</a></th>
<th>Size (bytes) <a href="?sort=size" class="sort" title="Sort By Size">∨</a></th>
<th>Last Modified <a href="?sort=datelastmodified+desc" class="sort" title="Sort By Date">∨</a></th>
</tr>
<cfoutput query="dir">
<cfif dir.name IS NOT "index.cfm">
<tr>
<td><a href="#dir.name#">#dir.name#</a></td>
<td>#dir.size#</td>
<td>#dir.datelastmodified#</td>
</tr>
</cfif>
</cfoutput>
</table>
<p>Directory Browser by <a href="https://www.petefreitag.com/">Pete Freitag</a></p>
</body>
</html>
You can see a slightly modified version of this script on the daily mashup archives page.
Comments
What if you want to be able to change that directory in via the browser? Like, if type EQ dir then open that folder and show a new directory, but if it's a file show the file in the browser.
I guess for security reasons I don't allow you to browse just any directory. You could modify the script to allow that, but make sure your not creating security holes.
This is in a secured area, but I'm having trouble getting this to work. Right now I'm trying to concatenate the folder onto the path... but it's not working just right. Any thoughts?
Hi Don, I get a 404 File not Found error when trying to access that file. But chances are if you don't ColdFusion installed. You can get it from Adobe.com Apache does have a built in mechanism for directory browsing. See my apache cheat sheet for an example: http://www.petefreitag.com/cheatsheets/apache/
Hi Pete, thanks for the code. I set the default sort to filename, but what if I wanted directories listed first (sorted), then the files sorted by name? Thanks! - J P.S. Your link to your cheat sheet has a problem.
So useful! Thank your Pete!
Pete, Thanks I allowed my CF server to process html files and just thru the script in there for when I'm doing testing and can't remember the directory for a file off the top of my head. It's a great help!
Hi Pete, Many thanks for this post. Do you know if it's possible to select a folder with CF? I'm trying to implement a batch upload and processing module and I'd like the user to select a folder containing all the files that need to be uploaded, instead of either selecting each file one by one, or doing multiple upload. After selecting the folder, I can easily use cfdirectory to list all the files and process each one. This is not a problem. I have tested the following with a hard-coded directory and it works great! <cfdirectory directory="#variables.selectedDirectory#" action="list" name="qDir"> Now, I want to make it more dynamic, i.e. the #variables.selectedDirectory# would depend on which folder the user would select. How can we do this in CF?
@Yogesh - You can't do that unless CF has access to the folder (through a network share or something). CFDirectory can only list files and folders that are accessible to the server. If you want to let the browser pick a folder then you need to use Flash, or another method.