angular.js seo - 谷歌索引

Question

my current html looks like this:

<title ng-bind="title">Loading</title>
<meta name="description" content="[[description]]">
<base href="/">
<meta name="fragment" content="!">

angular.js config:

$locationProvider.html5Mode(true);
$locationProvider.hashPrefix('!');

I thought it's enough to let the googlebot index site correctly. But nope, it's not taking correct title or description. If I run "fetch as googlebot" site renders correctly..What should I do?

Answer 1

I don't think that you need to prerender your pages for the Google crawler anymore. A while back it started taking note of the javascript changes.

I've actually answered a question about AngularJS seo that will help you here:

Look for my answer on the above link. I've also provided a directive that might be useful to you.

By the way, are you sure you are using the angularjs expression properly? You have decription using [[]] normally it is {{}}

Answer 2

You need a prerendering engine to render the HTML for the bot. Read something here: https://scotch.io/tutorials/angularjs-seo-with-prerender-io

And here about the escaped_fragment the bot uses to crawl your site: https://developers.google.com/webmasters/ajax-crawling/docs/specification?hl=en

Answer 3

Sometimes Google will ignore the information provided in title or meta tags. But it looks more like a technically problem.

I would at least use ng-content-attr instead of writing it directly into the meta content attribute.

ng-attr-content="{{description}}"

Maybe Google extract your title information before anuglar has replaced it with the right string!

---

Another way is to use a directive that takes care of this for you. luckily i just wrote one.. just go ahead and try, you'll see with this setup google will recognize your title! https://github.com/w11k/w11k-angular-seo-header/blob/master/angular-seo-header.js