1

I'm new to react, and I want to set up an API server to get SQL Server data, and I want to send multiple fetch requests to the API server.

I've tried the promise.all method, but it's always failing on the second fetch request. The only way I could make it work is by nesting the requests through.then, but I prefer not to, since the number of fetch requests are varied.

Here's my code:

Promise.all([
//the number of requests varied
    fetch('http://localhost:8080/api/report/favorite/check/1/1').then(value => value.json()),
    fetch('http://localhost:8080/api/report/favorite/check/1/4').then(value => value.json())
    ])
    .then((value) => {
        //I always get EALREADYCONNECTING error here from 2nd request and on
        console.log(value)
    })
    .catch((err) => {
        console.log(err);
    });

Does the problem lie in the API server configuration?

//Initializing node modules
var express = require("express");
var bodyParser = require("body-parser");
var sql = require("mssql");
var app = express(); 

// Body Parser Middleware
app.use(bodyParser.json()); 

//CORS Middleware
app.use(function (req, res, next) {
//Enabling CORS 
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Methods", "GET,HEAD,OPTIONS,POST,PUT");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, contentType,Content-Type, Accept, Authorization");
next();
});

//Setting up server
var server = app.listen(process.env.PORT || 8080, function () {
var port = server.address().port;
console.log("App now running on port", port);
});

var connPool = new sql.ConnectionPool({
    user: 'someuser',
    password: 'somepassword',
    server: 'some\\thing',
    database: 'somedb',
    port: 12345
});

//Function to connect to database and execute query
var executeQuery = function(res, query){
connPool.connect().then(function () {
    // create request object
    var request = new sql.Request(connPool);
    // query to the database
    request.query(query).then(function (recordset) {
        res.send(recordset)
        connPool.close();
    })
    .catch(function (err) {
        console.log("Error while querying database :- " + err);
        res.send(err)
        connPool.close();
    });
})
.catch(function (err) {
    console.log("Error while connecting database :- " + err);
    res.send(err);
});
}

//GET API
app.get("/api/report/favorite/check/:userid/:reportid", function(req, res){
    var query = "EXEC rpt.proc_ReportFavoriteCheck " + req.params.userid + ", " + req.params.reportid;
    executeQuery (res, query);
});

I tried several methods, as described here, but I can't make it work:

Fetch API requesting multiple get requests

Multiple fetch requests with setState in React

How to finish Fetch data completely and assign it to component state before proceeding further in componentDidMount React?

1 Answer 1

0

Solved this by changing my API server configuration:

var executeQuery = async function(res, query){
    const pool = new sql.ConnectionPool(dbConfig);
    pool.on('error', err => {
        console.log('sql errors ', err);
    });

    try {
        await pool.connect();
        let result = await pool.request().query(query);
        console.log('success')
        res.send(result);
        return {success: result};
    } catch (err) {
        console.log('error')
        console.log(err)
        res.send(err);
        return {err: err};
    } finally {
        pool.close();
    }
}
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.