i am trying to build a simple connection to a mongodb.
If possilbe i would like to use mongoose for that. I am using React Native and Expo.
I have seen that in the documentation of MongoDB it says that i can`t use MongoDB directly with Expo. Thats the reason for mongoose.
import mongoose from "mongoose";
const mongoURL = '***';
mongoose.connect(mongoURL);
const db = mongoose.connection;
db.on("error", console.error.bind(console, "MongoDB Connection error"));
This is part of my App.ts
My tsconfig.json is this
{
"extends": "expo/tsconfig.base",
"esModuleInterop": true,
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"module": "esnext",
"jsx": "react",
"strict": true
}
}
So far when building the app on my android device i get the error
_mongoose.default.connect is not a function
Haven´t been able to resolve this with past questions yet.
I am also open to other cloud-based databases
Is this even the right approach?
You should use a server to connect your client (app) to the database (mongo), all your secrets can be revealed in the source code of the app so its very unsafe.
check this article https://rahmanfadhil.com/express-rest-api/ for simple explanation
Related
im facing error while im trying to use proxy in package.json on react app and connect to django backend api in local host but when i tried to npm start i get this error:
Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
- options.allowedHosts[0] should be a non-empty string.
i tried all these steps as shown below and nothing worked pls help.
1- I tried to set HOST in .env file to http://127.0.0.1:8000 but it didnt work!
2- I've tried:
"proxy": "http://django:8000",
it changed nothing !!!
then i found a workaround by using the http-proxy-middleware from:
https://sunkanmi.hashnode.dev/how-to-setup-proxy-in-react-with-http-proxy-middleware
but i am not looking for a workaround !!!
My package.json look like this
{
"name": "frontend",
"version": "0.1.0",
"proxy": "http://127.0.0.1:8000",
"private": true,
"dependencies": {
3- i have also tried:
"proxy": "http://127.0.0.1:8000",
"allowedHosts": [
"127.0.0.1"
],
"private":true,
didn't work !!!
4- i tried changeing http://127.0.0.1:8000 to http://localhost:8000 didnt work!
5- i tried changeing allowed host in django seetings.py to ['*'] and ['http://127.0.0.1:8000', 'http://localhost:8000'] didnt work !
6- i tried changeing
CORS_ALLOW_ALL_ORIGINS
to True and then changing it to
CORS_ALLOWed_ORIGINS = [
'http://localhost:3000'
]
didnt work!!!
🦋 Butterfly 🦋
after some searching and changeing some stuff i figured out that when you want to use proxy in the react app if you are connected to a vpn you most disconnect from it to get the react server running :)
simplest things can take a lots of time from you in this job
In some of projects I encountered in create-react-app people use file setuProxy.js which has content like this inside:
const proxy = require("http-proxy-middleware");
module.exports = function (app) {
app.use(
proxy("/api/mobile-activity/ws", {
target: "http://localhost:3001/socket.io",
pathRewrite: { "^/api/mobile-activity/ws": "" },
ws: true,
})
);
app.use(
proxy("/api/vehicle-accident-protocols", {
target: "http://10.1.1.24:7071",
pathRewrite: { "^/api/vehicle-accident-protocols": "" },
})
);
};
I have tried reading about why we need this but most explanations I find online are about how to do this, rarely they explain clearly why we need this. Can someone in easily understandable way explain why we need this file? I am beginner as far as network infrastructure etc is concerned, that's why maybe I am failing to grasp why we need it.
In general, A proxy or proxy server serves as a gateway between your app and the internet. It’s an intermediate server between client and servers by forwarding client requests to resources.
In React, we often use this proxying in the development environment. React uses a create-react-app (webpack dev server) to serve the app in development mode.
Follow this link for more explanations
I have EXTJS 6 app packed in web app (.war) deployed on jetty server behind apache proxy
Proxy is configured to proxy requests to my jetty node server
example:
https://my.domain/sencha << internet addess
is proxied to internal jetty server
http://jetty-node-1/my-sencha-webbapp << node address
Problem:
I don't know where to set /sencha uri in my extjs app as base path so that everything is loaded relatively from /sencha path instead of / path
Regards
Armando
I've solved it.
In app.json I added this setting
"base": "${app.dir}/sencha/"
Now it knows all about the relative path.
Snippet from app.json:
"production": {
"output": {
"appCache": {
"enable": true,
"path": "cache.appcache"
},
"base": "${app.dir}/sencha/"
},
}
please note that this creates sub folder ${app.dir}/sencha in which your production build will be.
Regards
Armando
I have developed angular application in my local machine.
In my application I'm making the rest call to get the data.
So in my local machine I'm getting the CORS issue.
But when I deploy this angular application on the same server with same port
i.e. both rest api and my application are on same server with same port.
REST API:- http://domain:port/api
App URL:- http://domain:port/home
Then also I'm getting the CORS issue while making the call to rest api.
Please explain me how to resolve this.
Thanks,
Suresh
On your local machine you can create a proxy to redirect calls to the api to be on the same port as your angular app. Create a file called proxy.conf.json and put the following in it changing apiport to your apis port number.
{
"/api/*": {
"target": "http://localhost:apiport/api/",
"pathRewrite": {
"^/api": ""
},
"changeOrigin": true,
"secure": false,
"logLevel": "debug"
}
}
and then start the app with
ng serve --proxy-config proxy.config.json
or add the following to the scripts section of your package.json file
"localstart": "ng serve --proxy-config proxy.config.json",
and start with
npm run localstart
I am developing app with react-redux. And I am using the quick development, which always build my client at localhost:3000
I have my api written in php, and its on localhost:80.
So its cross-origin, but on production its not. So I would like to develop it while being on the same domain+port. But I have no clue how to set it up.
I am using MAMP - Apache for the php and yarn (create-react-app) for react.
So it can't run at the same port.
Anyone any ideas how to solve this problem?
When I use "yarn start" I can edit my react code and its compiled upon save and I can see the edited code within seconds at the localhost:3000
Is it possible to "deploy" it in this "developer" mode into some folder, where I could possibly setup a server using actually MAMP ( apache ) ?
Thanks in advance
In case if for client side of your application you have use create-react-app, you can add a proxy configuration in package.json file.
"proxy": {
"/apiRoute": {
"target": "http://localhost:80"
},
},
So all your request will be redirected to port 80(PHP) from client side.
The /apiRoute is the name of the routes (GET, POST, PUT..) you had defined in PHP. So i would suggest to make a pattern in PHP for all routes like /api/**, so in package.json instead of adding all routes, you can something like below
"proxy": {
"/api/*": {
"target": "http://localhost:80"
},
},