-
Notifications
You must be signed in to change notification settings - Fork 83
/
Copy pathVERSIONING.txt
85 lines (54 loc) · 3.25 KB
/
VERSIONING.txt
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
VERSIONING JS & CSS SCRIPTS
Browser caching have two sides:
On one side it's incredibly helpful for optimizing bandwidth, but
on the dark side, it's a really pain in the butt for developers.
I tried everything:
mochaui-1.0.0.5679.js
mochaui.js?v=1.0.0.5679
mochaui.js?t=145098231
They all worked, but not perfect.
Problem is how to inform the browser on newer JS or CSS scripts,
so it grab the newer script instead of the cached copy.
With a little .htaccess tweeking and some PHP & JS code, MochaUI
can keep track of modified JS & CSS scripts and feed them to the
browser when needed, with doing nothing more than saving the newer
JS or CSS version.
A LITTLE WARNING.
Foreknowledge of Apache's httpd.conf configuration
is required. The module mod_rewrite needs to be active:
LoadModule rewrite_module modules/mod_rewrite.so
and the directive AllowOverride needs to be set to All in the
proper directory:
AllowOverride All
Require all granted
</Directory>
Let's start by adding or creating the following instructions to .htaccess:
#Rules for Versioned Static Files
Options +FollowSymLinks -Multiviews -Indexes
RewriteEngine on
RewriteRule ^(.*)\.[\d]+\.(css|js)$ $1.$2 [L]
Those instructions inform the Apache server that every JS & CSS filename
will have one format and needs to be change to another format:
ui/scripts/mochaui.1410414879.js => ui/scripts/mochaui.js
ui/scripts/desktop-init.1410414508.js => ui/scripts/desktop-init.js
ui/Source/Themes/default/css/desktop.1409895042.css => ui/Source/Themes/default/css/desktop.css
You need to place the .htaccess file in the root directory of your website, and/or in any other directory
that calls JS & CSS scripts.
Numbers inside the name are generated by a PHP script called autoversion.php, located at the Source directory.
In the directory Source/Core there's a modified version of require.js, named require_with_versioning.js
in order to test your server modifications first without breaking your current site.
To add versioning inside your current PHP code, you need to do the following:
// Include the versioning function
require_once("autoversion.php");
// Add as many extra scripts as needed, like this:
echo "<script type='text/javascript' src='".autoVersion("ui/scripts/mochaui.js")."'></script>";
echo "<link rel='stylesheet' type='text/css' href='".autoVersion("ui/css/main.css")."' />";
Those lines are only PHP sample code and are here for information purpose only.
You need to code you're own <script> and <link> tags in order to make autoversion.php work for you.
I hope this is helpful to you as it is to me.
RoberNET
UPDATE: I made a project work, out of the box, in a GoDaddy's shared hosting simply downloading
all the files in the proper directory. The file .htaccess did it's job, with one exception:
files inside directory /windows/js, I don't know the reason yet. So I place them inside /ui/js,
changed some code and worked.
I have no reason to think this solution will behave differently in other hosting providers.