ngx-cookie: Universal Rendering throws "window is not defined" error

I’m submitting a … (check one with “x”)

[x] bug report => check the FAQ and search github for a similar issue or PR before submitting
[ ] support request => check the FAQ and search github for a similar issue before submitting
[ ] feature request

Current behavior On following the steps mentioned in the documentation.

In \dist\server.js:322779

!function(e,t){ true?module.exports=t(webpack_require(0),webpack_require(4)):“function”==typeof define&&define.amd?define([“@angular/core”,“@angular/common”],t):“object”==typeof exports?exports[“ngx-cookie”]=t(require(“@angular/core”),require(“@angular/common”)):e[“ngx-cookie”]=t(e[“@angular/core”],e[“@angular/common”])}(window,function(e,t){return function(e){var t={};function o®{if(t[r])return t[r].exports;var n=t[r]={i:r,l:!1,exports:{}};return e[r].call(n.exports,n,n.exports,o),n.l=!0,n.exports}return o.m=e,o.c=t,o.d=function(e,t,r){o.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:r})},o.r=function(e){Object.defineProperty(e,“__esModule”,{value:!0})},o.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(t,“a”,t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p=“/”,o(o.s=7)}([function(e,t,o){“use strict”;var r=this&&this.__decorate||function(e,t,

ReferenceError: window is not defined

Expected/desired behavior Should compile fine as mentioned in the docs.

Reproduction of the problem Just follow the steps mentioned in the readme of this repository.

What is the expected behavior? No compilation errors.

What is the motivation / use case for changing the behavior? To get this library working with Universal

Please tell us about your environment:

  • ngx-cookie version: ^3.0.1

  • Angular version: ^5.2.9

  • Browser: Chrome

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Reactions: 14
  • Comments: 21 (1 by maintainers)

Commits related to this issue

Most upvoted comments

🎉 This issue has been resolved in version 4.0.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

+3
salemdar on May 22, 2018

Using the ngx-cookie@2.0.1, receiving server side error

ERROR { Error: StaticInjectorError[REQUEST]: StaticInjectorError(Platform: core)[REQUEST]: NullInjectorError: No provider for REQUEST! at _NullInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1293:19) at resolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1591:24) at tryResolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1533:16) at StaticInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1401:20) at resolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1591:24) at tryResolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1533:16) at StaticInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1401:20) at resolveNgModuleDep (C:\wellnessindia-v2\wellnessindia\dist\server.js:11145:25) at _createClass (C:\wellnessindia-v2\wellnessindia\dist\server.js:11186:29) at _createProviderInstance$1 (C:\wellnessindia-v2\wellnessindia\dist\server.js:11156:26) ngTempTokenPath: null, ngTokenPath: [ ‘REQUEST’ ] } Unhandled Promise rejection: StaticInjectorError[REQUEST]: StaticInjectorError(Platform: core)[REQUEST]: NullInjectorError: No provider for REQUEST! ; Zone: <root> ; Task: Promise.then ; Value: { Error: StaticInjectorError[REQUEST]: StaticInjectorError(Platform: core)[REQUEST]: NullInjectorError: No provider for REQUEST! at _NullInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1293:19) at resolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1591:24) at tryResolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1533:16) at StaticInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1401:20) at resolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1591:24) at tryResolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1533:16) at StaticInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1401:20) at resolveNgModuleDep (C:\wellnessindia-v2\wellnessindia\dist\server.js:11145:25) at _createClass (C:\wellnessindia-v2\wellnessindia\dist\server.js:11186:29) at _createProviderInstance$1 (C:\wellnessindia-v2\wellnessindia\dist\server.js:11156:26) ngTempTokenPath: null, ngTokenPath: [ ‘REQUEST’ ] } Error: StaticInjectorError[REQUEST]: StaticInjectorError(Platform: core)[REQUEST]: NullInjectorError: No provider for REQUEST! at _NullInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1293:19) at resolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1591:24) at tryResolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1533:16) at StaticInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1401:20) at resolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1591:24) at tryResolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1533:16) at StaticInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1401:20) at resolveNgModuleDep (C:\wellnessindia-v2\wellnessindia\dist\server.js:11145:25) at _createClass (C:\wellnessindia-v2\wellnessindia\dist\server.js:11186:29) at _createProviderInstance$1 (C:\wellnessindia-v2\wellnessindia\dist\server.js:11156:26) ERROR { Error: StaticInjectorError[REQUEST]: StaticInjectorError(Platform: core)[REQUEST]: NullInjectorError: No provider for REQUEST! at _NullInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1293:19) at resolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1591:24) at tryResolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1533:16) at StaticInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1401:20) at resolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1591:24) at tryResolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1533:16) at StaticInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1401:20) at resolveNgModuleDep (C:\wellnessindia-v2\wellnessindia\dist\server.js:11145:25) at _createClass (C:\wellnessindia-v2\wellnessindia\dist\server.js:11186:29) at _createProviderInstance$1 (C:\wellnessindia-v2\wellnessindia\dist\server.js:11156:26) ngTempTokenPath: null, ngTokenPath: [ ‘REQUEST’ ] } Unhandled Promise rejection: StaticInjectorError[REQUEST]: StaticInjectorError(Platform: core)[REQUEST]: NullInjectorError: No provider for REQUEST! ; Zone: <root> ; Task: Promise.then ; Value: { Error: StaticInjectorError[REQUEST]: StaticInjectorError(Platform: core)[REQUEST]: NullInjectorError: No provider for REQUEST! at _NullInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1293:19) at resolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1591:24) at tryResolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1533:16) at StaticInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1401:20) at resolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1591:24) at tryResolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1533:16) at StaticInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1401:20) at resolveNgModuleDep (C:\wellnessindia-v2\wellnessindia\dist\server.js:11145:25) at _createClass (C:\wellnessindia-v2\wellnessindia\dist\server.js:11186:29) at _createProviderInstance$1 (C:\wellnessindia-v2\wellnessindia\dist\server.js:11156:26) ngTempTokenPath: null, ngTokenPath: [ ‘REQUEST’ ] } Error: StaticInjectorError[REQUEST]: StaticInjectorError(Platform: core)[REQUEST]: NullInjectorError: No provider for REQUEST! at _NullInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1293:19) at resolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1591:24) at tryResolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1533:16) at StaticInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1401:20) at resolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1591:24) at tryResolveToken (C:\wellnessindia-v2\wellnessindia\dist\server.js:1533:16) at StaticInjector.get (C:\wellnessindia-v2\wellnessindia\dist\server.js:1401:20) at resolveNgModuleDep (C:\wellnessindia-v2\wellnessindia\dist\server.js:11145:25) at _createClass (C:\wellnessindia-v2\wellnessindia\dist\server.js:11186:29) at _createProviderInstance$1 (C:\wellnessindia-v2\wellnessindia\dist\server.js:11156:26)

+2
navdeepkumar on Apr 12, 2018

Alright I got it working. Thank you!

Now there’s just the issue of having to manually update node_modules/ngx-cookie/bundles/ngx-cookie.umd.js

If that can be resolved I think we’ll be in business.

+1
stephenautomatik on May 7, 2018

My apologies, I just realized that the docs in this repository’s README.md is not correctly giving the proper configuration for server.ts – at least of the latest version.

I believe your server.ts is similar to something like this, in that case, add these codes to the lines:

// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
app.engine('html', (_, options, callback) => {
  let engine = ngExpressEngine({
    bootstrap: AppServerModuleNgFactory,
    providers: [
      provideModuleMap(LAZY_MODULE_MAP),
      {
        provide: 'REQUEST', useValue: (options.req)
      },
      {
        provide: 'RESPONSE', useValue: (options.res)
      }
    ]
  });

  engine(_, options, callback)
})
+1
joscmw95 on May 7, 2018

Tried the workaround above and now I have the same error as before:

ERROR { Error: StaticInjectorError[REQUEST]: StaticInjectorError(Platform: core)[REQUEST]: NullInjectorError: No provider for REQUEST! …

+1
stephenautomatik on May 7, 2018

Something must’ve been misconfigured in the build configs. I’m not sure whats wrong as I’m unfamiliar with packaging JS libraries but for a quick fix:

Go to node_modules/ngx-cookie/bundles/ngx-cookie.umd.js and replace ‘window’ with ‘this’. Note that you will need to do this for server-side even if you deploy the node app after building it locally.

You could also used domino to create a dummy window object for the SSR but pretty sure that might have consequences on other libraries.

+1
joscmw95 on May 6, 2018
Read more comments on GitHub
← ngx-cookie: Could not resolve @nguniversal/express-engine/token
saleor: Add missing descriptions in types →