почему я получаю не удается прочитать свойство ‘initialise’ неопределенного в ngx_cookieconsent_NgcCookieConsentService.init в angular universal?

#angular #server-side-rendering #angular-universal #cookieconsent

#angular #рендеринг на стороне сервера #angular-универсальный #cookieconsent

Вопрос:

CookieConsent и версии библиотеки?

 - cookieconsent version: 3.1.1
- ngx-cookieconsent version: 2.2.3
- Angular CLI: 10.0.3
- Angular SSR (universal)
  

Я выполняю следующие команды:

 npm run build:ssr amp;amp; npm run serve:ssr
  

Где:

 "serve:ssr": "node dist/compy/server/main.js",

"build:ssr": "ng build --prod amp;amp; ng run compy:server:production",
  

Журнал, указанный при сбое

 Node Express server listening on http://localhost:4000

ERROR TypeError: Cannot read property 'initialise' of undefined
    at NgcCookieConsentService.init (C:CodingcompyFrontdistcompyservermain.js:1:3482889)
    at new NgcCookieConsentService (C:CodingcompyFrontdistcompyservermain.js:1:3482119)
    at Object.NgcCookieConsentService_Factory [as factory] (C:CodingcompyFrontdistcompyservermain.js:1:3484065)
    at R3Injector.hydrate (C:CodingcompyFrontdistcompyservermain.js:1:2802301)
    at R3Injector.get (C:CodingcompyFrontdistcompyservermain.js:1:2799033)
    at NgModuleRef$1.get (C:CodingcompyFrontdistcompyservermain.js:1:2977443)
    at Object.get (C:CodingcompyFrontdistcompyservermain.js:1:2946537)
    at getOrCreateInjectable (C:CodingcompyFrontdistcompyservermain.js:1:2713691)
    at Module.ɵɵdirectiveInject (C:CodingcompyFrontdistcompyservermain.js:1:2832947)
    at NodeInjectorFactory.AppComponent_Factory [as factory] (C:CodingcompyFrontdistcompyservermain.js:1:1694986)
  

Укажите любые другие детали, которые могут быть полезны

Он отлично работает в обычном приложении, но терпит неудачу в приложении universal angular, поэтому я думаю, что это в основном связано с попыткой открыть окно или диалоговое окно при запуске в режиме на стороне сервера. Или другой, возможно, что каким-то образом мне нужно добавить его в другие места, кроме конфигурационного файла angular.json.

Пожалуйста, любой файл, который вам нужен, просто скажите мне, я просто не могу опубликовать весь проект, поскольку он частный, но я могу доставлять отдельные файлы без проблем.

Ответ №1:

Для меня проблема была исправлена путем добавления cookieconsent.min.css и cookieconsent.min.js в angular.json

 "styles": [
            "./node_modules/cookieconsent/build/cookieconsent.min.css"
          ],
          "scripts": [
            "./node_modules/cookieconsent/build/cookieconsent.min.js"
          ]
  

Ответ №2:

NgcCookieConsentService не удается инициализировать на стороне сервера, потому что глобальное свойство window не определено. Автор в своем коде, похоже, обрабатывает универсальный случай Angular (cookieconsent.service.ts: 134), но это все еще не работает на Angular 10.

Моим срочным быстрым решением было определить пустую функцию «initialize» в server.ts, на которой запущен экспресс-сервер с промежуточным программным обеспечением «@nguniversal / express-engine». Может быть, не идеально, но это работает и является обходным путем, чтобы заставить мой проект работать на производстве.

 ...

function setBrowserGlobals(distFolder) {
    const template = readFileSync(join(distFolder, 'index.html')).toString();
    const domino = require('domino');
    const win = domino.createWindow(template);

    global['window'] = win;
    global['document'] = win.document;
    global['Node'] = win.Node;
    global['navigator'] = win.navigator;
    global['Event'] = win.Event;
    global['Event']['prototype'] = win.Event.prototype;
    global['localStorage'] = localStorage;
    global['window']['gtag'] = function () {};
    global['window']['cookieconsent'] = { initialise: function () {
        console.warn('Cookie consent is not working on server side');
    } };
}

// The Express app is exported so that it can be used by serverless Functions.
export function app(): express.Express {
    const server = express();
    const distFolder = join(process.cwd(), 'dist/browser');
    const indexHtml = existsSync(join(distFolder, 'index.original.html')) ? 'index.original.html' : 'index';

    setBrowserGlobals(distFolder);

   ...
}
  

Ответ №3:

Для людей, которые получают эту ошибку, но не используют Universal: эта ошибка также отображается, когда вы забыли установить CookieConsent (с соответствующими ссылками на файлы в стилях / сценариях angular.json).