Tartalomjegyzék

< Express

Express - Cors

Szerver

app/rotues.js
const Router = require('express')
const router = new Router()
 
router.get('/msg', (req, res) => {
    res.json({msg: 'mehet'})
})
 
module.exports = router
app/index.js
const express = require('express')
const router = require('./routes')
const app = express()
 
app.use(express.json())
app.use('/',router)
 
PORT = process.env.PORT || 8000
app.listen(PORT, () => {
    console.log(`Listening: ${PORT}`)
})

Készítsünk kliens

src/index.html
<html>
<script src="app.js"></script>
</html>
src/app.js
fetch('http://localhost:8000/msg')
    .then((res) => res.json())
    .then((data) => console.log(data))

Futtassuk szerveren, például lite-server. 

{
    "server": ["src"]
}
pnpm install lite-server

Ha Insomnia, Postman, HTTPie vagy curl segítségével nézem meg az API-t nincs probléma.

Ha készítek egy weblapot, ami a kliensként fog működni, és az egy másik szerveren futtatom, például a lite-serveren, akkor ez nem fog működni. A Cors beállításokra panaszkodik.

A cors beállítása

pnpm install cors
const cors = require('cors')
 
app.use(cors())

Ezzel a beállítással már működik.

Szabályozhatjuk honnan engedélyezzük. Egy teljesebb kóddal:

app/index.js
const express = require('express')
const router = require('./routes')
const app = express()
 
const cors = require('cors')
var corsOptions = {
     origin: 'http://192.168.10.109:8000'
}
app.use(cors(corsOptions))
 
app.use(express.json())
app.use('/',router)
 
PORT = process.env.PORT || 8000
app.listen(PORT, () => {
    console.log(`Listening: ${PORT}`)
})

Linkek