0

I have a react app with a connected SQL database running on local host, this works fine. I have now moved my react app into a chrome extension, which also works fine with my database.

My problem is that every time I open the chrome up app I need to run npm run devStart in the console of my SQL server so that the app is able to send and get data.

Is there a way I can automatically start the SQL server when I use the chrome app?

manifest.json

{
"manifest_version": 2,
"name": "Study Buddy",
"author": "dave",
"version":"1.0.1",
"description": "All in one app for all your studying needs!",
"icons":{
  "16": "favicon.ico",
  "48": "favicon.ico",
  "128": "favicon.ico"
},
"browser_action":{
  "default_popup":"index.html",
  "default_title": "Study Buddy"
},
"background": {
  "scripts": ["newbackground.js"],
  "persistent": false
}
}

SQLserver.js

const express = require('express'); 
const app = express() 
const mysql = require('mysql'); 
const cors = require('cors') 

const db = mysql.createConnection({
    host:'localhost',
    user: 'root',
    password: '******',
    database: 'calendardb',
});


var currentDate = ""

app.use(cors());
app.use(express.json()); 

// insert information in to DB
app.post('/send',(req,res) =>{
    const userEvent = req.body.userEvent
    const userDate = req.body.userDate
    currentDate = req.body.userDate
    console.log("FROM DB ADD",userDate,"d",currentDate)
    db.query('INSERT INTO calevent (userEvent, userDate) VALUES (?,?)', 
    [userEvent,userDate], (err,result) =>{
        if(err){
            console.log(err)
        } else{
            res.send("Data send to DB")
        }
    }
    );
  });

//Getting Specific  data from DB
app.get("/getData",(req, res) =>{
    const userDate = req.query.userDate
    console.log(userDate)
    //console.log(req.params.event)
    db.query("SELECT * FROM calevent WHERE userDate = ?", userDate, (err, result) => {
        if(err){
            console.log(err)
        }else{
            res.send(result)
        }
        console.log(result)
    });
});

//Getting ALL data from DB
app.get("/getAllData",(req, res) =>{
    const userDate  = currentDate
    console.log("FROM DB GET",userDate)
    db.query("SELECT * FROM calevent", (err, result) => {
        if(err){
            console.log(err)
        }else{
            res.send(result)
        }
        console.log(result)
    });
});

//Update data
app.put('/update', (req,res) => {
    const newUserEvent = req.body.userEvent;
    const id = req.body.id;
    db.query("UPDATE calevent SET userEvent = ? WHERE id = ?", [newUserEvent, id],(err, result) => {
        if(err){
            console.log(err)
        }else{
            res.send(result)
        }
    });
});

app.delete('/delete/:id',(req,res) =>{
    const id = req.params.id;
    db.query("DELETE FROM calevent WHERE id = ?",id,(err, result) => {
        if(err){
            console.log(err)
        } else{
            res.send(result)
        }
    }
        )
})

app.listen(3001, () =>{
    console.log('bonger');
});

package.json

{
  "name": "server",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "node serverIndex.js",
    "devStart": "nodemon serverIndex.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "body-parser": "^1.19.0",
    "cors": "^2.8.5",
    "express": "^4.17.1",
    "mysql": "^2.18.1",
    "nodemon": "^2.0.7"
  }
}


TheRizza
  • 1,577
  • 1
  • 10
  • 23
  • Chrome extensions can't start external processes for what should be obvious reasons. You'll need to instruct your users to start MySQL separately - or use the storage facilities provided by the browser host, namely `chrome.storage`. – Dai Jun 30 '21 at 06:27
  • How would a chrome application normally connect to an sql database? – CodeConfusion Jun 30 '21 at 06:43
  • Although [possible](https://stackoverflow.com/questions/857670/how-to-connect-to-sql-server-database-from-javascript-in-the-browser) (well, at least 12 yrs ago), it is highly discouraged to connect to any database directly from the browser as it exposes sensitive connection details that would allow other people to mess with your data. You need a server that will handle database management - and you got one. So I'd say the only thing left to do is to deploy your server app and your database on some public hosting and connect to it from the extension. – Sebastian Kaczmarek Jun 30 '21 at 06:56
  • But my app is currently a working chrome extension, how can I deploy my sql database so that it's always active to send and get data from? It works fine when I run it locally but like you said that would not be the best way to have it working, and even if I was to do it that way I would need to run ```npm run devStart``` everytime I wanted the DB to update. – CodeConfusion Jun 30 '21 at 07:47

0 Answers0