React app - unable to connect to SQL Server database

Question

I want to connect my database to my react app however I'm very confused on how to do this. I made the database using SQL in SQL Server Management Studio. I've tried using express to connect it to my app however I know there's a lot missing from my code. What do I need to add/change to my code to connect it to my project?

UPDATE:

I made an express app and wrote some code in users.js:

var express = require('express');
var router = express.Router();

/* GET users listing. */
router.get('/', function(req, res, next) {
  res.send('respond with a resource');
});

router.get('/', function(req, res, next) {
  connection.query('SELECT * from project_ideas', function (error, results, fields) {
   if (error) throw error;
   res.send(JSON.stringify(results));
 });
});

module.exports = router;

I added this code to App.js in the React app:

var React = require('react')
var App = React.createClass({
  getInitialState: function() {
    return {
      members: []
    };
  },
  componentDidMount() {
    fetch('/users')
      .then(res => res.json())
      .then(project_ideas => this.setState({ project_ideas: project_ideas }));
  },
  render: function() {
    return (
        <div className="Ideas">
          <h1>Ideas</h1>
          {this.state.project_ideas.map(project_ideas =>
            <div key={project_ideas.id}>{project_ideas.idea}</div>
          )}
        </div>
    );
  }
});

module.exports = App;

MatthiasV · Accepted Answer · 2020-01-29 12:11:45Z

1

You have to use a database client. For example mssql.

Then u can do something like this in users.js:

var express = require('express');
var router = express.Router();
var sql = require('mssql');

const config = {
    user: '...',
    password: '...',
    server: 'localhost', // You can use 'localhost\\instance' to connect to named instance
    database: '...',
}

/* GET users listing. */
router.get('/', (req, res, next) => {
    res.send('respond with a resource');
});

router.get('/project_ideas', async (req, res, next) => {
    let pool = await sql.connect(config)

    let result = await pool.request().query('SELECT * from project_ideas');

    res.send(JSON.stringify(result));
});

module.exports = router;

In the config enter the user, password and database name

If you want to use Windows Authentication you also need the package msnodesqlv8 like described here in the doc.

So u have to do npm install msnodesqlv8 and in ur code use this instead of the normal mssql import:

const sql = require('mssql/msnodesqlv8');

and change the config to:

const config = {
    server: 'localhost', // You can use 'localhost\\instance' to connect to named instance
    database: 'Your Database Name',
    options: {
        trustedConnection: true
    }
}

Also you need to set a different route for your second .get otherwise it will always use the one which was declared first.

edited Jan 29, 2020 at 12:11

answered Jan 29, 2020 at 9:28

MatthiasV

712 silver badges4 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

SK1dev Over a year ago

Thank you, this has really helped me gain more understanding on how to connect it however I don't have a password. I've updated my question with how I connect to the sql server. I just have a server name and authentication. @MatthiasV

MatthiasV Over a year ago

Is the user DESKTOP-6ON9\SK in the Screenshot your Windows User or is it a domain user?

SK1dev Over a year ago

I believe it's a domain user. @MatthiasV

MatthiasV Over a year ago

I have updated my answer so it also works with windows authentication. But keep in mind that this only works if the script runs with the same user u are using to authenticate on the sql server.

Collectives™ on Stack Overflow

React app - unable to connect to SQL Server database

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related