Closed dexbytesmanish closed 5 years ago
This is not a bug. Cookies are not supported natively in Angular’s server DOM implementation. You will have to mock it out or come up with another solution. StackOverflow or Gitter are better avenues for help with this
I already know and understand that Cookies are not supported natively in Angular's server DOM implementation, also I am not asking to support the same. I am just seeking help to know why this error is coming even when when I am not using any Cookie in my code and I want help to fix this error.
I want help to know whether I am making any mistake to implement Angular Universal and if not then this error is normal in Universal and continue to occur and I won't be able to use Angular Universal if this error is occuring.
I understand this, and I’m saying that some part of your app is using an unsupported API, and it is not the fault of Universal. This repo is only for issues or feature requests with Universal, it is not a support forum.
To clarify, since you opened an issue on the domino repository, this is not a problem with Domino, and it's not a problem with Angular Universal. You are consuming some library that is making a call to getCookie
, which is not supported by either implementation. You are free to create a polyfill for this call on the server to work around this, or not use that library on the server. Either way, it's not an issue with these packages.
Ok, can you please help/guide me to create polyfill for this kind of issue ?
On Tue, Nov 27, 2018 at 9:06 AM CaerusKaru notifications@github.com wrote:
To clarify, since you opened an issue on the domino repository, this is not a problem with Domino, and it's not a problem with Angular Universal. You are consuming some library that is making a call to getCookie, which is not supported by either implementation. You are free to create a polyfill for this call on the server to work around this, or not use that library on the server. Either way, it's not an issue with these packages.
— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/angular/universal/issues/1094#issuecomment-441889669, or mute the thread https://github.com/notifications/unsubscribe-auth/AlP6ZVBRY4ltEOL4ELYjlxJthAXMBUtoks5uzLMogaJpZM4Ysuej .
No, as I mentioned already, this is not a support forum and a better avenue for getting help is StackOverflow or Gitter
Bug Report
What is the expected behavior?
It should not show any error in terminal after running universal server and should render server side rendered page content that can be verified in view source in browser on other than home page routes and lazy loaded modules routes.
What is the current behavior?
I am getting following error in terminal after running npm run server command and opening http://localhost:8080 URL in browser :
ERROR { Error: Uncaught (in promise): Error: This method is not implemented in DominoAdapter: getCookie Error: This method is not implemented in DominoAdapter: getCookie at _notImplemented (/var/www/html/project-angular6/dist/server.js:87272:12) at DominoAdapter.module.exports.DominoAdapter.getCookie (/var/www/html/project-angular6/dist/server.js:87463:65) at CookieXSRFStrategy.module.exports.CookieXSRFStrategy.configureRequest (/var/www/html/project-angular6/dist/server.js:76600:101) at XHRBackend.module.exports.XHRBackend.createConnection (/var/www/html/project-angular6/dist/server.js:76641:28) at httpRequest (/var/www/html/project-angular6/dist/server.js:77008:20) at Http.module.exports.Http.request (/var/www/html/project-angular6/dist/server.js:77106:34) at Http.module.exports.Http.get (/var/www/html/project-angular6/dist/server.js:77117:21) at topbannerService.module.exports../src/app/home/top-banner/top-banner.service.ts.topbannerService.getTopFeatureData (/var/www/html/project-angular6/dist/server.js:154860:26) at TopBannerComponent.module.exports../src/app/home/top-banner/top-banner.component.ts.TopBannerComponent.getTopFeaturedArtworks (/var/www/html/project-angular6/dist/server.js:154815:31) at new TopBannerComponent (/var/www/html/project-angular6/dist/server.js:154811:14) at resolvePromise (/var/www/html/project-angular6/dist/server.js:117327:31) at resolvePromise (/var/www/html/project-angular6/dist/server.js:117284:17) at /var/www/html/project-angular6/dist/server.js:117386:17 at ZoneDelegate.module.exports.ZoneDelegate.invokeTask (/var/www/html/project-angular6/dist/server.js:116934:31) at Object.onInvokeTask (/var/www/html/project-angular6/dist/server.js:4204:33) at ZoneDelegate.module.exports.ZoneDelegate.invokeTask (/var/www/html/project-angular6/dist/server.js:116933:36) at Zone.module.exports.Zone.runTask (/var/www/html/project-angular6/dist/server.js:116701:47) at drainMicroTaskQueue (/var/www/html/project-angular6/dist/server.js:117108:35) at module.exports.ZoneTask.invokeTask (/var/www/html/project-angular6/dist/server.js:117013:21) at Server.ZoneTask.invoke (/var/www/html/project-angular6/dist/server.js:116998:48)
and not able to see server side rendered page content in view source on other than home page routes and lazy loaded modules routes.
What modules are related to this issue?
Minimal reproduction with instructions:
I have followed this tutorial to setup Universal : https://www.devglan.com/angular/angular-universal-server-side-rendering. I am getting error where I am calling API to get data in following code : in component.ts : this.topbannerService.getTopFeatureData().subscribe(data=>{ }) topbannerUrl = this._global.baseAPIUrl+"home-page-top-featured";
in service.ts: getTopFeatureData(){ return this.http.get(this.topbannerUrl) .pipe( map(res =>this.extractData(res)), catchError(err => this.handleError(err)) ); }
What is the use-case or motivation for changing an existing behavior?
To be able to server-side render Angular app using Angular Universal.
Environment:
{ "name": "frontend4", "version": "0.0.0", "license": "MIT", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build --prod", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e", "build:server:prod": "ng run frontend4:server && webpack --config webpack.server.config.js --progress --colors", "build:browser:prod": "ng build --prod", "build:prod": "npm run build:server:prod && npm run build:browser:prod", "server": "node local.js" }, "private": true, "dependencies": { "@angular/animations": "^6.1.10", "@angular/common": "^6.1.7", "@angular/compiler": "^6.1.7", "@angular/core": "^6.1.7", "@angular/forms": "^6.1.7", "@angular/http": "^6.1.7", "@angular/platform-browser": "^6.1.10", "@angular/platform-browser-dynamic": "^6.1.7", "@angular/platform-server": "^6.1.10", "@angular/pwa": "^0.8.1", "@angular/router": "^6.1.7", "@angular/service-worker": "^6.1.10", "@durwella/zoomable-canvas": "^1.1.0", "@fortawesome/angular-fontawesome": "^0.2.0", "@fortawesome/fontawesome-svg-core": "^1.2.4", "@fortawesome/free-brands-svg-icons": "^5.3.1", "@fortawesome/free-solid-svg-icons": "^5.3.1", "@hallysonh/ngx-imageviewer": "^2.0.4", "@livechat/angular-widget": "0.0.6", "@ng-select/ng-select": "^2.8.1", "@ng-toolkit/universal": "^1.1.47", "@nguniversal/express-engine": "^7.0.2", "@nguniversal/module-map-ngfactory-loader": "^7.0.2", "@ngx-share/button": "^6.0.1", "@ngx-share/buttons": "^6.0.1", "@ngx-share/core": "^6.0.1", "ajv": "^6.5.3", "angular-custom-modal": "^1.2.0", "angular-socialshare": "^2.3.11", "angular2-cookie-law": "^6.0.4", "angularx-social-login": "^1.2.3", "bootstrap": "^4.1.3", "core-js": "^2.4.1", "cors": "~2.8.4", "fast-deep-equal": "^2.0.1", "fast-json-stable-stringify": "^2.0.0", "font-awesome": "^4.7.0", "hammerjs": "^2.0.8", "imagesloaded": "^4.1.4", "json-schema-traverse": "^0.4.1", "lodash": "^4.17.11", "masonry-layout": "^4.2.2", "ng-bootstrap-form-validation": "^2.1.0", "ng-click-outside": "^4.0.0", "ng-masonry-grid": "^1.2.5", "ng-multiselect-dropdown": "^0.2.1", "ng-sidebar": "^8.0.0", "ng2-scroll-to": "^1.0.7", "ng2-scroll-to-el": "^1.2.1", "ng2-social-share": "0.0.10", "ng2-sticky-kit": "^5.3.0", "ng5-slider": "^1.1.3", "ngx-bootstrap": "^3.0.1", "ngx-custom-validators": "^6.1.0", "ngx-image-viewer": "^1.0.10", "ngx-infinite-scroll": "^6.0.1", "ngx-masonry": "^1.1.2", "ngx-paypal": "^3.2.1", "ngx-pinch-zoom": "^1.2.0", "ngx-select-dropdown": "^0.7.1", "ngx-slick": "^0.2.1", "ngx-smart-modal": "^7.0.3", "primeng": "^6.1.5", "react-livechat": "^1.0.28", "rxjs": "^6.3.2", "rxjs-compat": "^6.3.2", "ts-loader": "4.2.0", "typescript": "^2.9.2", "web-animations-js": "^2.3.1", "webpack-cli": "^3.1.2", "zone.js": "^0.8.19" }, "devDependencies": { "@angular-devkit/build-angular": "~0.8.1", "@angular-devkit/core": "^0.8.1", "@angular/cli": "^6.2.1", "@angular/compiler-cli": "^6.1.7", "@angular/language-service": "^6.1.7", "@types/jasmine": "~2.8.3", "@types/jasminewd2": "~2.0.2", "@types/lodash": "^4.14.116", "@types/node": "~10.9.4", "codelyzer": "^4.0.1", "jasmine-core": "~3.2.1", "jasmine-spec-reporter": "~4.2.1", "karma": "~3.0.0", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "^2.0.4", "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^1.3.1", "protractor": "^5.4.1", "regexp-replace-loader": "^1.0.1", "ts-node": "~7.0.1", "tslint": "~5.11.0" } }