The Problem

I'm building a angular pwa and I wanted to do some basic seo optimizing on it. I set up the meta tags to change when you navigate to different routes in the application by using a seo service. Then I made a firebase cloud function that use the functions.https.onRequest(myFunction) to check if the request is from a bot and if so send it to rendertron if not it sends the user to my page.

I think something is wrong with my firebase cloud function. Its either not detecting bot requests or its not properly sending the request to rendertron, but I'm not sure how to debug this.

What I tried was using firebase serve to simulate a user requesting the page and everything works fine. I'm just not sure how to simulate a bot requesting the page locally so I can see whats going on. I tried deploying the function and testing it by sharing it on facebook but the facebook preview only seems to see the initial meta tags not the tags that have been changed.

The seo Service

The service appears to work fine. I just thought I'd include this so you could get an idea of how I'm dynamically changing my meta tags.

import Injectable from '@angular/core';
import Meta from '@angular/platform-browser';
import SeoConfig from '../interfaces/seo-config.interface';

@Injectable(
 providedIn: 'root'
)
export class SeoService {

 constructor(private meta: Meta) 

 generateTags(config: SeoConfig) 
 config = 
 title: 'my default site title here...',
 description: 'my default description here...',
 image: 'my default path to image here...',
 slug: '',
 ...config
 
 this.meta.updateTag( property: 'og:title', content: config.title);
 this.meta.updateTag( property: 'og:description', content: config.description);
 this.meta.updateTag( property: 'og:image', content: config.image);
 this.meta.updateTag( property: 'og:url', content:`https://paradigmShift.app/$config.slug`);
 this.meta.updateTag( name: 'twitter:card', content: 'summary_large_image');
 

The firebase cloud function

This is where I suspect the problem is

const functions = require('firebase-functions');
const express = require('express');
const fetch = require('node-fetch');
const url = require('url');
const app = express();
const cors = require('cors')

const appUrl = 'my domain here';
const renderUrl = 'https://render-tron.appspot.com/render';

function generateUrl(request) 
 return url.format(
 protocol: request.protocol,
 host: appUrl,
 pathname: request.originalUrl
 );


function detectBot(userAgent) W3C_Validator

app.use(cors());

app.get('*',(req, res) => 
 const isBot = detectBot(req.headers['user-agent']);
 if (isBot) 
 const botUrl = generateUrl(req);
 console.log('bot detected', botUrl);
 fetch(`$renderUrl/$botUrl`)
 .then(res => res.text())
 .then(body => 
 res.set('Cache-Control', 'public, max-age=300, s-maxage=600');
 res.set('Very', 'User-Agent');
 res.send(body.toString());
 );
 else 
 console.log('no bot detected', appUrl);
 fetch(`$appUrl`)
 .then(res => res.text())
 .then(body => 
 console.log(body.toString());
 res.send(body.toString());
 );
 
);

exports.app = functions.https.onRequest(app);

If you can spot any errors in my code or cloud function that would be great. If not, what I'm looking for is a method for debugging the function when a bot requests the page.