Skip to content

Instantly share code, notes, and snippets.

@sid-r-singh
Last active May 27, 2021 02:20
Show Gist options
  • Save sid-r-singh/0f86977ab51a5a88512365e9c3a49631 to your computer and use it in GitHub Desktop.
Save sid-r-singh/0f86977ab51a5a88512365e9c3a49631 to your computer and use it in GitHub Desktop.
My aim: To create a serverless funcion which:
1. receives a POST request
2. forwards the same to Firebase
I didn't want to directly send data to firebase URL from my website since in that way my firebase URL will be exposed.
So I thought of creating a serverless function which can accept POST request from my endpoint/website &
then forward it to Firebase, so that in the whole process my firebase URL is not exposed anywhere.
As a summary: this function acts as an intermediate between my website & Firebase
I just wish to have one security mechanism in place in this function i.e. I check whether the request was from allowed origins or not.
What I did till now:
I looked at few examples from the cloudfare workers website & modified them. Here is the final version which is not working.
// Handle incoming fetch events with handleRequest function
addEventListener('fetch', event => {
event.respondWith(handleRequest(event))
})
// A list of allowed origins that can access our backend API
const allowedOrigins = [
'https://nameless-darkness-755c.sidh.workers.dev',
"http://localhost:3000"
]
// A function that returns a set of CORS headers
const corsHeaders = origin => ({
'Access-Control-Allow-Headers': '*',
'Access-Control-Allow-Methods': 'POST',
'Access-Control-Allow-Origin': origin
})
// Check the origin for this request
// If it is included in our set of known and allowed origins, return it, otherwise
// return a known, good origin. This effectively does not allow browsers to
// continue requests if the origin they're requesting from doesn't match.
const checkOrigin = request => {
const origin = request.headers.get("Origin")
const foundOrigin = allowedOrigins.find(allowedOrigin => allowedOrigin.includes(origin))
return foundOrigin ? foundOrigin : allowedOrigins[0]
}
// Make requests based on the request body to Unsplash API
const sendToFirebase = async event => {
// Parse the key "query" from a JSON body in the request
const { query } = await event.request.json()
console.log(query)
const url="https://feedback-gatsby-default-rtdb.asia-southeast1.firebasedatabase.app/data.json"
const init = {
body: JSON.stringify(query),
method: "POST",
headers: {
"content-type": "application/json;charset=UTF-8",
},
}
const response = await fetch(url, init)
console.log(response)
// Check that the request's origin is a valid origin, allowed to access this API
const allowedOrigin = checkOrigin(event.request)
}
async function handleRequest(event) {
// If an OPTIONS request comes in, return a simple
// response with the CORS information for our app
if (event.request.method === "OPTIONS") {
// Check that the request's origin is a valid origin, allowed to access this API
const allowedOrigin = checkOrigin(event.request)
return new Response("OK", { headers: corsHeaders(allowedOrigin) })
}
// If a POST request comes in, handle it using the getImages function
if (event.request.method === "POST") return sendToFirebase(event)
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment