Hi!
How can I prevent from downloading my external Javascript and external CSS files from web server. As anyone who can view my web page code, can easily download my javascript and CSS files?
Is there any method or settings through htaccess file to prevent from downloading/copying files?
2- How can I prevent from viewing directory listing on my web server?
Thanks in advance
the best way to prevent someone from downloading your js or css files is by not putting them on the web
regarding directory listings, this depends on your web server
No, it’s not possible. If the browser can get at it, so can any user. The only thing you can do with javascript is obfuscate it with something like packer. With CSS all you can really do is remove whitespace in the declaration block.
Still, I don’t think this is very nice and goes against the spirit of the internet. Sure, people do steal, but it’s the same with anything. Most people like looking at CSS and JS to learn how something has been done.
Nobody should be able to see the directory if an index.html page is present because it will be loaded automatically when the directory is selected. Just use index.html pages without any content.
Why would you want to block them? r937 had the best answer to that question. Removing the ability to view source files would be taking away from the spirit of the Internet. While it’s entirely possible that someone is going to steal your design and scripts, I wouldn’t spend any time and effort trying to prevent. Rather, try and create something custom and unique that is copy writable, but even fighting copywrite violations can be a waste of time.
For the browser to use them they have to be downloaded to each visitor’s computer first so if you don’t want them to be downloaded there is no point in creating them in the first place since if they are not downloadable then the web page can’t use them.
Directory Listing: For Apache, this usually works: create an .htaccess file, and inside it put:
Options -Indexes
There are tools you can use to obfuscate your JavaScript and CSS, but as everyone else has emphasized above, resistance is useless.
Having a home page in the folder makes the -Indexes redundant. Easy enough to view the source of any HTML to see what JavaScript files it uses and call them directly. The -Indexes doesn’t block that.
The only real way of protecting your JScript is to run it under ASP.NET server side to generate the HTML there rather than updating it in the browser.
The htaccess approach is useful, however, when you have nested directory structures that you’re too lazy to add index files to.
.htaccess…? yawn
You know how easy it is to circumvent that… hey… 2 options. Craft a HTTP request (XmlHttp could even do that in JavaScript…) or take a look in the browser cache…
dull dull dull.
Try this: http://www.tutorialized.com/view/tutorial/CSS-File-Protection/22900
Anybody who knows to look in the browser cache will of course be able to read your file, but in most cases people just aren’t that clever…
Two mouse clicks and I got:
body, html {
margin: 0;
padding: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #333333;
font-size: 12px;
}
body {
background: #222;
text-align: center;
background: url(images/header-repeat.png) repeat-x;
}
#header {
height: 128px;
background: url(images/header-left.png) no-repeat left;
}
#footer {
background: url(images/bottom-background.png) repeat-x;
height: 117px;
color: #fff;
}
#mainmenu {
padding: 0;
margin: 0;
list-style-type: none;
height: 52px;
background: url(images/menu-background.png);
}
#mainmenu li {
float: right;
line-height: 52px;
background: url(images/menu-border.png) right no-repeat;
padding-right: 2px;
}
#mainmenu a {
display: block;
padding: 0 24px;
text-decoration: none;
color: #333333;
font-size: 12px;
}
#mainmenu a:hover {
background: url(images/menu-background-hover.png);
display: block;
padding: 0 24px;
text-decoration: none;
color: #333333;
font-size: 12px;
}
#main {
width: 768px;
background: url(images/background.png) no-repeat;
margin: 0 auto;
margin-top: 16px;
text-align: left;
min-height: 300px;
}
.minimain {
width: 768px;
margin: 0 auto;
margin-top: 16px;
text-align: left;
}
.h1 {
padding: 0;
margin: 0 8px;
line-height: 40px;
font-weight: bold;
font-size: 20px;
font-family: Geneva, Arial, Helvetica, sans-serif;
color: #260;
}
.p {
line-height: 140%;
padding: 0;
letter-spacing: 0px;
margin: 0 16px;
margin-bottom: 16px;
}
.code {
border: 1px solid #cccc66;
background: #ffff99;
margin: 16px;
font-family:"Courier New", Courier, monospace;
font-size: 12px;
padding: 6px;
white-space: pre;
}
.img {
margin-left: 16px;
margin-bottom: 16px;
}
.a {
text-decoration: none;
color: #005;
}
.a:hover {
color: #339;
}
.clear {
clear: both;
font-size: 0px;
}
#iconmenu {
margin: 0;
padding: 0;
height: 58px;
}
#iconmenu li {
display: inline;
}
#iconmenu a {
padding-top: 34px;
background: url(images/icons/32photoshop-bw.png) top center no-repeat;
text-decoration: none;
display: block;
float: right;
margin: 0 8px;
}
.pagelist {
text-decoration: none;
color: #333;
background: url(64x64icon.png) no-repeat 6px #eee;
display: block;
height: 68px;
padding: 4px 0;
padding-left: 76px;
border: 1px solid #ddd;
margin: 4px 8px;
}
.pagelist:hover {
border: 1px solid #ccc;
background-color: #ff9;
}
.lists3 {
width: 255px;
margin: 0;
padding: 0;
float: left;
list-style-type: none;
}
#randomtutorials a {
padding-left: 34px;
background: url(images/icons/32photoshop-bw.png) no-repeat;
text-decoration: none;
display: block;
height: 34px;
margin-bottom: 8px;
}
That is as many mouse clicks as it would have taken me to access the CSS or JavaScript from any web page (the first mouse click displays the HTML source with all of the external files displayed as links).
Per above, the best you can do is obfuscation if this is something running on the client. However, most of us here have benefited from others code, so…
Why not take the opposite approach? Comment your code, or point a reader to a pretty-print commented version. Maybe even set up a “how we did this cool effect” page. Encourage people to use your code.
Maybe you have actually come up with something new…a fix for an obscure bug, or some new visual effect. If so, spread the word. It’s likely the amount of goodwill towards your company will increase with this approach. Imagine people pointing others to your site to see the “Dr Dumb99 Fix” (fill your name or company name here).
Kid Koala
.htaccess…? yawn
You know how easy it is to circumvent that… hey… 2 options. Craft a HTTP request (XmlHttp could even do that in JavaScript…) or take a look in the browser cache…
dull dull dull.
I am giving the parent post the benefit of the doubt and assuming that the block directory listing question was separate from his copying/downloading question. It is quite a legitimate question, although it has nothing to do with source protection.