Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Googlebot fails to render app (used to work without server rendering) #16718

Closed
Flood opened this issue May 11, 2017 · 10 comments

Comments

@Flood
Copy link

commented May 11, 2017

I'm submitting a ... (check one with "x")

[ x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

This is a copy from angular/angular-cli#5773 but the issue is not in Angular-CLI, therefor I'm creating a new issue here.

An app produced by angular-cli used to be properly rendered by googlebot (without any server rendering involved, I have snapshots in the google search console properly rendering my landing page, from a month ago).
It now fails on my app, and on a fresh starter app from angular-cli 1.0. It only shows "Loading...", i.e. the content of but fails at bootstrapping the app. app works! gets properly displayed on the real website but not by googlebot.

I am building the app with the following flags: ng build --prod --aot --no-sourcemap

Versions.

node: 6.9.5
os: linux x64
@angular/common: 4.0.1
@angular/compiler: 4.0.1
@angular/core: 4.0.1
@angular/forms: 4.0.1
@angular/http: 4.0.1
@angular/platform-browser: 4.0.1
@angular/platform-browser-dynamic: 4.0.1
@angular/router: 4.0.1
@angular/cli: 1.0.0
@angular/compiler-cli: 4.0.1

Repro steps.

Pull latest angular-cli, build, and deploy to app-engine

Test page via Google's speed test / mobile friendly tools:

https://developers.google.com/speed/pagespeed/ or
https://search.google.com/search-console/mobile-friendly

@Flood

This comment has been minimized.

Copy link
Author

commented May 11, 2017

I've just read this. Feels bad to add es6-shim just to fix this problem.

https://productforums.google.com/d/msg/webmasters/-rdfd3imgbQ/4zYkR-5vHQAJ

@vikerman

This comment has been minimized.

Copy link
Contributor

commented Jul 22, 2017

Is anything needed to be fixed in Angular?

@Flood

This comment has been minimized.

Copy link
Author

commented Sep 7, 2017

Hi @vikerman, I think it's a bug in Angular. Google still doesn't render my application but works in all major browsers/phones.

@kemaltulum

This comment has been minimized.

Copy link

commented Sep 12, 2017

Hi, I am living the same problem. Is the problem related with the es6-shim? Do we need to include it manually? And how?
Morever, as an extra info about the situation, I got the error TypeError: undefined is not a function (evaluating 'Object.assign({},t,e)') when I try prerender for my website. I had the idea that this problem is related with that googlebot do not support ES6 syntax, just as PhantomJS used by prerender.
Please, help, at least, showing some way to add es6-shim to angular4 project.

@kemaltulum

This comment has been minimized.

Copy link

commented Sep 12, 2017

I desire to share the solution that has worked for me. I had created the angular project with angular-cli. Es6-shim imports in src/polyfills.ts were commented out. Removing comment tags made the trick for me.

@tdat00

This comment has been minimized.

Copy link

commented Oct 11, 2017

Thank you @kemaltulum Your solution works well for me :)

@mbn18

This comment has been minimized.

Copy link

commented Dec 15, 2017

after upgrading to Angular5, Googlebot failed to render my website and the result had catastrophic impact on the indexing. Even though Universal provided a well formed page.
The googlebot render result was the site skeletal with no content.

From Google doc

Googlebot uses a web rendering service (WRS) that is based on Chrome 41 (M41).

Knowing this I opened the site with an old chrome (v43) and immediately noticed the error in the console.

ERROR TypeError: commands.find is not a function
That was originated from esm5/router.js

As mentioned before, enabling the Es6-shim at src//polyfills.ts fixed the problem

denis-yuen added a commit to dockstore/dockstore-ui2 that referenced this issue Jan 3, 2018
denis-yuen added a commit to dockstore/dockstore-ui2 that referenced this issue Jan 3, 2018
denis-yuen added a commit to dockstore/dockstore-ui2 that referenced this issue Jan 8, 2018
@Seanmclem

This comment has been minimized.

Copy link

commented Oct 3, 2018

I desire to share the solution that has worked for me. I had created the angular project with angular-cli. Es6-shim imports in src/polyfills.ts were commented out. Removing comment tags made the trick for me.

there is no longer an es6 shim polyfill in Angular 6. What would I do then?

@antgel

This comment has been minimized.

Copy link

commented Feb 27, 2019

@Seankps Did you ever find a workaround? Moving to Angular Universal for this seems like a lot of work. Cc @schurder

@angular-automatic-lock-bot

This comment has been minimized.

Copy link

commented Sep 14, 2019

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 14, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
8 participants
You can’t perform that action at this time.