Version Description
- Fixed bug which caused the new "Convert non-existing webp-files upon request" not to work on all setups
Download this release
Release Info
Developer | rosell.dk |
Plugin | WebP Express |
Version | 0.11.1 |
Comparing to | |
See all releases |
Code changes from version 0.11.0 to 0.11.1
- README.md +173 -8
- README.txt +171 -13
- changelog.txt +3 -0
- webp-express.php +1 -1
- wod/webp-realizer.php +2 -14
README.md
CHANGED
@@ -142,29 +142,194 @@ Easy enough. Browsers looks at the *content type* header rather than the URL to
|
|
142 |
I am btw considering making an option to have the plugin redirect to the webp instead of serving immediately. That would remove the apparent mismatch between file extension and content type header. However, the cost of doing that will be an extra request for each image, which means extra time and worse performance. I believe you'd be ill advised to use that option, so I guess I will not implement it. But perhaps you have good reasons to use it? If you do, please let me know!
|
143 |
|
144 |
### I am on NGINX / OpenResty
|
145 |
-
It is possible to make WebP Express work on NGINX, but it requires manually inserting redirection rules in the NGINX configuration file (nginx.conf or the configuration file for the site, found in `/etc/nginx/sites-available`).
|
146 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
147 |
```
|
148 |
-
|
149 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
150 |
}
|
|
|
151 |
```
|
|
|
|
|
|
|
152 |
|
153 |
-
|
|
|
154 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
155 |
```
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
156 |
if ($http_accept ~* "webp"){
|
157 |
-
rewrite ^/(.*).(jpe?g|png)$ /wp-content/plugins/webp-express/wod/webp-on-demand.php?
|
158 |
}
|
|
|
159 |
```
|
160 |
|
161 |
-
|
162 |
|
163 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
164 |
|
165 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
166 |
|
167 |
Discussion on this topic [here](https://wordpress.org/support/topic/nginx-rewrite-rules-4/)
|
|
|
|
|
168 |
|
169 |
### I am on a WAMP stack
|
170 |
It has been reported that WebP Express *almost* works on WAMP stack (Windows, Apache, MySQL, PHP). I'd love to debug this, but do not own a Windows server or access to one... Can you help?
|
142 |
I am btw considering making an option to have the plugin redirect to the webp instead of serving immediately. That would remove the apparent mismatch between file extension and content type header. However, the cost of doing that will be an extra request for each image, which means extra time and worse performance. I believe you'd be ill advised to use that option, so I guess I will not implement it. But perhaps you have good reasons to use it? If you do, please let me know!
|
143 |
|
144 |
### I am on NGINX / OpenResty
|
145 |
+
It is possible to make WebP Express work on NGINX, but it requires manually inserting redirection rules in the NGINX configuration file (nginx.conf or the configuration file for the site, found in `/etc/nginx/sites-available`).
|
146 |
|
147 |
+
There are two different approaches to achieve the redirections. One based on *rewrite* and one based on *try_files*. As *try_files* performs best, I shall recommend that.
|
148 |
+
|
149 |
+
#### method 1 (try_files)
|
150 |
+
|
151 |
+
Lets take this step by step.
|
152 |
+
First step is to redirect images to the script. Second step is redirecting directly to existing webp images. Finally, as an optional third step, you can add extra rules for enabling the *Convert non-existing webp-files upon request* functionality
|
153 |
+
|
154 |
+
**Step 1**: *Redirecting images to the script*
|
155 |
+
|
156 |
+
The following will redirect all images under wp-content to the script, but only for webp-enabled browsers.
|
157 |
+
|
158 |
+
Insert the following in the `server` context of your configuration file (usually found in `/etc/nginx/sites-available`). The `server` context is the part of the configuration that starts with "server {" and ends with the matching "}".
|
159 |
+
|
160 |
+
```nginx
|
161 |
+
location ~* ^/?wp-content/.*\.(png|jpe?g)$ {
|
162 |
+
add_header Vary Accept;
|
163 |
+
if ($http_accept !~* "webp"){
|
164 |
+
break;
|
165 |
+
}
|
166 |
+
try_files
|
167 |
+
/nonexisting-because-try-files-needs-fallback
|
168 |
+
/wp-content/plugins/webp-express/wod/webp-on-demand.php?xsource=x$request_filename&wp-content=wp-content
|
169 |
+
;
|
170 |
+
}
|
171 |
```
|
172 |
+
*Beware when copy/pasting: You might get html-encoded characters. Verify that the ampersand before "wp-content" isn't encoded*
|
173 |
+
|
174 |
+
If you have moved wp-content to a non-standard place, you must change accordingly. Especially note that you must also change the wp-content parameter to the script. It expects a relative path to wp-content (from document root) and is needed so the script can find the configuration file.
|
175 |
+
|
176 |
+
The `xsource` parameter helps the script finding the source file. It is only needed on some setups. You can try deleting it and see if it still works.
|
177 |
+
|
178 |
+
Beware that if you haven't enabled *png* conversion, you should replace "(png|jpe?g)" with "jpe?g", so the first line becomes:
|
179 |
+
```nginx
|
180 |
+
location ~* ^/?wp-content/.*\.jpe?g$ {
|
181 |
+
```
|
182 |
+
|
183 |
+
If you cannot get this to work then perhaps you need to add the following to your `mime.types` configuration file:
|
184 |
+
`image/webp webp;`
|
185 |
+
|
186 |
+
If you still cannot get it to work, you can instead try *method 2*
|
187 |
+
|
188 |
+
|
189 |
+
**Step 2**: *Redirecting directly to existing webp images.*
|
190 |
+
|
191 |
+
Once you got this working, lets improve performance by redirecting directly to existing webp images. This step isn't necessary, as the script also does that - but invoking the php script takes more resources that the direct redirect. Also, a direct redirect will produce *ETag* response header, which is increases caching performance.
|
192 |
+
|
193 |
+
The second step builds on Eugene Lazutkins solution original published [here](http://www.lazutkin.com/blog/2014/02/23/serve-files-with-nginx-conditionally/).
|
194 |
+
|
195 |
+
The rules looks for existing webp files by appending ".webp" to the URL. So for this to work, you must configure *WebP Express* to store the converted files like that:
|
196 |
+
1. Set *Destination folder* to *mingled*
|
197 |
+
2. Set *File extension* to *Append ".webp"*
|
198 |
+
|
199 |
+
|
200 |
+
Now, place the following in the `server` context (replacing what you inserted in step 1):
|
201 |
+
```nginx
|
202 |
+
# WebP Express rules
|
203 |
+
# --------------------
|
204 |
+
location ~* ^/?wp-content/.*\.(png|jpe?g)$ {
|
205 |
+
add_header Vary Accept;
|
206 |
+
# expires 365d;
|
207 |
+
if ($http_accept !~* "webp"){
|
208 |
+
break;
|
209 |
+
}
|
210 |
+
try_files
|
211 |
+
$uri.webp
|
212 |
+
/wp-content/plugins/webp-express/wod/webp-on-demand.php?xsource=x$request_filename&wp-content=wp-content
|
213 |
+
;
|
214 |
}
|
215 |
+
# ------------------- (WebP Express rules ends here)
|
216 |
```
|
217 |
+
*Beware when copy/pasting: You might get html-encoded characters. Verify that the ampersand before "wp-content" isn't encoded*
|
218 |
+
|
219 |
+
Again, beware that if you haven't enabled *png* conversion, you should replace "(png|jpe?g)" with "jpe?g".
|
220 |
|
221 |
+
**Step 3:**: *Caching*
|
222 |
+
In most cases you can and should allow images to be cached for a long period. To do that, simply uncomment the "expires 365d;" line, by removing the "#" in front of it.
|
223 |
|
224 |
+
**Step 4:**: *Routing non-existing webp requests to converter*
|
225 |
+
|
226 |
+
Simply add the following rules below the ones you added in step 2:
|
227 |
+
|
228 |
+
```nginx
|
229 |
+
location ~* ^/?wp-content/.*\.(png|jpe?g)\.webp$ {
|
230 |
+
try_files
|
231 |
+
$uri
|
232 |
+
/wp-content/plugins/webp-express/wod/webp-realizer.php?wp-content=wp-content
|
233 |
+
;
|
234 |
+
}
|
235 |
```
|
236 |
+
|
237 |
+
Again, beware that if you haven't enabled *png* conversion, you should replace "(png|jpe?g)" with "jpe?g".
|
238 |
+
|
239 |
+
|
240 |
+
#### method 2 (rewrite)
|
241 |
+
|
242 |
+
**Step 1**: *Redirecting images to the script*
|
243 |
+
|
244 |
+
Insert the following in the `server` context:
|
245 |
+
|
246 |
+
```nginx
|
247 |
+
# WebP Express rules
|
248 |
+
# --------------------
|
249 |
if ($http_accept ~* "webp"){
|
250 |
+
rewrite ^/(.*).(jpe?g|png)$ /wp-content/plugins/webp-express/wod/webp-on-demand.php?wp-content=wp-content break;
|
251 |
}
|
252 |
+
# ------------------- (WebP Express rules ends here)
|
253 |
```
|
254 |
|
255 |
+
**Step 2**: *Redirecting directly to existing webp images.*
|
256 |
|
257 |
+
Insert the following in the `server` context (replacing the rules you inserted in step 1)
|
258 |
+
```nginx
|
259 |
+
# WebP Express rules
|
260 |
+
# --------------------
|
261 |
+
location ~* ^/wp-content/.*\.(png|jpe?g)$ {
|
262 |
+
add_header Vary Accept;
|
263 |
+
expires 365d;
|
264 |
+
}
|
265 |
+
location ~* ^/wp-content/.*\.webp$ {
|
266 |
+
expires 365d;
|
267 |
+
if ($whattodo = AB) {
|
268 |
+
add_header Vary Accept;
|
269 |
+
}
|
270 |
+
}
|
271 |
+
if ($http_accept ~* "webp"){
|
272 |
+
set $whattodo A;
|
273 |
+
}
|
274 |
+
if (-f $request_filename.webp) {
|
275 |
+
set $whattodo "${whattodo}B";
|
276 |
+
}
|
277 |
+
if ($whattodo = AB) {
|
278 |
+
rewrite ^(.*) $1.webp last;
|
279 |
+
}
|
280 |
+
if ($whattodo = A) {
|
281 |
+
rewrite ^/wp-content/.*\.(jpe?g|png)$ /wp-content/plugins/webp-express/wod/webp-on-demand.php?xsource=x$request_filename&wp-content=wp-content break;
|
282 |
+
}
|
283 |
+
# ------------------- (WebP Express rules ends here)
|
284 |
+
```
|
285 |
+
*Beware when copy/pasting: You might get html-encoded characters. Verify that the ampersand before "wp-content" isn't encoded*
|
286 |
+
|
287 |
+
Again, `wp-content` argument must point to the wp-content folder (relative to document root). In most installations, it is 'wp-content'.
|
288 |
+
|
289 |
+
And again, the rules looks for existing webp files by appending ".webp" to the URL. So for this to work, you must configure *WebP Express* to store the converted files like that:
|
290 |
+
1. Set *Destination folder* to *mingled*
|
291 |
+
2. Set *File extension* to *Append ".webp"*
|
292 |
+
|
293 |
+
The "expires 365d;" lines set caching to one year. You can remove these lines if you wish.
|
294 |
+
|
295 |
+
I have not set any expire on the webp-on-demand.php request. This is not needed, as the script sets this according to what you set up in WebP Express settings. Also, trying to do it would require a new location block matching webp-on-demand.php, but that would override the location block handling php files, and thus break the functionality.
|
296 |
+
|
297 |
+
It is possible to put this stuff inside a `location` directive. However, having `if` directives inside `location` directives [is considered evil](https://www.nginx.com/resources/wiki/start/topics/depth/ifisevil/). But it seems that in our case, it works. If you wish to do that, use the following rules instead:
|
298 |
+
|
299 |
+
```nginx
|
300 |
+
# WebP Express rules
|
301 |
+
# --------------------
|
302 |
+
location ~* ^/wp-content/.*\.(png|jpe?g)$ {
|
303 |
+
add_header Vary Accept;
|
304 |
+
expires 365d;
|
305 |
+
|
306 |
+
if ($http_accept ~* "webp"){
|
307 |
+
set $whattodo A;
|
308 |
+
}
|
309 |
+
if (-f $request_filename.webp) {
|
310 |
+
set $whattodo "${whattodo}B";
|
311 |
+
}
|
312 |
+
if ($whattodo = AB) {
|
313 |
+
rewrite ^(.*) $1.webp last;
|
314 |
+
}
|
315 |
+
if ($whattodo = A) {
|
316 |
+
rewrite ^/wp-content/.*\.(jpe?g|png)$ /wp-content/plugins/webp-express/wod/webp-on-demand.php?xsource=x$request_filename&wp-content=wp-content last;
|
317 |
+
}
|
318 |
+
}
|
319 |
|
320 |
+
location ~* ^/wp-content/.*\.webp$ {
|
321 |
+
expires 365d;
|
322 |
+
if ($whattodo = AB) {
|
323 |
+
add_header Vary Accept;
|
324 |
+
}
|
325 |
+
}
|
326 |
+
# ------------------- (WebP Express rules ends here)
|
327 |
+
```
|
328 |
+
*Beware when copy/pasting: You might get html-encoded characters. Verify that the ampersand before "wp-content" isn't encoded*
|
329 |
|
330 |
Discussion on this topic [here](https://wordpress.org/support/topic/nginx-rewrite-rules-4/)
|
331 |
+
And here: https://github.com/rosell-dk/webp-express/issues/166
|
332 |
+
|
333 |
|
334 |
### I am on a WAMP stack
|
335 |
It has been reported that WebP Express *almost* works on WAMP stack (Windows, Apache, MySQL, PHP). I'd love to debug this, but do not own a Windows server or access to one... Can you help?
|
README.txt
CHANGED
@@ -4,7 +4,7 @@ Donate link: https://ko-fi.com/rosell
|
|
4 |
Tags: webp, images, performance
|
5 |
Requires at least: 4.0
|
6 |
Tested up to: 5.0
|
7 |
-
Stable tag: 0.11.
|
8 |
Requires PHP: 5.6
|
9 |
License: GPLv3
|
10 |
License URI: https://www.gnu.org/licenses/gpl-3.0.html
|
@@ -150,29 +150,184 @@ Easy enough. Browsers looks at the *content type* header rather than the URL to
|
|
150 |
I am btw considering making an option to have the plugin redirect to the webp instead of serving immediately. That would remove the apparent mismatch between file extension and content type header. However, the cost of doing that will be an extra request for each image, which means extra time and worse performance. I believe you'd be ill advised to use that option, so I guess I will not implement it. But perhaps you have good reasons to use it? If you do, please let me know!
|
151 |
|
152 |
= I am on NGINX / OpenResty =
|
153 |
-
It is possible to make WebP Express work on NGINX, but it requires manually inserting redirection rules in the NGINX configuration file (nginx.conf or the configuration file for the site, found in `/etc/nginx/sites-available`).
|
154 |
|
155 |
-
|
156 |
-
|
157 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
158 |
}
|
159 |
-
|
|
|
160 |
|
161 |
-
If
|
162 |
|
163 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
164 |
if ($http_accept ~* "webp"){
|
165 |
-
rewrite ^/(.*).(jpe?g|png)$ /wp-content/plugins/webp-express/wod/webp-on-demand.php?
|
166 |
}
|
167 |
-
|
168 |
|
169 |
-
|
170 |
|
171 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
172 |
|
173 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
174 |
|
175 |
Discussion on this topic [here](https://wordpress.org/support/topic/nginx-rewrite-rules-4/)
|
|
|
|
|
176 |
|
177 |
= I am on a WAMP stack =
|
178 |
It has been reported that WebP Express *almost* works on WAMP stack. I'd love to debug this, but do not own a Windows server or access to one... Can you help?
|
@@ -419,6 +574,9 @@ Easy enough! - [Go here!](https://ko-fi.com/rosell). Or [here](https://buymeacof
|
|
419 |
|
420 |
== Changelog ==
|
421 |
|
|
|
|
|
|
|
422 |
= 0.11.0 =
|
423 |
* Alter HTML to point to webp files (choose between picture tags or simply altering all image urls)
|
424 |
* Convert non-existing webp-files upon request (means you can reference the converted webp files before they are actually converted!)
|
4 |
Tags: webp, images, performance
|
5 |
Requires at least: 4.0
|
6 |
Tested up to: 5.0
|
7 |
+
Stable tag: 0.11.1
|
8 |
Requires PHP: 5.6
|
9 |
License: GPLv3
|
10 |
License URI: https://www.gnu.org/licenses/gpl-3.0.html
|
150 |
I am btw considering making an option to have the plugin redirect to the webp instead of serving immediately. That would remove the apparent mismatch between file extension and content type header. However, the cost of doing that will be an extra request for each image, which means extra time and worse performance. I believe you'd be ill advised to use that option, so I guess I will not implement it. But perhaps you have good reasons to use it? If you do, please let me know!
|
151 |
|
152 |
= I am on NGINX / OpenResty =
|
153 |
+
It is possible to make WebP Express work on NGINX, but it requires manually inserting redirection rules in the NGINX configuration file (nginx.conf or the configuration file for the site, found in `/etc/nginx/sites-available`).
|
154 |
|
155 |
+
There are two different approaches to achieve the redirections. One based on *rewrite* and one based on *try_files*. As *try_files* performs best, I shall recommend that.
|
156 |
+
|
157 |
+
**method 1 (try_files)**
|
158 |
+
|
159 |
+
Lets take this step by step.
|
160 |
+
First step is to redirect images to the script. Second step is redirecting directly to existing webp images. Finally, as an optional third step, you can add extra rules for enabling the *Convert non-existing webp-files upon request* functionality
|
161 |
+
|
162 |
+
**Step 1**: *Redirecting images to the script*
|
163 |
+
|
164 |
+
The following will redirect all images under wp-content to the script, but only for webp-enabled browsers.
|
165 |
+
|
166 |
+
Insert the following in the `server` context of your configuration file (usually found in `/etc/nginx/sites-available`). "The `server` context" refers to the part of the configuration that starts with "server {" and ends with the matching "}".
|
167 |
+
|
168 |
+
`
|
169 |
+
location ~* ^/?wp-content/.*\.(png|jpe?g)$ {
|
170 |
+
add_header Vary Accept;
|
171 |
+
if ($http_accept !~* "webp"){
|
172 |
+
break;
|
173 |
+
}
|
174 |
+
try_files
|
175 |
+
/nonexisting-because-try-files-needs-fallback
|
176 |
+
/wp-content/plugins/webp-express/wod/webp-on-demand.php?xsource=x$request_filename&wp-content=wp-content
|
177 |
+
;
|
178 |
}
|
179 |
+
`
|
180 |
+
*Beware when copy/pasting: You might get html-encoded characters. Verify that the ampersand before "wp-content" isn't encoded*
|
181 |
|
182 |
+
If you have moved wp-content to a non-standard place, you must change accordingly. Especially note that you must also change the wp-content parameter to the script. It expects a relative path to wp-content (from document root) and is needed so the script can find the configuration file.
|
183 |
|
184 |
+
The `xsource` parameter helps the script finding the source file. It is only needed on some setups. You can try deleting it and see if it still works.
|
185 |
+
|
186 |
+
Beware that if you haven't enabled *png* conversion, you should replace "(png|jpe?g)" with "jpe?g", so the first line becomes:
|
187 |
+
`
|
188 |
+
location ~* ^/?wp-content/.*\.jpe?g$ {
|
189 |
+
`
|
190 |
+
|
191 |
+
If you cannot get this to work then perhaps you need to add the following to your `mime.types` configuration file:
|
192 |
+
`
|
193 |
+
image/webp webp;
|
194 |
+
`
|
195 |
+
|
196 |
+
If you still cannot get it to work, you can instead try *method 2*
|
197 |
+
|
198 |
+
|
199 |
+
**Step 2**: *Redirecting directly to existing webp images.*
|
200 |
+
|
201 |
+
Once you got this working, lets improve performance by redirecting directly to existing webp images. This step isn't necessary, as the script also does that - but invoking the php script takes more resources that the direct redirect. Also, a direct redirect will produce *ETag* response header, which is increases caching performance.
|
202 |
+
|
203 |
+
The rules looks for existing webp files by appending ".webp" to the URL. So for this to work, you must configure *WebP Express* to store the converted files like that:
|
204 |
+
1. Set *Destination folder* to *mingled*
|
205 |
+
2. Set *File extension* to *Append ".webp"*
|
206 |
+
|
207 |
+
Now, place the following in the `server` context (replacing what you inserted in step 1):
|
208 |
+
|
209 |
+
`
|
210 |
+
location ~* ^/?wp-content/.*\.(png|jpe?g)$ {
|
211 |
+
add_header Vary Accept;
|
212 |
+
expires 365d;
|
213 |
+
if ($http_accept !~* "webp"){
|
214 |
+
break;
|
215 |
+
}
|
216 |
+
try_files
|
217 |
+
$uri.webp
|
218 |
+
/wp-content/plugins/webp-express/wod/webp-on-demand.php?xsource=x$request_filename&wp-content=wp-content
|
219 |
+
;
|
220 |
+
}
|
221 |
+
`
|
222 |
+
*Beware when copy/pasting: You might get html-encoded characters. Verify that the ampersand before "wp-content" isn't encoded*
|
223 |
+
|
224 |
+
Again, beware that if you haven't enabled *png* conversion, you should replace "(png|jpe?g)" with "jpe?g".
|
225 |
+
|
226 |
+
Credits: This second step builds on [Eugene Lazutkins solution](http://www.lazutkin.com/blog/2014/02/23/serve-files-with-nginx-conditionally/).
|
227 |
+
|
228 |
+
**Step 3:**: *Caching*
|
229 |
+
In most cases you can and should allow images to be cached for a long period. If you do not want to do that, simply remove the "expires 365d;" line.
|
230 |
+
|
231 |
+
**Step 4:**: *Routing requests for non-existing webps to the converter*
|
232 |
+
|
233 |
+
Simply add the following rules below the ones you added in step 2:
|
234 |
+
|
235 |
+
`
|
236 |
+
location ~* ^/?wp-content/.*\.(png|jpe?g)\.webp$ {
|
237 |
+
try_files
|
238 |
+
$uri
|
239 |
+
/wp-content/plugins/webp-express/wod/webp-realizer.php?wp-content=wp-content
|
240 |
+
;
|
241 |
+
}
|
242 |
+
`
|
243 |
+
|
244 |
+
Again, beware that if you haven't enabled *png* conversion, you should replace "(png|jpe?g)" with "jpe?g".
|
245 |
+
|
246 |
+
|
247 |
+
**method 2 (rewrite)**
|
248 |
+
|
249 |
+
**Step 1**: *Redirecting images to the script*
|
250 |
+
|
251 |
+
Insert the following in the `server` context:
|
252 |
+
|
253 |
+
`
|
254 |
if ($http_accept ~* "webp"){
|
255 |
+
rewrite ^/(.*).(jpe?g|png)$ /wp-content/plugins/webp-express/wod/webp-on-demand.php?wp-content=wp-content break;
|
256 |
}
|
257 |
+
`
|
258 |
|
259 |
+
**Step 2**: *Redirecting directly to existing webp images.*
|
260 |
|
261 |
+
Insert the following in the `server` context (replacing the rules you inserted in step 1)
|
262 |
+
`
|
263 |
+
location ~* ^/wp-content/.*\.(png|jpe?g)$ {
|
264 |
+
add_header Vary Accept;
|
265 |
+
expires 365d;
|
266 |
+
}
|
267 |
+
location ~* ^/wp-content/.*\.webp$ {
|
268 |
+
expires 365d;
|
269 |
+
if ($whattodo = AB) {
|
270 |
+
add_header Vary Accept;
|
271 |
+
}
|
272 |
+
}
|
273 |
+
if ($http_accept ~* "webp"){
|
274 |
+
set $whattodo A;
|
275 |
+
}
|
276 |
+
if (-f $request_filename.webp) {
|
277 |
+
set $whattodo "${whattodo}B";
|
278 |
+
}
|
279 |
+
if ($whattodo = AB) {
|
280 |
+
rewrite ^(.*) $1.webp last;
|
281 |
+
}
|
282 |
+
if ($whattodo = A) {
|
283 |
+
rewrite ^/wp-content/.*\.(jpe?g|png)$ /wp-content/plugins/webp-express/wod/webp-on-demand.php?xsource=x$request_filename&wp-content=wp-content break;
|
284 |
+
}
|
285 |
+
`
|
286 |
+
*Beware when copy/pasting: You might get html-encoded characters. Verify that the ampersand before "wp-content" isn't encoded*
|
287 |
+
|
288 |
+
Again, `wp-content` argument must point to the wp-content folder (relative to document root). In most installations, it is 'wp-content'.
|
289 |
+
|
290 |
+
And again, the rules looks for existing webp files by appending ".webp" to the URL. So for this to work, you must configure *WebP Express* to store the converted files like that:
|
291 |
+
1. Set *Destination folder* to *mingled*
|
292 |
+
2. Set *File extension* to *Append ".webp"*
|
293 |
+
|
294 |
+
The "expires 365d;" lines set caching to one year. You can remove these lines if you wish.
|
295 |
+
|
296 |
+
I have not set any expire on the webp-on-demand.php request. This is not needed, as the script sets this according to what you set up in WebP Express settings. Also, trying to do it would require a new location block matching webp-on-demand.php, but that would override the location block handling php files, and thus break the functionality.
|
297 |
+
|
298 |
+
It is possible to put this stuff inside a `location` directive. However, having `if` directives inside `location` directives [is considered evil](https://www.nginx.com/resources/wiki/start/topics/depth/ifisevil/). But it seems that in our case, it works. If you wish to do that, use the following rules instead:
|
299 |
+
|
300 |
+
`
|
301 |
+
location ~* ^/wp-content/.*\.(png|jpe?g)$ {
|
302 |
+
add_header Vary Accept;
|
303 |
+
expires 365d;
|
304 |
+
|
305 |
+
if ($http_accept ~* "webp"){
|
306 |
+
set $whattodo A;
|
307 |
+
}
|
308 |
+
if (-f $request_filename.webp) {
|
309 |
+
set $whattodo "${whattodo}B";
|
310 |
+
}
|
311 |
+
if ($whattodo = AB) {
|
312 |
+
rewrite ^(.*) $1.webp last;
|
313 |
+
}
|
314 |
+
if ($whattodo = A) {
|
315 |
+
rewrite ^/wp-content/.*\.(jpe?g|png)$ /wp-content/plugins/webp-express/wod/webp-on-demand.php?xsource=x$request_filename&wp-content=wp-content last;
|
316 |
+
}
|
317 |
+
}
|
318 |
|
319 |
+
location ~* ^/wp-content/.*\.webp$ {
|
320 |
+
expires 365d;
|
321 |
+
if ($whattodo = AB) {
|
322 |
+
add_header Vary Accept;
|
323 |
+
}
|
324 |
+
}
|
325 |
+
`
|
326 |
+
*Beware when copy/pasting: You might get html-encoded characters. Verify that the ampersand before "wp-content" isn't encoded*
|
327 |
|
328 |
Discussion on this topic [here](https://wordpress.org/support/topic/nginx-rewrite-rules-4/)
|
329 |
+
And here: https://github.com/rosell-dk/webp-express/issues/166
|
330 |
+
|
331 |
|
332 |
= I am on a WAMP stack =
|
333 |
It has been reported that WebP Express *almost* works on WAMP stack. I'd love to debug this, but do not own a Windows server or access to one... Can you help?
|
574 |
|
575 |
== Changelog ==
|
576 |
|
577 |
+
= 0.11.1 =
|
578 |
+
* Fixed bug which caused the new "Convert non-existing webp-files upon request" not to work on all setups
|
579 |
+
|
580 |
= 0.11.0 =
|
581 |
* Alter HTML to point to webp files (choose between picture tags or simply altering all image urls)
|
582 |
* Convert non-existing webp-files upon request (means you can reference the converted webp files before they are actually converted!)
|
changelog.txt
CHANGED
@@ -1,3 +1,6 @@
|
|
|
|
|
|
|
|
1 |
= 0.11.0 =
|
2 |
* Alter HTML to point to webp files (choose between picture tags or simply altering all image urls)
|
3 |
* Convert non-existing webp-files upon request (means you can reference the converted webp files before they are actually converted!)
|
1 |
+
= 0.11.1 =
|
2 |
+
* Fixed bug which caused the new "Convert non-existing webp-files upon request" not to work on all setups
|
3 |
+
|
4 |
= 0.11.0 =
|
5 |
* Alter HTML to point to webp files (choose between picture tags or simply altering all image urls)
|
6 |
* Convert non-existing webp-files upon request (means you can reference the converted webp files before they are actually converted!)
|
webp-express.php
CHANGED
@@ -3,7 +3,7 @@
|
|
3 |
* Plugin Name: WebP Express
|
4 |
* Plugin URI: https://github.com/rosell-dk/webp-express
|
5 |
* Description: Serve autogenerated WebP images instead of jpeg/png to browsers that supports WebP. Works on anything (media library images, galleries, theme images etc).
|
6 |
-
* Version: 0.11.
|
7 |
* Author: Bjørn Rosell
|
8 |
* Author URI: https://www.bitwise-it.dk
|
9 |
* License: GPL2
|
3 |
* Plugin Name: WebP Express
|
4 |
* Plugin URI: https://github.com/rosell-dk/webp-express
|
5 |
* Description: Serve autogenerated WebP images instead of jpeg/png to browsers that supports WebP. Works on anything (media library images, galleries, theme images etc).
|
6 |
+
* Version: 0.11.1
|
7 |
* Author: Bjørn Rosell
|
8 |
* Author URI: https://www.bitwise-it.dk
|
9 |
* License: GPL2
|
wod/webp-realizer.php
CHANGED
@@ -58,20 +58,8 @@ function getDestination($allowInQS, $allowInHeader) {
|
|
58 |
// correct result in all setups (ie "folder method 1")
|
59 |
$requestUriNoQS = explode('?', $_SERVER['REQUEST_URI'])[0];
|
60 |
$docRoot = rtrim(realpath($_SERVER["DOCUMENT_ROOT"]), '/');
|
61 |
-
$
|
62 |
-
|
63 |
-
return $source;
|
64 |
-
}
|
65 |
-
|
66 |
-
header('X-WebP-Express-Error: None of the available methods for locating destination file works', true);
|
67 |
-
echo 'None of the available methods for locating destination file works!';
|
68 |
-
if (!$allowInHeader) {
|
69 |
-
echo '<br>Have you tried allowing destination to be passed as a request header?';
|
70 |
-
}
|
71 |
-
if (!$allowInQS) {
|
72 |
-
echo '<br>Have you tried allowing destination to be passed in querystring?';
|
73 |
-
}
|
74 |
-
exit;
|
75 |
}
|
76 |
|
77 |
$docRoot = rtrim(realpath($_SERVER["DOCUMENT_ROOT"]), '/');
|
58 |
// correct result in all setups (ie "folder method 1")
|
59 |
$requestUriNoQS = explode('?', $_SERVER['REQUEST_URI'])[0];
|
60 |
$docRoot = rtrim(realpath($_SERVER["DOCUMENT_ROOT"]), '/');
|
61 |
+
$dest = $docRoot . urldecode($requestUriNoQS);
|
62 |
+
return $dest;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
63 |
}
|
64 |
|
65 |
$docRoot = rtrim(realpath($_SERVER["DOCUMENT_ROOT"]), '/');
|