I am trying to create a standard profile page for a user when signed in. I am trying to pass through a variable (email). I am completely clueless on how to pass this variable through to the express route as it would need to be done through a get route as it is pulling back data.

This is what I have.

where the fetch is used.

As you can see I am attempting to send the variable email through here.

 getItems() {
    try {
      const email = window.localStorage.getItem("User");
      const data = { email };
      fetch("/profile-account-details", email)
        .then(recordset => recordset.json())
        .then(results => {
          this.setState({ AccountDetails: results.recordset });
        });
    } catch (e) {
      console.log(e);
    }
  }

The route of this fetch through my server.js file. I am simply needing to use this with the stored procedure. All I need essentially need is for the variable to be available here.

app.get("/profile-account-details", function(req, res) {
  // connect to your database
  sql.connect(config, function(err) {
    if (err) console.log(err);

    // create Request object
    var request = new sql.Request();

    // query to the database and get the records
    request.execute("dbo.ProfileAccountDetails", function(err, recordset) {
      if (err) console.log(err);
      // send records as a response
      res.json(recordset);
    });
  });
});

All I simply want to do is pass through a variable from the get items function and use it within my route. I feel like this is a very simple answer for something I am overlooking.

Any help is greatly appreciated

I am trying to create a standard profile page for a user when signed in. I am trying to pass through a variable (email). I am completely clueless on how to pass this variable through to the express route as it would need to be done through a get route as it is pulling back data.

This is what I have.

where the fetch is used.

As you can see I am attempting to send the variable email through here.

 getItems() {
    try {
      const email = window.localStorage.getItem("User");
      const data = { email };
      fetch("/profile-account-details", email)
        .then(recordset => recordset.json())
        .then(results => {
          this.setState({ AccountDetails: results.recordset });
        });
    } catch (e) {
      console.log(e);
    }
  }

The route of this fetch through my server.js file. I am simply needing to use this with the stored procedure. All I need essentially need is for the variable to be available here.

app.get("/profile-account-details", function(req, res) {
  // connect to your database
  sql.connect(config, function(err) {
    if (err) console.log(err);

    // create Request object
    var request = new sql.Request();

    // query to the database and get the records
    request.execute("dbo.ProfileAccountDetails", function(err, recordset) {
      if (err) console.log(err);
      // send records as a response
      res.json(recordset);
    });
  });
});

All I simply want to do is pass through a variable from the get items function and use it within my route. I feel like this is a very simple answer for something I am overlooking.

Any help is greatly appreciated

• javascript
• reactjs
• express

3 Answers 3

If it's a get API I think you can add a query param in your client

 getItems() {
    try {
      const email = window.localStorage.getItem("User");
      const data = { email };
      //I'm adding query params here
      fetch(`/profile-account-details?email=${email}`)
        .then(recordset => recordset.json())
        .then(results => {
          this.setState({ AccountDetails: results.recordset });
        });
    } catch (e) {
      console.log(e);
    }
  }

And in your server code

app.get("/profile-account-details", function(req, res) {
  // Get the email from the query params
  let email=req.query.email
  sql.connect(config, function(err) {
    if (err) console.log(err);

    // create Request object
    var request = new sql.Request();

    // query to the database and get the records
    request.execute("dbo.ProfileAccountDetails", function(err, recordset) {
      if (err) console.log(err);
      // send records as a response
      res.json(recordset);
    });
  });
});

The other answers recommend using a GET with a query param. But you likely don't want to expose this email in the URI.

Depending on your use case - this is insecure, and allows a MiTM to read the email of your customers.

You can use the req.body to send sensitive data in a POST request.

fetch('/profile-account-details', { method: 'POST', body: JSON.stringify({ email }) });

Then in your express route.

1. Change to app.post

app.post("/profile-account-details", function(req, res) {

});

2. Read the req.body

const { email }  = JSON.parse(req.body) // can't remember if you need to use JSON.parse

You can use Url paramters to pass through your data with the url .. they are sent with the the url. you just have to concatenate it with the url string.

 getItems() {
try {
  const email = window.localStorage.getItem("User");
  const data = { email };
  fetch("/profile-account-details/" + email)
    .then(recordset => recordset.json())
    .then(results => {
      this.setState({ AccountDetails: results.recordset });
    });
} catch (e) {
  console.log(e);
}
}

these can be access in your server like this ::::

app.get("/profile-account-details/:email", function(req, res) {
// Get the email from the url params
 let email=req.params.email
 sql.connect(config, function(err) {
if (err) console.log(err);

// create Request object
var request = new sql.Request();

// query to the database and get the records
request.execute("dbo.ProfileAccountDetails", function(err, recordset) {
  if (err) console.log(err);
  // send records as a response
  res.json(recordset);
});
});
});

You can give it any name in your server side code. the name you specified after the ":" in the route is the name it will be accessible in your Api.In your case it is email. i.e "/profile-account-details/:email"