Сбой приложения Angular 6 на Googlebot / PhantomJS. Отсутствуют прокладки?
У меня есть приложение Angular 6, которое отлично работает в браузерах, но вылетает, когда робот Googlebot пытается его очистить.
Моя теория: - это проблема совместимости с Javascript, а TypeScript выводит JS, несовместимый с роботом Googlebot.
Вопрос: Какие прокладки нужны моему приложению Angular, чтобы оно не падало, когда робот Googlebot пытается очистить его? Что еще я могу сделать для максимальной совместимости?
Поскольку робот Googlebot не предлагает выходы console.info, я начал свое тестирование с попытки сделать снимок экрана своего сайта с помощью PhantomJS, который (по слухам) и используется Google.
Когда я это сделаю, я получаю следующую ошибку консоли (я не уверен, но предполагаю, что это то, с чем работает робот Googlebot):
https://www.example.com/ng2/vendor.js:46405 in ./node_modules/@angular/core/fesm5/core.js
TypeError: undefined is not a constructor (evaluating 'new Array(HEADER_OFFSET).fill(null)')
https://www.example.com/ng2/vendor.js:46407 in ./node_modules/@angular/core/fesm5/core.js
https://www.example.com/ng2/runtime.js:82 in __webpack_require__
https://www.example.com/ng2/main.js:1815 in ./src/main.ts
https://www.example.com/ng2/runtime.js:82 in __webpack_require__
https://www.example.com/ng2/main.js:1863
https://www.example.com/ng2/runtime.js:82 in __webpack_require__
https://www.example.com/ng2/runtime.js:44 in checkDeferredModules
https://www.example.com/ng2/runtime.js:31 in webpackJsonpCallback
Похоже, PhantomJS сталкивается с этой строкой кода в vendor.js и зависает:
var HEADER_FILLER = new Array(HEADER_OFFSET).fill(null);
Могу ли я добавить какой-нибудь полифилл, чтобы этого не произошло?
Удачи с этим? Столкнулся с той же проблемой, и я не уверен, что делать дальше.
@Kiran Проверьте мой ответ :)
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Чтобы решить эту проблему и заставить Googlebot правильно отображать приложения Angular, мне пришлось открыть файл polyfills.ts моего приложения и внести следующие изменения:
/* enable these */
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/weak-map';
import 'core-js/es6/set';
/* ... */
/* and these: */
/**
* Date, currency, decimal and percent pipes.
* Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10
*/
import 'intl'; // Run `npm install --save intl`.
/**
* Need to import at least one locale-data with intl.
*/
import 'intl/locale-data/jsonp/en';
Вы можете зайти в GH и спросить их, поскольку это часть того, что они недавно совершали, я думаю, строка 71 в этот файл ядра