Forward body from request to another url

Question

I am wondering if someone might be able to help figure out how to pass a post body to another endpoint with cloudflare workers? I am trying to get the incoming request post to post to url.

const url = 'https://webhook.site/#!/b2f75ce2-7b9e-479a-b6f0-8934a89a3f3d'
const body = {
  results: ['default data to send'],
  errors: null,
  msg: 'I sent this to the fetch',
}

/**
 * gatherResponse awaits and returns a response body as a string.
 * Use await gatherResponse(..) in an async function to get the response body
 * @param {Response} response
 */
async function gatherResponse(response) {
  const { headers } = response
  const contentType = headers.get('content-type') || ''
  if (contentType.includes('application/json')) {
    return JSON.stringify(await response.json())
  } else if (contentType.includes('application/text')) {
    return response.text()
  } else if (contentType.includes('text/html')) {
    return response.text()
  } else {
    return response.text()
  }
}

async function handleRequest() {
  const init = {
    body: JSON.stringify(body),
    method: 'POST',
    headers: {
      'content-type': 'application/json;charset=UTF-8',
    },
  }
  const response = await fetch(url, init)
  const results = await gatherResponse(response)
  return new Response(results, init)
}
addEventListener('fetch', (event) => {
  return event.respondWith(handleRequest())
})

Answer 1

I created a worker at https://tight-art-0743.ctohm.workers.dev/, which basically forwards your POST request's body to a public requestbin. You can check what is it receiving at: https://requestbin.com/r/en5k768mcp4x9/24tqhPJw86mt2WjKRMbmt75FMH9

addEventListener("fetch", (event) => {
  event.respondWith(
    handleRequest(event.request).catch(
      (err) => new Response(err.stack, { status: 500 })
    )
  );
}); 

async function handleRequest(request) {
  let {method,headers}=request,
      url=new URL(request.url)
  // methods other than POST will return early
  if(method!=='POST') return new Response(`Your request method was ${method}`);

  const forwardRequest=new Request("https://en5k768mcp4x9.x.pipedream.net/", request)
  forwardRequest.headers.set('X-Custom-Header','hey!')
  return fetch(forwardRequest)
}

You can see it working with a simple CURL request

curl --location --request POST 'https://tight-art-0743.ctohm.workers.dev/' \
--header 'Content-Type: application/json' \
--data-raw '{"environment": {"name": "Sample Environment Name (required)"}}'

Two things worth noting, in the worker's code:

1. I'm passing the original request as the init parameter, through which original headers and body are transparently forwarded to the requestbin, also allowing for some extra header manipulation if neeeded.
2. In this example I'm not actually doing anything with the request body. Therefore there's no need to await it. You just connect incoming and outgoing streams and let them deal with each other.

Another example: let's add a /csv route. Requests starting with /csv will not forward your POST body. Instead they will download a remote CSV attachment and POST it to the requestbin. Again, we aren't awaiting for the actual CSV contents. We pass a handle to the response body to the forwarding request

async function handleRequest(request) {
  let {method,headers}=request,
    url=new URL(request.url)
  if(method!=='POST')     return new Response(`Your request method was ${method}`);

  const forwardRequest=new Request("https://en5k768mcp4x9.x.pipedream.net/",request)
  if(url.pathname.includes('/csv')) {
    const remoteSource=`https://cdn.wsform.com/wp-content/uploads/2018/09/country_full.csv`,
          remoteResponse=await fetch(remoteSource)
    return fetch(forwardRequest,{body:remoteResponse.body})
  }  
  forwardRequest.headers.set('X-Custom-Header','hey!')
  return fetch(forwardRequest)
}

While your code should theoretically work, the fact that you're unwrapping the response means your worker could be aborted due to hitting time limits, or CPU, or memory. On the contrary, when using the streams based approach, your worker's execution finishes as soon as it returns the forwarding fetch. Even if the outgoing POST is still running, this isn't subject to CPU or time limits.