firebase
The Firebase token is not being generated.
Operating System
windows 10
Environment (if applicable)
Angular 15.2.9
Firebase SDK Version
9.23.0
Firebase SDK Product(s)
Messaging
Project Tooling
Angular universal app with webpack.
Detailed Problem Description
I have been using an Angular Universal project for the last 3 years. About a year ago, I installed Firebase for the push notification feature. This feature was working fine until suddenly, about a month ago, it stopped. The app initializes properly, but when calling the getToken method, it no longer returns a token. I deleted the Firebase IndexedDB from the browser, and since then, the token has never been generated.
Steps and code to reproduce issue
Create an angular universal app and install the following dependencies. "dependencies": { "@angular/animations": "^15.2.9", "@angular/common": "^15.2.9", "@angular/compiler": "^15.2.9", "@angular/core": "^15.2.9", "@angular/fire": "^7.6.1", "@angular/forms": "^15.2.9", "@angular/platform-browser": "^15.2.9", "@angular/platform-browser-dynamic": "^15.2.9", "@angular/platform-server": "^15.2.9", "@angular/router": "^15.2.9", "@angular/service-worker": "^15.2.10", "@aws-crypto/client-node": "4.0.0", "@ng-bootstrap/ng-bootstrap": "^12.0.1", "@nguniversal/express-engine": "^13.0.1", "@popperjs/core": "^2.11.7", "@scarf/scarf": "^1.1.1", "adm-zip": "^0.5.10", "angular-calendar": "^0.29.0", "angular-draggable-droppable": "^7.0.0", "angular-resizable-element": "^7.0.2", "async": "^3.2.5", "axios": "^1.6.8", "body-parser": "^1.20.2", "buffer": "^6.0.3", "calendar-utils": "0.10.1", "catch-express-error": "^1.0.3", "check-disk-space": "^3.4.0", "check-internet-connected": "^2.0.6", "compare-versions": "^3.4.0", "compression": "^1.7.4", "connect-redis": "^6.1.1", "cookie-parser": "^1.4.6", "cors": "^2.8.5", "crypto-js": "^4.2.0", "date-fns": "^2.30.0", "date-fns-tz": "^2.0.0", "dotenv": "^16.3.1", "electron-localshortcut": "^3.2.1", "electron-push-receiver": "^2.1.3", "express": "^4.18.2", "fabric": "^2.6.0", "fastest-expressjs-validator": "^1.0.2", "firebase": "^9.23.0", "form-data": "^4.0.0", "fs-extra": "^11.1.1", "graphql": "^16.8.1", "hammerjs": "^2.0.8", "i18n-nodejs": "^3.0.0", "istanbul": "^0.4.5", "jest": "^29.7.0", "jquery": "^3.7.0", "js-base64": "^3.7.5", "jspdf": "^2.5.1", "jspdf-autotable": "^3.5.29", "karma-spec-reporter": "^0.0.36", "lcov-result-merger": "^5.0.0", "lru-cache": "^8.0.4", "mathquill4quill": "^2.4.0", "moment": "^2.29.1", "ng-pick-datetime": "6.0.14", "ng-pick-datetime-moment": "1.0.6", "ngx-clipboard": "^15.1.0", "ngx-cookie-service": "^14.0.1", "ngx-cookie-service-ssr": "^14.0.1", "ngx-device-detector": "^3.0.0", "ngx-quill": "^15.0.0", "node-gyp": "^10.1.0", "node-os-utils": "^1.3.7", "platform": "^1.3.6", "positioning": "^2.0.1", "quill": "^1.3.7", "redis": "^4.6.6", "request": "^2.88.2", "request-filtering-agent": "^2.0.1", "rrule": "2.7.1", "rxjs": "~7.4.0", "sanitize-html": "^2.11.0", "shelljs": "^0.8.5", "socket.io": "^4.6.1", "socket.io-client": "^4.6.1", "sortablejs": "^1.15.0", "sqlite3": "^5.1.6", "supertest": "^6.3.3", "tslib": "^2.6.2", "winston": "^3.11.0", "xml-js": "^1.6.11", "zone.js": "~0.11.7", "zoomooz": "^1.0.0" }, "devDependencies": { "@angular-devkit/build-angular": "^15.2.8", "@angular-eslint/builder": "^15.2.1", "@angular-eslint/eslint-plugin": "^15.2.1", "@angular-eslint/eslint-plugin-template": "^15.2.1", "@angular-eslint/schematics": "^15.2.1", "@angular-eslint/template-parser": "^15.2.1", "@angular/cli": "^15.2.8", "@angular/compiler-cli": "^15.2.9", "@nguniversal/builders": "^13.0.1", "@types/async": "^3.2.20", "@types/body-parser": "^1.19.4", "@types/compression": "^1.7.4", "@types/connect-redis": "0.0.22", "@types/cors": "^2.8.13", "@types/crypto-js": "^4.1.3", "@types/date-fns": "^2.6.0", "@types/express": "^4.17.20", "@types/fabric": "4.5.8", "@types/jasmine": "^4.3.2", "@types/node": "^17.0.2", "@types/node-localstorage": "^1.3.0", "@types/quill": "^1.3.10", "@types/redis": "^4.0.11", "@types/request": "^2.48.7", "@typescript-eslint/eslint-plugin": "5.11.0", "@typescript-eslint/parser": "5.11.0", "electron": "^27.0.2", "electron-builder": "^24.6.4", "electron-packager": "^17.1.2", "eslint": "^8.41.0", "eslint-plugin-security": "^1.7.1", "jasmine-core": "~3.10.1", "karma": "~6.3.9", "karma-chrome-launcher": "~3.1.0", "karma-coverage": "~2.1.0", "karma-jasmine": "~4.0.1", "karma-parallel": "^0.3.1", "karma-sonarqube-unit-reporter": "^0.0.23", "ngx-smooth-dnd": "0.2.6", "ts-node": "^10.4.0", "typescript": "~4.8.4" } }
I couldn't figure out how to label this issue, so I've labeled it for a human to triage. Hang tight.
Operating System
windows 10
Environment (if applicable)
Angular 15.2.9
Firebase SDK Version
9.23.0
Firebase SDK Product(s)
Messaging
Project Tooling
Angular universal app with webpack.
Detailed Problem Description
I have been using an Angular Universal project for the last 3 years. About a year ago, I installed Firebase for the push notification feature. This feature was working fine until suddenly, about a month ago, it stopped. The app initializes properly, but when calling the getToken method, it no longer returns a token. I deleted the Firebase IndexedDB from the browser, and since then, the token has never been generated.
Steps and code to reproduce issue
Create an angular universal app and install the following dependencies. "dependencies": { "@angular/animations": "^15.2.9", "@angular/common": "^15.2.9", "@angular/compiler": "^15.2.9", "@angular/core": "^15.2.9", "@angular/fire": "^7.6.1", "@angular/forms": "^15.2.9", "@angular/platform-browser": "^15.2.9", "@angular/platform-browser-dynamic": "^15.2.9", "@angular/platform-server": "^15.2.9", "@angular/router": "^15.2.9", "@angular/service-worker": "^15.2.10", "@aws-crypto/client-node": "4.0.0", "@ng-bootstrap/ng-bootstrap": "^12.0.1", "@nguniversal/express-engine": "^13.0.1", "@popperjs/core": "^2.11.7", "@scarf/scarf": "^1.1.1", "adm-zip": "^0.5.10", "angular-calendar": "^0.29.0", "angular-draggable-droppable": "^7.0.0", "angular-resizable-element": "^7.0.2", "async": "^3.2.5", "axios": "^1.6.8", "body-parser": "^1.20.2", "buffer": "^6.0.3", "calendar-utils": "0.10.1", "catch-express-error": "^1.0.3", "check-disk-space": "^3.4.0", "check-internet-connected": "^2.0.6", "compare-versions": "^3.4.0", "compression": "^1.7.4", "connect-redis": "^6.1.1", "cookie-parser": "^1.4.6", "cors": "^2.8.5", "crypto-js": "^4.2.0", "date-fns": "^2.30.0", "date-fns-tz": "^2.0.0", "dotenv": "^16.3.1", "electron-localshortcut": "^3.2.1", "electron-push-receiver": "^2.1.3", "express": "^4.18.2", "fabric": "^2.6.0", "fastest-expressjs-validator": "^1.0.2", "firebase": "^9.23.0", "form-data": "^4.0.0", "fs-extra": "^11.1.1", "graphql": "^16.8.1", "hammerjs": "^2.0.8", "i18n-nodejs": "^3.0.0", "istanbul": "^0.4.5", "jest": "^29.7.0", "jquery": "^3.7.0", "js-base64": "^3.7.5", "jspdf": "^2.5.1", "jspdf-autotable": "^3.5.29", "karma-spec-reporter": "^0.0.36", "lcov-result-merger": "^5.0.0", "lru-cache": "^8.0.4", "mathquill4quill": "^2.4.0", "moment": "^2.29.1", "ng-pick-datetime": "6.0.14", "ng-pick-datetime-moment": "1.0.6", "ngx-clipboard": "^15.1.0", "ngx-cookie-service": "^14.0.1", "ngx-cookie-service-ssr": "^14.0.1", "ngx-device-detector": "^3.0.0", "ngx-quill": "^15.0.0", "node-gyp": "^10.1.0", "node-os-utils": "^1.3.7", "platform": "^1.3.6", "positioning": "^2.0.1", "quill": "^1.3.7", "redis": "^4.6.6", "request": "^2.88.2", "request-filtering-agent": "^2.0.1", "rrule": "2.7.1", "rxjs": "~7.4.0", "sanitize-html": "^2.11.0", "shelljs": "^0.8.5", "socket.io": "^4.6.1", "socket.io-client": "^4.6.1", "sortablejs": "^1.15.0", "sqlite3": "^5.1.6", "supertest": "^6.3.3", "tslib": "^2.6.2", "winston": "^3.11.0", "xml-js": "^1.6.11", "zone.js": "~0.11.7", "zoomooz": "^1.0.0" }, "devDependencies": { "@angular-devkit/build-angular": "^15.2.8", "@angular-eslint/builder": "^15.2.1", "@angular-eslint/eslint-plugin": "^15.2.1", "@angular-eslint/eslint-plugin-template": "^15.2.1", "@angular-eslint/schematics": "^15.2.1", "@angular-eslint/template-parser": "^15.2.1", "@angular/cli": "^15.2.8", "@angular/compiler-cli": "^15.2.9", "@nguniversal/builders": "^13.0.1", "@types/async": "^3.2.20", "@types/body-parser": "^1.19.4", "@types/compression": "^1.7.4", "@types/connect-redis": "0.0.22", "@types/cors": "^2.8.13", "@types/crypto-js": "^4.1.3", "@types/date-fns": "^2.6.0", "@types/express": "^4.17.20", "@types/fabric": "4.5.8", "@types/jasmine": "^4.3.2", "@types/node": "^17.0.2", "@types/node-localstorage": "^1.3.0", "@types/quill": "^1.3.10", "@types/redis": "^4.0.11", "@types/request": "^2.48.7", "@typescript-eslint/eslint-plugin": "5.11.0", "@typescript-eslint/parser": "5.11.0", "electron": "^27.0.2", "electron-builder": "^24.6.4", "electron-packager": "^17.1.2", "eslint": "^8.41.0", "eslint-plugin-security": "^1.7.1", "jasmine-core": "~3.10.1", "karma": "~6.3.9", "karma-chrome-launcher": "~3.1.0", "karma-coverage": "~2.1.0", "karma-jasmine": "~4.0.1", "karma-parallel": "^0.3.1", "karma-sonarqube-unit-reporter": "^0.0.23", "ngx-smooth-dnd": "0.2.6", "ts-node": "^10.4.0", "typescript": "~4.8.4" } }
Below are my project setup files. This is a sample project created for testing purposes, using the same Firebase configuration as my main project. I have integrated Firebase initialization in this sample project in the same way as in my main project.
Hi @uttkarsh-jawalekar, apologies for the delayed response and thank you for reaching out to us. I tried replicating the issue with the latest version (18.0.1) of AngularFire but I wasn't able to experience the same behavior. Clearing the indexDB will clear the current token. However, after refreshing the page, a new token will be created. Is this not the same as yours? Are you receiving any other errors aside from the previous one or you are not able to receive a new token?
I noticed you are using an outdated SDK. I suggest updating your SDK version to the latest version to eliminate bugs and to have the improvements from the newest version.
Hi @jbalidiong Please follow these steps to set up the Angular project:
-
Install Node, Angular, and npm: Refer to the below attachment for the specific versions required.
-
ng add @nguniversal/express-engine
-
Ensure that your Angular project is an Angular Universal project.
-
Install the following dependencies:
"dependencies": { "@angular/animations": "^15.2.9", "@angular/common": "^15.2.9", "@angular/compiler": "^15.2.9", "@angular/core": "^15.2.9", "@angular/fire": "^7.6.1", "@angular/forms": "^15.2.9", "@angular/platform-browser": "^15.2.9", "@angular/platform-browser-dynamic": "^15.2.9", "@angular/platform-server": "^15.2.9", "@angular/router": "^15.2.9", "@angular/service-worker": "^15.2.10", "@aws-crypto/client-node": "4.0.0", "@ng-bootstrap/ng-bootstrap": "^12.0.1", "@nguniversal/express-engine": "^13.0.1", "@popperjs/core": "^2.11.7", "@scarf/scarf": "^1.1.1", "adm-zip": "^0.5.10", "angular-calendar": "^0.29.0", "angular-draggable-droppable": "^7.0.0", "angular-resizable-element": "^7.0.2", "async": "^3.2.5", "axios": "^1.6.8", "body-parser": "^1.20.2", "buffer": "^6.0.3", "calendar-utils": "0.10.1", "catch-express-error": "^1.0.3", "check-disk-space": "^3.4.0", "check-internet-connected": "^2.0.6", "compare-versions": "^3.4.0", "compression": "^1.7.4", "connect-redis": "^6.1.1", "cookie-parser": "^1.4.6", "cors": "^2.8.5", "crypto-js": "^4.2.0", "date-fns": "^2.30.0", "date-fns-tz": "^2.0.0", "dotenv": "^16.3.1", "electron-localshortcut": "^3.2.1", "electron-push-receiver": "^2.1.3", "express": "^4.18.2", "fabric": "^2.6.0", "fastest-expressjs-validator": "^1.0.2", "firebase": "^9.23.0", "form-data": "^4.0.0", "fs-extra": "^11.1.1", "graphql": "^16.8.1", "hammerjs": "^2.0.8", "i18n-nodejs": "^3.0.0", "istanbul": "^0.4.5", "jest": "^29.7.0", "jquery": "^3.7.0", "js-base64": "^3.7.5", "jspdf": "^2.5.1", "jspdf-autotable": "^3.5.29", "karma-spec-reporter": "^0.0.36", "lcov-result-merger": "^5.0.0", "lru-cache": "^8.0.4", "mathquill4quill": "^2.4.0", "moment": "^2.29.1", "ng-pick-datetime": "6.0.14", "ng-pick-datetime-moment": "1.0.6", "ngx-clipboard": "^15.1.0", "ngx-cookie-service": "^14.0.1", "ngx-cookie-service-ssr": "^14.0.1", "ngx-device-detector": "^3.0.0", "ngx-quill": "^15.0.0", "node-gyp": "^10.1.0", "node-os-utils": "^1.3.7", "platform": "^1.3.6", "positioning": "^2.0.1", "quill": "^1.3.7", "redis": "^4.6.6", "request": "^2.88.2", "request-filtering-agent": "^2.0.1", "rrule": "2.7.1", "rxjs": "~7.4.0", "sanitize-html": "^2.11.0", "shelljs": "^0.8.5", "socket.io": "^4.6.1", "socket.io-client": "^4.6.1", "sortablejs": "^1.15.0", "sqlite3": "^5.1.6", "supertest": "^6.3.3", "tslib": "^2.6.2", "winston": "^3.11.0", "xml-js": "^1.6.11", "zone.js": "~0.11.7", "zoomooz": "^1.0.0" }, "devDependencies": { "@angular-devkit/build-angular": "^15.2.8", "@angular-eslint/builder": "^15.2.1", "@angular-eslint/eslint-plugin": "^15.2.1", "@angular-eslint/eslint-plugin-template": "^15.2.1", "@angular-eslint/schematics": "^15.2.1", "@angular-eslint/template-parser": "^15.2.1", "@angular/cli": "^15.2.8", "@angular/compiler-cli": "^15.2.9", "@nguniversal/builders": "^13.0.1", "@types/async": "^3.2.20", "@types/body-parser": "^1.19.4", "@types/compression": "^1.7.4", "@types/connect-redis": "0.0.22", "@types/cors": "^2.8.13", "@types/crypto-js": "^4.1.3", "@types/date-fns": "^2.6.0", "@types/express": "^4.17.20", "@types/fabric": "4.5.8", "@types/jasmine": "^4.3.2", "@types/node": "^17.0.2", "@types/node-localstorage": "^1.3.0", "@types/quill": "^1.3.10", "@types/redis": "^4.0.11", "@types/request": "^2.48.7", "@typescript-eslint/eslint-plugin": "5.11.0", "@typescript-eslint/parser": "5.11.0", "electron": "^27.0.2", "electron-builder": "^24.6.4", "electron-packager": "^17.1.2", "eslint": "^8.41.0", "eslint-plugin-security": "^1.7.1", "jasmine-core": "~3.10.1", "karma": "~6.3.9", "karma-chrome-launcher": "~3.1.0", "karma-coverage": "~2.1.0", "karma-jasmine": "~4.0.1", "karma-parallel": "^0.3.1", "karma-sonarqube-unit-reporter": "^0.0.23", "ngx-smooth-dnd": "0.2.6", "ts-node": "^10.4.0", "typescript": "~4.8.4" } 5. Serve your Angular app: Run npm run dev:ssr.
- Reproduce the issue: Once the app is served, delete the IndexedDB and refresh the browser. You should be able to reproduce the issue. If you have any questions about the setup, please refer to the comment above where I have attached my project files. Follow those instructions to set up your project similarly. Additionally, I have attached my project’s package.json file; please refer to that as well.
Hello @jbalidiong can you help again with it, as we have changes the version too, we are these issue. and we face these issue on server level, on local level we don't get that issue.
Hi @uttkarsh-jawalekar, have you had any success with upgrading Firebase to the latest version? The error message you sent seems unrelated to messaging. Are there any other error messages you could share (likely ones related to IDB operations failing)?
hey @dlarocque no we did not get any success with upgrading firebase to latest version
Hey @uttkarsh-jawalekar. We need more information to resolve this issue but there hasn't been an update in 5 weekdays. I'm marking the issue as stale and if there are no new updates in the next 5 days I will close it automatically.
If you have more information that will help us get to the bottom of this, just add a comment!
Since there haven't been any recent updates here, I am going to close this issue.
@uttkarsh-jawalekar if you're still experiencing this problem and want to continue the discussion just leave a comment here and we are happy to re-open this.