how to redirect all route node js express to original app Angular using rendertron middleware

133 Views Asked by At

I'm trying to create a rendertron middleware with nodejs to decide when to user pre rendered and when to use the original app. But i don't get how to redirect to my usual angular app using fetch or anything else. I would like to redirect all methods (GET,POST,PUT) to my original app to keep it working as it is but what I've tried doesn't work well. In order to be able to test the code before I used this website https://kitten-corner.glitch.me to redirect and https://render-tron.appspot.com/render as rendertron instance here's my middleware code

const express = require('express');
const app = express();
const rendertron = require('rendertron-middleware');
const PORT = process.env.PORT || 8080;
const fetch = require('node-fetch');
const https = require('https');

const httpsAgent = new https.Agent({
      rejectUnauthorized: false,
    });
const bots = [
    'googlebot',
    'baiduspider',
    'bingbot',
    'embedly',
    'facebookexternalhit',
    'linkedinbot',
    'outbrain',
    'pinterest',
    'quora link preview',
    'rogerbot',
    'showyoubot',
    'slackbot',
    'twitterbot',
    'vkShare',
    'W3C_Validator',
    'whatsapp',
  ];

// Add googlebot to the list of bots we will use Rendertron for
//const BOTS = rendertron.botUserAgents.concat('googlebot');
const BOT_UA_PATTERN = new RegExp(bots.join('|'), 'i');

app.set('view engine', 'html');

// Add Rendertron middleware to send bot requests to Rendertron
app.use(rendertron.makeMiddleware({
  proxyUrl: 'https://render-tron.appspot.com/render', 
  userAgentPattern: BOT_UA_PATTERN,
  injectShadyDom:true
}));

// Static Assets
//app.get('*.*', express.static('public'));

// Point all routes to index...
app.get('*', (req, res) => {
  res.set('Vary', 'User-Agent');

  fetch('https://kitten-corner.glitch.me',{
    
    agent: httpsAgent,
  }).then(res => res.text()).then(body=>res.send(body.toString()));

});

app.listen(PORT, (error) =>{
    if(!error)
        console.log("Server is Successfully Running,and App is listening on port "+ PORT);
    else
        console.log("Error occurred, server can't start", error);
    }
);

The code is based on https://developers.google.com/search/blog/2019/01/dynamic-rendering-with-rendertron.

I got

enter image description here

instead of enter image description here

1

There are 1 best solutions below

0
ScorprocS On

I solved this issue by removing the nodejs middleware and use apache2 rewrite inside vhost since I already was using an apache proxy to redirect to my initial angular app This way everything stays clean and simple.

here's the command I've added

 RewriteEngine On
        RewriteCond %{HTTP_USER_AGENT} bot|googlebot|bingbot|yandex|baiduspider|SkypeUriPreview|facebookexternalhit|twitterbot|rogerbot|linkedinbot|embedly|showyoubot|outbrain|pinterest\0.|developers.google.com/+/web/snippet|slackbot|vkshare|redditbot|applebot|whatsapp|TelegramBot|w3c>
        RewriteRule ^(.*)$ http://127.0.0.1:3000/render/https://exemple.com/$1 [P,L]