I have tried both using custom token and just firebase secret. But the same exact app works when running locally, but I cannot authenticate when running from OpenShift Node environment.
myRootRef.authWithCustomToken(firebaseSecret, function(error, authData) {
log.info('Firebase Authed');
if(error){
log.fatal('Unable to authenticate');
log.error(error);
log.info(firebaseSecret);
return;
}
Is there anything else I need to do to "bless" OpenShift - The error I get back is
{"code":"INVALID_TOKEN"}
The only thing I can think of that makes the most sense is that Open Shift is blocking the ports for Firebase communications which I believe is WebSockets
Related
I'm building a site with emberfire and using firebase. Everything seems to be set up fine regarding credentials, and I can read/write to the firebase database while developing locally, but every time I try to authenticate via the Google Popup it pops up fine with my Google accounts listed, and when I select my account it errors with this error object:
code: "auth/network-request-failed", message: "A network error (such as timeout, interrupted connection or unreachable host) has occurred."
I assume I'm simply missing a setting somewhere but for the life of me I cannot find it. Here's the code to get the popup and response:
const provider = new firebase.auth.GoogleAuthProvider();
this.firebaseApp.auth().then(auth => {
/* Firebase SDK calls */
auth.signInWithPopup(provider).then(function(response) {
console.log(response);
}).catch(function(error) {
console.log(error);
});
});
I am using EmberJS with emberfire.
In my environment I had host: 'api', and when removing that authentication works, so it must be one of the adapters that is used.
I'm having incredible difficulty setting up the Twilio Client in Meteor JS, and would really appreciate any help.
I have extracted the relevant code and error logs below. So far as I can tell, it should be simple. The code is just grabbing an authtoken which I have previously generated, and then trying to set up the device using that authtoken. But it's not working.
'click #initializeDevice'(event) {
var thisAuthToken = Session.get('myAuthToken');
console.log(thisAuthToken); // I have confirmed with Twilio support that these authtokens are correctly generated
const Device = require('twilio-client').Device;
Device.setup(thisAuthToken, { debug: true });
var myStatus = Device.status()
console.log(myStatus); //this is logging "offline"
Device.on('ready',function (device) {
log('Twilio.Device Ready!'); //this is not logging anything
});
},
When that code runs, it generates the following logs:
eyJhbGciDpvdXRnb2luZz9hcHBTaWQ9QVA2NDE2MzJmMzA1ZjJiY2I[Note:I have deleted part of the middle of the logged authtoken for the purpose of this public post]5YmMxOGQyOWVlNGU2ZGM0NjdmMzRiNDVhNCIsImV4cCI6MTU3Nz0ygbJKTx15GgNCWDkm-iUPjn_O1NZU6yovp4vjE
modules.js?hash=69069bec9aeba9503ae3467590cf182be57d9e62:3605 Setting up VSP
modules.js?hash=69069bec9aeba9503ae3467590cf182be57d9e62:3605 WSTransport.open() called...
modules.js?hash=69069bec9aeba9503ae3467590cf182be57d9e62:3605 Attempting to connect...
modules.js?hash=69069bec9aeba9503ae3467590cf182be57d9e62:3605 Closing and cleaning up WebSocket...
modules.js?hash=69069bec9aeba9503ae3467590cf182be57d9e62:3605 No WebSocket to clean up.
modules.js?hash=69069bec9aeba9503ae3467590cf182be57d9e62:3605 Could not connect to endpoint: ws does not work in the browser. Browser clients must use the native WebSocket object
modules.js?hash=69069bec9aeba9503ae3467590cf182be57d9e62:3605 Closing and cleaning up WebSocket...
modules.js?hash=69069bec9aeba9503ae3467590cf182be57d9e62:3605 No WebSocket to clean up.
calltemplate.js:31 offline
I'm doing this all from a local server, tunneled through NGROK. I've also set up the Twilio back end, linked the app, purchased a number, etc.
So far as I can tell, the issue, from the logs, appears to be something to do with the way that Meteor uses WebSockets.
Could not connect to endpoint: ws does not work in the browser. Browser clients must use the native WebSocket object
This is a not a Meteor related problem rather than browser issue.
Make sure your browser supports WebRTC
BTW, Your browser might be supporting it but you'd need to enable it.
I have a app built with vue and firebase/firestore. I use the firebase emulator to local development and am trying to integrate my dev workflow with cypress. But i get a error in cypress that do not occur if i access the app from browser.
Firebase CLI version is 7.9.0 and Cypress version is "^3.8.0"
My npm scripts to load everything are below:
"start": "firebase emulators:exec --only firestore \"npm run dev:appandtest\"",
"dev:appandtest": "concurrently -n \"app,test\" -c \"bgYellow.black,bgWhite.black\" \"npm:dev:app\" \"npm:dev:test\"",
"dev:app": "webpack-dev-server --config build/webpack.dev.js",
"dev:test": "npx cypress open",
The local server runs on port 9000 and the firebase emulator on port 8080.
After things are running, if i access the app from a normal browser everything is fine as this screen shows.
normal
Then i tried to run a basic cypress test with this code
describe('The Home Page', function () {
it('successfully loads', function () {
cy.visit('/');
});
});
And i got the errors messages below:
[2019-12-14T15:29:24.725Z] #firebase/firestore: Firestore (6.6.2): Could not reach Cloud Firestore backend. Backend didn't respond within 10 seconds.
This typically indicates that your device does not have a healthy Internet connection at the moment. The client will operate in offline mode until it is able to successfully connect to the backend.
error.ts:166 Uncaught (in promise) FirebaseError: Failed to get document because the client is offline.
at new FirestoreError (http://localhost:9000/bundle.js:11739:149)
at Object.next (http://localhost:9000/bundle.js:16734:8)
at next (http://localhost:9000/bundle.js:16725:4704)
at http://localhost:9000/bundle.js:16430:411
I took a screenshot also:
buggy
I tried to research answers but wasn't able to find one. Thanks in advance for any help.
The solution to this problem, at least for now, is to enable experimentalForceLongPolling, like this:
// NOTE: do NOT put this in production.
firebase.firestore().settings({ experimentalForceLongPolling: true })
Important: this is an experimental feature and you should put it in some conditional checks with environment variables. You should not use this in production environment.
The reason for this is best described here:
The default behavior of Firestore's web SDK is to make use of WebChannel's streaming mode. The client makes what looks like an XHR, but then the server will hold the response open for 60 seconds and send as many server-initiated responses as it can during that time window.
The experimentalForLongPolling option forces the server to send only a single response per request.
And here:
That is the same workaround we are using in cypress. I think the underlying problem is that Cypress is intercepting all network traffic so it can monitor and sometimes mock. However, the webchannel protocol used by firestore has multiple replies over the same http request. The Cypress code cannot handle this and will only forward the first reply and ignore the rest.
In the v9 new API you can't rely on
provideFirebaseApp(() => initializeApp(environment.firebase)),
where environment.firebase includes { experimentalAutoDetectLongPolling: true }.
Instead you have to explicitly do this in the provideFirestore method.
provideFirestore(() => {
let firestore;
if (environment.useEmulators) {
// bug: experimentalAutoDetectLongPolling not picked up via `getFirestore`
const app = initializeApp(environment.firebase)
firestore = initializeFirestore(app, {
experimentalAutoDetectLongPolling: true
})
connectFirestoreEmulator(firestore, 'localhost', 8080)
} else {
firestore = getFirestore();
}
return firestore;
}),
Trying to build an Electron app using ember-electron and am trying to use emberfire to communicate with Firebase. Everything runs fine when running as a web app with ember s but when launching as an Electron app I get nothing but errors like this:
XMLHttpRequest cannot load https://www.googleapis.com/identitytoolkit/v3/relyingparty/signupNewUser?key=AIzaSyBYyuJ-1E3ufujlzdKhj8gE9I6QH8TreJE. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'serve://dist' is therefore not allowed access. The response had HTTP status code 404.
Is this a known problem or does anyone know a way around this? Unfortunately cannot simply add serve://dist to the list of authorized domains as Google doesn't consider it a valid domain name.
Update: I would still love to know if anyone has a possible workaround but I found a tool called Nativefier (https://github.com/jiahaog/nativefier) which works for my purposes. Since I am simultaneously developing a web app and a desktop app, once the web app is being hosted, can use nativefier to build the desktop app
I didn't try with electron, but played with node-webkit. Many problems related to origin can be solved by running local web-server: in main script run a web-server using express which serves your app. This is piece of code that I use to start local server:
let express = require('express');
let http = require('http');
let app = express();
app.use('/', express.static('dist'));
let server = http.createServer(app);
let port = 9000;
let maxPort = 50000;
server.on('error', function (e) {
if (port < maxPort) {
server.listen(++port);
} else {
alert('Your system has no free ports to start a web-server, which is needed for this app to work');
window.nw.Window.get().close();
}
});
server.on('listening', function () {
location = 'http://localhost:' + port + '/index.html';
});
server.listen(port);
I think that something similar should work for electron, too
I've got meteor on a linux box that I develop on through SSH to a windows laptop. For simple apps I can just substitute the lan address (10.0.1.101:3000) for localhost:3000 in the (windows)browser and it works.
But working through a tutorial that uses oauth w twitter, it seems meteor hardcodes ROOT_URL as localhost when in development environment and sends that to twitter.js. This happens even though in dev.twitter.com I have given the callback URL as
http://10.0.1.101:3000/_oauth/twitter?close.
Is there someway to develop on a machine that is not localhost?
You need to set the environment variable before starting meteor:
ROOT_URL=http://10.0.1.101:3000 meteor
For me it works hijacking the request and checking the request hostname, but it might not work for race conditions, as I don't know if this is process-safe:
WebApp.rawConnectHandlers.use((req, res, next) => {
var match: any
if(
req.url.startsWith('/_oauth/facebook') &&
(match = req.headers.host.match(/([a-zA-Z0-9-]+)\.domain.com/))
) {
Meteor.absoluteUrl.defaultOptions.rootUrl
= process.env.ROOT_URL
= match[0]
}
next()
})
My problem was making the oauth work for multiple domains.