I can´t send POST from 8080 to 3000 - oracle

Question

CRUD APP dosent send anything to my API. Do you have an idea what the Problem could be?
On localhost:8080
I get Status 200 + "Transmission failed"
On localhost:3000
NETWORK-TAB give me Status 200. Got nothing from localhost:8080
I also checked my Cache.
Backend: (localhost:3000)
set Cors
set body-parser
Checked connection to DB is running and fetching data from the database.
Firewall:
1.disabled than tried again... nothing.
2.created incoming and outgoing rules for port 8080 and for 3000. They are active.
Frontend: (localhost:8080) Vue:
<template>
<div class="home">
<h1>Test</h1>
<div class="user-add">
<h2>Add user</h2>
<input type="text" v-model="name" /> <br />
<button #click="storeUser">Store</button>
</div>
</div>
</template>
<script>
import axios from "axios";
export default {
name:'CRUD2',
data() {
return {
user: {},
};
},
mounted() {
},
methods: {
async storeUser() {
try {
const user = await axios.post(
"http://localhost:3000/easy",
{
name: this.name,
}
);
console.log(user)
if (user.status === 201) {
console.log("Transmission successful
");
} else {
console.error("Transmission failed
");
}
} catch (error) {
console.error(error);
}
},
}
};
</script>
Backend: index.js Node(express) localhost(3000):
const express = require("express");
const oracledb = require('oracledb');
const cors = require('cors');
const bodyParser = require("body-parser");
const app = express();
app.use(express.json());
app.use(cors({
origin: 'http://localhost:8080'
}))
/* I tried also do this..
app.use(function(req, res, next) {
req.header("Access-Control-Allow-Origin", "*");
req.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next();
});*/
app.use(bodyParser.json());
oracledb.outFormat = oracledb.OUT_FORMAT_OBJECT;
//GET
app.get("/easy", async (req, res) => {
let con;
try {
con = await oracledb.getConnection({
user: "user",
password: "password",
connectString: "h2922093.stratoserver.net:1521/orcl.stratoserver.net"
});
const data = await con.execute(`SELECT * FROM EASY`);
res.json(data.rows);
} catch (err) {
console.error(err);
res.sendStatus(500);
} finally {
if (con) {
await con.close();
}
}
});
//POST
app.post("/easy", async (req, res) => {
let con;
try {
con = await oracledb.getConnection({
user: "user",
password: "password",
connectString: "h2922093.stratoserver.net:1521/orcl.stratoserver.net"
});
const body = req.body;
const sql = `INSERT INTO EASY (NAME)
VALUES (:name)`;
const result = await con.execute(sql, [
body.name,
]);
if(result.rowsAffected){
res.send({
message: `${result.rowsAffected} row(s) inserted`,
status: 201
})
}else {
res.sendStatus(500);
}
} catch (err) {
console.error(err);
res.sendStatus(500);
} finally {
if (con) {
await con.close();
}
}
});
app.listen(3000, () => {
console.log("Server started on http://localhost:3000");
});
localhost:8080
localhost:8080
localhost:3000
`
`I tried:
Check my code in Backend;
Check my code in Frontend;
Backend: (localhost:3000)
-set Cors
-set body-parser
-Checked connection to DB is running and fetching data from the database.
Firewall:
1.disabled than tried again... nothing.
2.created incoming and outgoing rules for port 8080 and for 3000. They are active.
I´m expecting:
to send POST {test2} from localhost:8000 to localhost:3000 and INSERT test2 into Table EASY`

Answer 1

I solved the Issue myself:
Frontend:
async addData() {
//You can give an id for your input (id="nameInput")
const name = nameInput.value;
nameInput.value = "";
fetch('http://localhost:3000/easy', {
headers: {
'Content-type': 'application/json'
},
method: 'POST',
body: JSON.stringify({
name: name
})
})
.then(response => response.json())
}
}
Backend:
And please not forget in backend in your index.js file to define (and install of course the pakets):
const express = require('express');
const app = express();
const cors = require('cors');
const oracledb = require('oracledb');
oracledb.outFormat = oracledb.OUT_FORMAT_OBJECT;
app.use(cors());
app.use(express.json());
app.use(express.urlencoded({ extended: false }));

Answer 2

I tested with Postman:
Get Request works properly that means I got only the one Object and Status 200 back
[{
“NAME”: “Test”
}]
Post Request http: //localhost:3000/easy: I send it as a JSON : { “name”: “test2”} and I got also the message Status 201. But that is strange because nothing was inserted into my table or see anything on my localhost:3000/easy except the one Object with the name: Test.
{
"message": "1 row(s) inserted",
"status": 201
}
I set also the headers:
app.use(function (req, res, next) {
res.header("Access-Control-Allow-Origin", "http://localhost:8080");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next();
});
And I changed the CORS Library to cors-express: const cors = require('cors-express');