I have installed rendertron to help with SEO / server side rendering of my Angular website. Everything works fine until I use query parameters.
As you can see from the linked section of the FAQs above it requires for the full URI to be encoded, including the ?
, &
and =
characters in the query e.g. https://mywebsite.com/render/http://mywebsite.com/%3Fpage%3Dhome
I'm using nginx to detect the robots I wish to redirect to the prerendered page but parameters are being passed through as normal. Is there a way to get nginx to replace the characters listed above with url encoded ones? Here is my redirect portion of the nginx config:
location /rendertron/ {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $remote_addr;
proxy_pass http://127.0.0.1/render/$scheme://$host:$server_port$request_uri;
}
So I ended up adding the nginx js-module and creating this function:
import qs from 'querystring';
function encodeParams(r) {
return encodeURIComponent(qs.stringify(r.args));
}
export default { urlEncode }
I modified the nginx site configuration like this:
js_import conf.d/url_encode.js;
js_set $encoded_params url_encode.encodeParams;
server {
# other config ...
location /rendertron/ {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $remote_addr;
proxy_pass http://127.0.0.1/render/$scheme://$host:$server_port$1%3F$encoded_params;
}
I had to manually add %3F
before adding the encoded_params
. This seems to work fine for URIs with or without query parameters and solves my problem.