แก้ไขปัญหา Cross-Origin Resource Sharing (CORS) ใน dev-tool ของ browser ขึ้นเตือน
เกิดจากในหน้าเว็บมีการเรียกใช้งาน url ระหว่าง frontend , backend แยกกันซึ่งทำให้ resource
บางส่วนไม่ได้ถูกแชร์หรืออนุญาตให้ url มาดึงได้ ดังนั้นเลยต้องประกาศว่า ให้ url ไหนบ้างที่สามารถมาดึง resource ได้
===== Basic
Access-Control-Allow-Origin: คือ Origin ที่อนุญาตให้ใช้ Resource ร่วมกันได้
Access-Control-Allow-Methods: คือ Methods ที่อนุญาตให้ใช้ในการติดต่อได้
Access-Control-Allow-Headers: คือ Headers ที่อนุญาตให้ใช้ในการติดต่อได้
==== Add in js
const express = require("express")
const app = express()
const PORT = process.env.PORT || 8445
app.use((req, res, next) => {
let ALLOW_ORIGIN = ['domain-a.com', 'domain-b.com', 'domain-c.com']
let ORIGIN = req.headers.origin
if (ALLOW_ORIGIN.includes(ORIGIN)) {
res.header('Access-Control-Allow-Origin', ORIGIN)
}
res.header('Access-Control-Allow-Methods','POST, GET, PUT, PATCH, DELETE, OPTIONS')
res.header('Access-Control-Allow-Headers','Content-Type, Option, Authorization')
return next()
})
}
app.use('/', (req,res) => res.send("test"))
app.listen(PORT, () => { console.info(`server started on port ${PORT}`)})
