title: CORS blocking access to resource: How to fix in firebase cloud function?
body: <p>Yes, I have the dreaded CORS issue (or, at least it appears so)....and I have searched and tried a few solutions, to no avail...</p>
  <p>I have no problems using firebase emulator and running my function locally, but when I deploy the function and try to send a POST request using fetch() on the local host client-side app, I get the following CORs browser console error (it won't even get to the server logs):</p>
  <pre><code>Access to fetch at 'https://us-central1-XXXX.cloudfunctions.net/deleteAsset' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
  
  The FetchEvent for &quot;https://us-central1-XXXXX.cloudfunctions.net/deleteAsset&quot; resulted in a network error response: the promise was rejected.
  
  Promise.then (async)
  (anonymous) @ firebase-auth-sw.js:77
  firebase-auth-sw.js:77 
          
   Uncaught (in promise) TypeError: Failed to fetch
      at firebase-auth-sw.js:77
  </code></pre>
  <p>Here's my client side fetch request:</p>
  <p><code>UploadImage.vue</code>:</p>
  <pre><code>async deleteFile() {
        await fetch(
          'https://us-central1-XXXX.cloudfunctions.net/deleteAsset',
          {
            method: 'POST',
            headers: {
              'Content-Type': 'application/json'
            },
            body: JSON.stringify({
              public_id: this.imageSrc.public_id
            })
          }
        )
  }
  </code></pre>
  <p>And then my firebase cloud function is like so:</p>
  <p><code>/deleteAsset.js</code>:</p>
  <pre><code>import cloudinary from 'cloudinary'
  import * as functions from 'firebase-functions'
  
  const cors = require('cors')({ origin: true })
  
  cloudinary.config({
    cloud_name: functions.config().cloudinary.cloud_name,
    api_key: functions.config().cloudinary.api_key,
    api_secret: functions.config().cloudinary.api_secret,
    secure: true
  })
  
  
  export const deleteAsset = functions.https.onRequest((req, res) =&gt; {
    return cors(req, res, () =&gt; {
      try {
        functions.logger.log(req.body)
        cloudinary.v2.uploader.destroy(
          req.body.public_id,
          {
            invalidate: true
          },
          (error, result) =&gt; {
            if (error) {
              res.status(500).send(error)
            }
  
            res.status(200).send(result)
          }
        )
      } catch (error) {
        res.status(500).send('There was an error in deleteAsset function')
      }
    })
  })
  </code></pre>
  <p>Anyone spot any issues or have any advice on how I can further troubleshoot this?</p>