Golfreeze.packetlove.com: Life style of Golfreeze Canon400D Family kammtan.com Jazz Freebsd Unix Linux System Admin guitar Music

All about unix linux freebsd and FAQ for Packetlove.com Web hosting , Mail hosting , VoIP + IP PBX server => All Security via cyber space relate golfreeze task. => Topic started by: golfreeze on พฤศจิกายน 23, 2019, 10:32:28 AM

Title: แก้ไขปัญหา Cross-Origin Resource Sharing (CORS)
Post by: golfreeze on พฤศจิกายน 23, 2019, 10:32:28 AM
แก้ไขปัญหา 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}`)})