Question

How can I put my JS and CSS files outside the public folder? I have a library that I’d like all my websites to use and for easy updating, have this outside a particular website public folder so it can be easily read by all. Is this possible or do I need to host it all on another domain (I’d rather not for ease).

htaccess possibly?

Answer 1

To properly expand on Jamie Wong’s response:

You can easily do this using a PHP file acting as a controller – but you must also remember to send the correct content headers otherwise the browser might not recognised the CSS for what it is.

You also need a bit of security checks to make sure there’s no file traversal

// /public_html/style.php

$cssDir = realname(dirname(__FILE__) . '/../css/';

if (!isset($_GET['sheet'])) {
  header('HTTP/1.1 404 Not Found');
  exit;
}

$file = realpath($cssDir . $_GET['sheet'] . '.css');
if (!$file) {
  header('HTTP/1.1 404 Not Found');
  exit;
}

if (substr($file, 0, strlen($cssDir) != $cssDir) {
  // because we've sanitized using realpath - this must match
  header('HTTP/1.1 404 Not Found'); // or 403 if you really want to - maybe log it in errors as an attack?
  exit;
}

header('Content-type: text/css');
echo file_get_contents($file);
exit;

You can go further than this, and set up .htaccess rewrites to map CSS requests like /css/main.css to this controller:

RewriteEngine On
RewriteRule ^css/(*.).css$ /style.php?sheet=$1 [L]