I've built a backend Stripe server to handle payments for my react native and react app.
Something I'm concerned about is what happens when someone gets accessed to the decompiled client source code.
Is there a way I can ensure that only authorised clients can make api calls?
Related
I'm fairly new to React Native and Expo, and I'm confused about how cookies are managed. I have an Express server that sets a token cookie in a response (res.cookie("jwt",token)). Somehow when my React Native client makes an authentication request and receives a response, the client stores the cookie somewhere, and the token is passed in future requests (with credentials: "include"), until I restart the emulator. My main questions are
Where are these cookies stored?
How can I access them?
I was under the impression that React Native doesn't really support cookies. Is this functionality specific to Expo?
If I were to deploy this as a real mobile app, can I rely on this cookie behavior, or should I use one of the React Native cookie management packages?
Thank you in advanced for your help!
ReactNative does not have this support by default as it runs on the native side (well, you do have support on the WebView component but that's isolated)
If you are relying on Expo they are still figuring out the cookies management, you can follow the updates in this issue, they are aware about the persistence of cookies been inconsistent between app loads:
https://github.com/expo/expo/issues/6756
If you have to use the cookies anyway I would suggest to use this lib, it seems quite stable, but maybe you will need to implement some integrations with your API yourself:
https://github.com/react-native-cookies/cookies
Wish success on your project.
I want to retrieve secrets from keyvault in React application by passing clientid, clientkey and tenantid. Followed the below sample but receiving the error - "EnvironmentCredential is not supported in browser".
https://github.com/Azure/azure-sdk-for-js/blob/master/sdk/keyvault/keyvault-secrets/samples/typescript/src/helloWorld.ts
Application - React [TypeScript]
Browser - Chrome 86.0
Thanks.
Deb
The error is intended- the DefaultAzureCredential() is supported in Node (server-side JS) but not client-side Javascript: https://github.com/Azure/azure-sdk-for-js/issues/10645
The primary reason for this is because it's usually a serious security hole to expose your clientKey to anyone browsing your site.
If your React app is using an API, then it's best to have React call your API and then have the API talk to Key Vault. If you don't have one currently, then something like a simple Functions or Logic app can act as an API for you. (Functions in particular has a free tier if your site is low traffic).
If you understand the risks and still want to do this in the browser, you have a couple options- you can create the TokenCredential yourself to pass into the client, or you can skip the SDK and call the API directly.
I came across this issue when consider the fact that my react-application needs API keys to access a backend it is using for CRUD operations on a secured database:
https://create-react-app.dev/docs/adding-custom-environment-variables/
WARNING: Do not store any secrets (such as private API keys) in your React app!
I want users authenticated into the application to be able to perform these operations without necessarily having the API keys exposed to the end user.
Common consensus seems to be create a mid layer, ie an express server that handles enriching/forwarding the request properly. But at that point, the same issue occurs if I want to authenticate the web app against the midlayer, ending up one way or another exposing the original secured API backend.
Is there a way to guarantee a "handshake" between the front end application and the original secured backend? If I need access to the code base to do so, can I do so via a mid layer instead
You have to disable the CORS in your express server.Thats means except your front end, no other client can send request to your Express server. And then, though your authorizationfor your express server is exposed but its not gonna help unless the request is from your front end app.
How can I subscribe a redis channel inside a React Component when it is mounted (i.e, inside the componentDidMount() ) ?
In the internet almost everywhere I see the redis implementation with nodejs but can't find any
sufficient hints how to use this in React App.
Actually I want to update my ecommerce dashboard (react app) data without refreshing the page. In the backend I used djangorest framework. When any API is fired to change any data the python code doing its work and also publishes a message in a specific Redis channel.
I want to subscribe that channel from the client (react app) so that it can consume this message and update it's content real time.
A react component (client technology) should not be able to access redis (server technology) for obvious security matters.
If you use react at server side to generate responses with react using node, that's node that should make this access.
If you want to access redis from a web front end (with a web browser), you must establish the following architecture:
React accesses a server using websocket and listens for messages.
The server in node js (using socket.io), in aspnet core (using signalR) access redis and communicate changes to the client thank to websocket technology.
If you want more details about how to do, you should describe that technology stack you use at client side.
But to make it short, for client side, the best is to use the redux observable stack. In this case, that would be an epic that would update the redux state whenever the server notifies something. If you are not comfortable with rxjs (this is very understandable!), then the easiest would be to use mobX (https://mobx.js.org/README.html)
I'm currently developing a ReactJS & Firebase app, but I'm facing the following problem:
As all the code is run in the client side, how can I connect to the payment API without exposing my private token?
I was thinking on creating a Google Cloud Function that could handle this requests. I think this functions should manage maybe a sign in to get the token, and later request the payments. Should this work?
Right now Google Cloud Functions isn't free to make requests out of a Google app. Does someone know how could I avoid the $25/month?
Another alternative I was thinking on was creating a Rails API on Heroku to manage only this requests, but I'm not sure if I'm not exposing the tokens by managing the logic on the front side. (Because the front end would have to talk to Firebase and this new API)
Security is a must.
Thanks!