Google Search Console can't index my React Webapp

Viewed 95

I have a web app built with react, and is hosted on Firebase's Hosting, and served with cloud functions.

An example of serving the index.html from cloud functions, is changing the .htaccess:

"rewrites": [
      {
        "source": "**",
        "function": "[functionThatReturnsIndex.html]"
      }
    ],

I export the build, and then I serve the index.html from a function, which works fine.

I do this, so I can dynamically set the META tags for each page.

This both loads fine, and when I share a link on a site, like twitter/linkedin/facebook etc., the META information that those websites fetch is also correct and as expected.

However, I'm getting an error (redirect error) from the search console, when trying to index my site.

It suggested I use Lighthouse in the chrome web tools to test what's wrong, and I got decent results:

enter image description here

This is my robots.txt:

# https://www.robotstxt.org/robotstxt.html
User-agent: *
Disallow:

I'm not sure what else to try, or why it's not indexing. Any help would be appreciated.

Let me know if I can provide more information to make the solution more obvious, thank you.

Update 1:

enter image description here

1 Answers

They are 2 types of Sitemaps viz: Static and Dynamic Sitemaps.

In your case, you need a Dynamic Sitemap to discover dynamically created contents in your React App automatically.

I'll suggest you use https://www.npmjs.com/package/react-dynamic-sitemap to implement a dynamic sitemap and submit the resulting Sitemap URL to Google.

Hope this helps you in fixing this error.

Related