From c8a47efde29e620eeadd11d22233f187b67e86ba Mon Sep 17 00:00:00 2001 From: or-else Date: Mon, 24 Sep 2018 12:37:35 +0300 Subject: [PATCH] move firebase credentials to a separate file --- firebase-init.js | 12 ++++++++++++ index-dev.html | 5 +++-- index.html | 1 + package.json | 1 + service-worker.js | 17 +++++------------ src/webapp.jsx | 28 ++++++++++++---------------- 6 files changed, 34 insertions(+), 30 deletions(-) create mode 100644 firebase-init.js diff --git a/firebase-init.js b/firebase-init.js new file mode 100644 index 00000000..2d2340dd --- /dev/null +++ b/firebase-init.js @@ -0,0 +1,12 @@ +// Get these values for your project from the https://console.firebase.google.com/ +// You can get most of this file at +// Project Settings -> General -> Your Apps -> [Add app] -> [Add Firebase to your Web app] +// The `messagingVapidKey` needs to be added separately. +const FIREBASE_INIT = { + // Project Settings -> Cloud Messaging, "Sender ID". + messagingSenderId: "114126160546", + // Project Settings -> Cloud Messaging -> Web configuration -> Web Push certificates. + // This value IS NOT included in the generated js config you can download from + // the firebase console. It needs to be added separately. + messagingVapidKey: "BOgQVPOMzIMXUpsYGpbVkZoEBc0ifKY_f2kSU5DNDGYI6i6CoKqqxDd7w7PJ3FaGRBgVGJffldETumOx831jl58" +}; diff --git a/index-dev.html b/index-dev.html index 47ae99fb..57b3628d 100644 --- a/index-dev.html +++ b/index-dev.html @@ -33,8 +33,8 @@ - - + + @@ -47,6 +47,7 @@ + diff --git a/package.json b/package.json index df0a260b..3715b0dd 100644 --- a/package.json +++ b/package.json @@ -41,6 +41,7 @@ "index.min.js", "manifest.json", "service-worker.js", + "firebase-init.js", "web-desktop-2.png", "web-mob-chat-1.png", "web-mob-contacts-1.png", diff --git a/service-worker.js b/service-worker.js index a952cae9..5c95131b 100644 --- a/service-worker.js +++ b/service-worker.js @@ -1,16 +1,9 @@ // Must be located at the root. -'use strict'; +importScripts("https://unpkg.com/firebase@5.5.1/firebase-app.js"); +importScripts("https://unpkg.com/firebase@5.5.1/firebase-messaging.js"); +importScripts("/firebase-init.js") -importScripts("https://unpkg.com/firebase@5.5.0/firebase-app.js"); -importScripts("https://unpkg.com/firebase@5.5.0/firebase-messaging.js"); - -const FIREBASE_PUBLIC_API_KEY = "AIzaSyD6X4ULR-RUsobvs1zZ2bHdJuPz39q2tbQ"; -const FIREBASE_SENDER_ID = "114126160546"; - -firebase.initializeApp({ - apiKey: FIREBASE_PUBLIC_API_KEY, - messagingSenderId: FIREBASE_SENDER_ID -}); +firebase.initializeApp(FIREBASE_INIT); firebase.messaging().setBackgroundMessageHandler(function(payload) { let title = payload.notification.title || "New message"; @@ -19,6 +12,6 @@ firebase.messaging().setBackgroundMessageHandler(function(payload) { icon: '/img/logo96.png' }; console.log("background message", payload); - + return self.registration.showNotification(title, options); }); diff --git a/src/webapp.jsx b/src/webapp.jsx index 79ccc945..77310968 100644 --- a/src/webapp.jsx +++ b/src/webapp.jsx @@ -32,12 +32,6 @@ const POP_SOUND = new Audio('audio/msg.mp3'); // API key. Use https://github.com/tinode/chat/tree/master/keygen to generate your own const API_KEY = "AQEAAAABAAD_rAp4DJh05a1HAwFT3A6K"; -// Firebase is used for desktop alerts (push notifications). -// If you deploy your own server, you must change these FIREBASE_... values to your own. -const FIREBASE_VAPID_KEY = "BOgQVPOMzIMXUpsYGpbVkZoEBc0ifKY_f2kSU5DNDGYI6i6CoKqqxDd7w7PJ3FaGRBgVGJffldETumOx831jl58"; -const FIREBASE_PUBLIC_API_KEY = "AIzaSyD6X4ULR-RUsobvs1zZ2bHdJuPz39q2tbQ"; -const FIREBASE_SENDER_ID = "114126160546"; - // Minimum time between two keypress notifications, milliseconds. const KEYPRESS_DELAY = 3*1000; // Delay before sending a {note} for reciving a message, milliseconds. @@ -4360,7 +4354,8 @@ class TinodeWeb extends React.Component { messageSounds: !settings.messageSoundsOff, desktopAlerts: settings.desktopAlerts, desktopAlertsEnabled: (isSecureConnection() || isLocalHost()) && - (typeof firebase != 'undefined') && (typeof navigator != 'undefined'), + (typeof firebase != 'undefined') && (typeof navigator != 'undefined') && + (typeof FIREBASE_INIT != 'undefined'), firebaseToken: localStorage.getObject("firebase-token"), errorText: '', @@ -4416,11 +4411,8 @@ class TinodeWeb extends React.Component { // Initialize desktop alerts. if (this.state.desktopAlertsEnabled) { try { - this.fbPush = firebase.initializeApp({ - apiKey: FIREBASE_PUBLIC_API_KEY, - messagingSenderId: FIREBASE_SENDER_ID, - }, APP_NAME).messaging(); - this.fbPush.usePublicVapidKey(FIREBASE_VAPID_KEY); + this.fbPush = firebase.initializeApp(FIREBASE_INIT, APP_NAME).messaging(); + this.fbPush.usePublicVapidKey(FIREBASE_INIT.messagingVapidKey); navigator.serviceWorker.register('/service-worker.js').then((reg) => { this.fbPush.useServiceWorker(reg); this.initDesktopAlerts(); @@ -4988,6 +4980,7 @@ class TinodeWeb extends React.Component { if (enabled) { if (!this.state.firebaseToken) { this.fbPush.requestPermission().then(() => { + console.log("got permission, requesting token"); this.requestPushToken(true); }).catch((err) => { this.handleError(err.message, "err"); @@ -5000,12 +4993,12 @@ class TinodeWeb extends React.Component { localStorage.updateObject("settings", {desktopAlerts: true}); } } else if (this.state.firebaseToken) { - this.fbPush.deleteToken(this.state.firebaseToken).then(() => { + this.fbPush.deleteToken(this.state.firebaseToken).catch((err) => { + console.log("Unable to delete token.", err); + }).finally(() => { localStorage.updateObject("settings", {desktopAlerts: false}); localStorage.removeItem("firebase-token"); this.setState({desktopAlerts: false, firebaseToken: null}); - }).catch((err) => { - console.log("Unable to delete token.", err); }); } else { this.setState({desktopAlerts: false, firebaseToken: null}); @@ -5014,7 +5007,9 @@ class TinodeWeb extends React.Component { } requestPushToken(sendToServer) { + console.log("requestPushToken", sendToServer); this.fbPush.getToken().then((refreshedToken) => { + console.log("got token", refreshedToken, this.state.firebaseToken); if (refreshedToken != this.state.firebaseToken) { this.tinode.setDeviceToken(refreshedToken, sendToServer); localStorage.setObject("firebase-token", refreshedToken); @@ -5123,10 +5118,11 @@ class TinodeWeb extends React.Component { handleLogout() { localStorage.removeItem("auth-token"); - this.setState(this.getBlankState()); if (this.tinode) { + this.tinode.onDisconnect = undefined; this.tinode.disconnect(); } + this.setState(this.getBlankState()); this.tinode = TinodeWeb.tnSetup(this.state.serverAddress, this.state.transport); navigateTo(""); }