skip to Main Content

My client side code is a single page app (written in knockout.js) with its own routing system so when google crawler bot will try to access links (that have nothing to do with requesting new page from back end BUT just a part of client side routing) it will ask server (node.js + express.js) to serve page (for example ‘mywebsite/about’) and of course server will return 404 because it unawares of client routing system. Here is my current server code:

router.get('*', function(req, res, next) {
    res.sendFile(path.resolve('../dist/index.html'));
});

My idea is to define the same routing structure as in a client and pass routs for client routing system in search parameter:

router.get('/about', function(req, res, next) {
    res.sendFile(path.resolve('../dist/index.html?tab=about'));
});

then in client side I can catch it in javascript and pick correct route.
Here off course I have another problem – as I understand google bot doesn’t run javascript.. but here I can use prerender.io middleware I guess.

1) Is it a right way to go with single page apps with generated content and SEO?

2) How to pass search parameter from express.js?

2

Answers


  1. If you have query strings that Googlebot can use to recall consistent content then you can indicate this in Webmaster:
    https://support.google.com/webmasters/answer/6080548?rd=1

    Here’s an example set up of mine:
    enter image description here

    Google wants to only index pages that have consistent content. If content varies for each user – then you want to set a rel=”canonical” tag on each page indicating where the ‘start’ would be for this dynamically generated content.

    The idea would be to adapt the Webmaster to your app rather than the other way around. Trying to ‘trick’ the bot can have dire consequences in SEO because Google does have human checkers that occasionally rate domains. If they find inconsistency between the search indexed URL and what they see in their browser, you’ll earn a flag from a lazy operator. Here is the handbook operators follow.

    Login or Signup to reply.
  2. Use prerender.io as first middleware of your pipe:

    app.use(require('prerender-node').set('prerenderToken', 'YOUR_TOKEN'));
    app.get('*', (req, res) => res.render('index.html'))
    ;

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search