Passing parameters using React fetch to access Node API

Question

I have a react project with NODE API backend. I am facing issues with the very basic fetch GET request. When passing parameters through link, it cannot be accessed at the server side.

My react function:

 const loadOptions = async (cnt) => {
      const response = await fetch(`${baseurl}/pdt/prev=${prev}&cnt=${cnt}`);
      const resJSON = await response.json();
    };

NodeJS express router code:

router.get("/pdt/:prev/:cnt", async (req, res) => {
try {
       console.log(req.params.cnt);
       console.log(req.params.prev);
      
      } catch (err) {
        res.json(err.message);
      }
    });

The result is :

You want `fetch(\`${baseurl}/pdt/${prev}/${cnt}\`)`. See [route parameters](https://expressjs.com/en/guide/routing.html#route-parameters) — Phil, Jul 11 '22 at 04:56
Does this answer your question? [Express routes parameters](https://stackoverflow.com/questions/34704593/express-routes-parameters) — Phil, Jul 11 '22 at 04:57

mostafa soltan · Answer 1 · 2022-07-11T05:44:50.627

0

another solution from backend

 router.get("/pdt", async (req, res) => {
 try {
   console.log(req.query.prev);
   console.log(req.query.cnt);
  
  } catch (err) {
    res.json(err.message);
  }
});

and modify request

fetch(`${baseurl}/pdt?prev=${prev}&cnt=${cnt}`)

edited Jul 11 '22 at 05:44

answered Jul 11 '22 at 05:03

mostafa soltan

23
1
5

score 0 · Accepted Answer · answered Jul 11 '22 at 05:05

0

Edited React code based on the answers I got above. Thank you @Phil

const response = await fetch(`${baseurl}/pdt/${prev}/${cnt}`);

It's working now.

answered Jul 11 '22 at 05:05

Maya

183
1
14

Passing parameters using React fetch to access Node API

2 Answers2