Firebase AppCheck web app not working in production mode - javascript

I cannot get Firebase AppCheck to work in production mode on a Vue.js project with Firestore and Storage. But It works normally in development.
const appCheck: AppCheck = initializeAppCheck(firebaseApp, {
provider: new ReCaptchaV3Provider(reCaptchaSiteKey),
isTokenAutoRefreshEnabled: true,
});
getToken(appCheck)
.then((result: AppCheckTokenResult) => {
console.log(process.env.NODE_ENV);
console.log(result.token);
})
.catch((e: FirebaseError) => {
console.log(process.env.NODE_ENV);
console.log(e.code + ": " + e.message);
});
In Development mode, using vite, get the token back:
In Production mode, with firebase serve, get appCheck/fecth-status-error:

Firebaser here!
The error you are receiving is due to the App Check backend not being able to verify the underlying reCAPTCHA attestation.
Things to check for:
is reCAPTCHA providing a valid attestation and not somehow thinking your device is a bot?
does the site secret uploaded to App Check for this App match the client ID you are using in the App?
If you are using a Debug Token in your development build, that might explain why that one is succeeding.

Related

Can Firebase Emulators be used for integration testing with a React frontend?

I have a simple React frontend application that uses Firebase for Auth and Firestore (https://jlowen-netflix.netlify.app/ if additional context helpful). I provide Firebase as a Context to my top-level application, and listen for a change in Auth to redirect the user to logged in content.
I would like to test end-to-end user workflow from anonymous, to sign-up, to logged in. I have already installed the Firebase CLI as well as the Firebase emulators. I can verify the emulators run correctly by visiting the Emulator UI on localhost. I also can verify the application hooks in to the emulators when I start the dev server (npm start) for Create-React-App. I made a test user in the Emulator UI, and was able to log in as expected.
When I try to get this to render in Jest, my auth listener custom hook attempts to access the auth() method on the firebase context prior to firebase initialization.
TypeError: Cannot read property 'auth' of undefined
9 | // As recommended by Firebase - need to set up subscription
10 | useEffect(() => {
> 11 | const listener = firebase.auth().onAuthStateChanged((authUser) => {
| ^
12 | console.log(`Firebase detected auth change: ${authUser}`)
13 | if (authUser) {
14 | localStorage.setItem("authUser", JSON.stringify(authUser))
at src/hooks/use-auth-listener.js:11:31
I can't seem to resolve what seems to be some sort of async issue that I encounter in Jest, but does not occur in the deployed application.
I am pretty new in React and Jest, so if I can provide additional information, please let me know!
Unfortunately your error doesn't seem to be related to your main question. What the error you're showing says is that you forgot to import or require the firebase from somewhere. Read the firebase package docs and add something like this at the top of your file:
var firebase = require('firebase');
I would also be interested in connecting firebase app to local emulators, so will edit this answer if I figure something out. In the mean time.. sorry for the false hope.

How can I make sure a TCP server will always be running on a VM (google cloud)

I am using VM from Google Cloud Platform running Windows Server 2019. I currently have a simple TCP server(node.js) that receives data and then POSTs it to my firestore database using Axios. It is important for me that the server doesn't crash and in the case that it does, it can restart and "stay alive". How can I accomplish this?
New to VM and TCP servers. Just made a simple
TCP
const net = require('net');
const axios = require('axios')
const chalk = require('chalk');
const server = net.createServer(conn => {
console.log(chalk.green('new client'));
conn.on('data', data => {
// let add = conn.address()
console.log(data)
if(data.length > 0){
axios.post('https://abc', {
data: data
})
.then(response => {
conn.write('ACK');
}).catch(err =>{
conn.write('ERR', err)
console.log(err)
})
}
});
conn.on('end', () => {
console.log(chalk.red('client left '));
console.log(chalk.white.bold('----------------------------------'));
});
});
server.listen(8080);
Running a node.js application on Windows Server has several challenges.
Installation and setup of a monitoring application that detects that the node.js application has failed and restarts the application. An example product that provides this ability is node-windows:
https://www.npmjs.com/package/node-windows
This is an example and not a recommendation for any specific product.
The monitoring application must be installed and set up as a Windows service so that the monitoring application restarts automatically. The application node-windows also provides this capability.
Install the application files outside of your user environment. This means creating a directory with the correct ownership and rights so that the Windows service can access the files.
This article written by Charan Tej might help to understand the details:
Node Windows Service for Running Node.js Application

Axios request failing on signed version of cordova app

I am developing a Cordova application with Axios and React. I can build this app with Cordova and run the resulting APK on my phone with no problems whatsoever. However, when I sign and zipalign the app and put it on the Play store - network requests do not work.
This is an example of a request :
const instance = axios.create({
baseURL: "http://darajava.ie:8888/api/api",
headers: {
'accept': 'application/json'
}
});
instance.post('authenticate', querystring.stringify({
username,
password,
})).then((res) => {
console.log('LOG ' + JSON.stringify(res));
}).catch(function (error) {
console.log('ERR ' + JSON.stringify(error));
});
The response on the unsigned apk (on the actual phone) is normal, whereas we get "Network Error" from the Play store version. I did some research on Axios' Network Error and it seems that that occurs when it cannot reach the server. Keep in mind that all other requests fail too.
Does anybody know where I would even start to debug this?
The problem was that the newer versions of Android do not support cleartext traffic. Either explicitly allow cleartext or use a secure server.

Detect internet connection in Electron

Our Electron app needs some configuration files and usually downloads them from our server. In case the client is offline, we don't want him to see any error messages. We are using Electron Download Manager to get the files.
This is how we request the files
try{
DownloadManager.bulkDownload({
urls: links
}, function (error, finished, errors) {
if (error) {
console.log("ERROR: Encountered error during config file download!");
console.log("Finished Files: " + finished);
console.log("Errors: " + errors);
return;
}
console.log("Finished loading all configuration files.");
});
} catch (err){
online_status = false;
console.log("Couldn't get online configuration. Starting app as offline.");
}
With this code the error Uncaught Exception: Error: net::ERR_ADDRESS_UNREACHABLE is thrown, when not connected to the internet.
I tried implementing the official event detection from Electron but as they state:
Such as in cases where the computer is running a virtualization
software that has virtual ethernet adapters that are always
“connected.” Therefore, if you really want to determine the internet
access status of Electron, you should develop additional means for
checking.
Then I went on trying just to ping the server like in this thread but this doesn't work at all for me, it's possible that it doesn't work anymore.
This is a bug in Electron Download Manager, documented in an GitHub Issue like #JeffRSon stated. A pull request is ready for a merge but not merged yet (posted 06.06.2019).
I hope this helps you. I will update this question if it get's merged and works.

'firebase deploy' compilation error in storage.rules

I am trying to deploy the firebase app from here and I am following this tutorial. I would like to deploy my firebase app. However, when I enter
firebase deploy
I get an error. Here are my logs:
egaumbp:web gg$ firebase deploy
=== Deploying to 'friendlychat-6e4c3'...
i deploying database, storage, hosting
i storage: checking rules for compilation errors...
Error: Compilation error in storage.rules:
[E] 3:12 - Unexpected '<'.
egaumbp:web gg$
I am logged in, and I have version 3.0.0 of the firebase toolkit, and I am doing this from a MacBook Pro (Retina, 13-inch, Late 2012), on OSX EL Capitan Version 10.11.2.
Many of the examples in the getting started guide use a convention of <placeholder> where the developer needs to provide some additional information to make the example function. In the first example from Understanding Firebase Storage Security Rules, the following code snippet is presented with the placeholder <your-firebase-storage-bucket>.
service firebase.storage {
match /b/<your-firebase-storage-bucket>/o {
// ... more rules ...
}
}
To fix the Unexpected '<' error in this case, replace the placeholder with friendlychat-6e4c3.appspot.com like so:
service firebase.storage {
match /b/friendlychat-6e4c3.appspot.com/o {
// ... more rules ...
}
}
A detailed overview of the supported syntax and functions is available at Learn to Secure Files. It's a good reference if you encounter more compilation errors.

Categories

Resources