React Native post to Node.js/Express

789087 0
Viewed 47

I am triying to make a post query from my React Native (expo) app to Node.js server (express). And the post is doing nothing. Even, console.log doesnot work. Please, need your help with this React Native App code:

        const options = {
            method: 'POST',
            timeout: 20000,
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json;charset=UTF-8'
            },
            body: JSON.stringify({
                a: 10,
                b: 20
            })
        };
        fetch(url, options)
        .then(response => {
            console.log(response.status);
        })
        .catch(error => console.error('timeout exceeded')); 

        console.log('3232');

And node.js code:

var express = require('express');
/// create express app
var app = express();
app.use(express.json());

app.post('/g_data/auth', function(req, res){
    console.log('LOGGED')
    res.send('Hello World!')
});

React Native console return : "3232"

node.js console return nothing

No "new incoming connection detected from ...", "LOGGED", as expected.

Please help, what I am doing wrong?

native react-native reactjs express node.js
2 Answers

maybe u need to install and import body-parser on your node js

var express = require('express');
var bodyParser = require('body-parser'); // ++

/// create express app
var app = express();
app.use(express.json());
app.use(bodyParser.urlencoded({extended: false})); // ++

app.post('/g_data/auth', function(req, res){
    console.log('LOGGED')
    res.send('Hello World!')
});
TimoDevs0

Ok! the final solution is in wrong Headers. For some reasons, React Native app send Headers: 'Content-Type': 'application/json;charset=UTF-8' But node.js server receives: 'Content-Type': 'text/plain;charset=UTF-8'

So, first, I have installed cors to server, npm i cors -save and for some reason left Body Parser, and a little bit modernize headers. Here is a final code: React Native App:

let formdata = '["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]';
        ///console.log(formdata);
        const url = 'http://192.168.88.15:7935/g_data/auth';
        const options = {
            method: 'POST',
            timeout: 20000,
            mode:'cors',
            headers: {
                'Content-Type': 'application/json; charset=utf-8',
            }, 
            body: formdata
        };
        fetch(url, options)
        .then((response) => response.json())
        /// make design
        setLoading(false);
        /// next code
        console.log('next!');

The server code is:

var express = require('express');
var cors = require('cors')
var bodyParser = require('body-parser');
/// create express app
var app = express();
/// use cors
app.use(cors())
/// use body req parser
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

app.post('/g_data/auth', function(req, res){
    console.log(req.body)
    res.send({Message: 'Hello World!'})
});

app.listen(7935);
console.log('listen port 7935');
7890870
Related