cors preflight headers

[august black]

Hi,

I notice that cors is partially enabled on the freesound api.

when I do:

curl -s -I  https://freesound.org/data/previews/392/392617_7383104-hq.mp3         

I get:  access-control-allow-origin: *

However, the preflight request with OPTIONS returns a 405 Method Not Allowed

curl -s -I -X OPTIONS https://freesound.org/data/previews/392/392617_7383104-hq.mp3

Would it be possible to enable the OPTIONS preflight request?

I believe it is required for any cross origin request for freesound data.

If I am not mistaken, I believe it currently works in some settings where the <audio crossOrigin="anonymous" /> tag fetches the data.  However, within a PWA or other browser contexts, the preflight OPTIONS will be necessary.

[august black]

Sorry, the pre-flight request should be:

curl -s -I -X OPTION https://freesound.org/data/previews/392/392617_7383104-hq.mp3

(that's OPTION without the 's')

which does NOT return a 405, but also does NOT return with   Access-Control-Allow-Origin: *

[Frederic Font Corbera]

Hi August,

Sorry for the late reply, your email went to my spam folder for some reason…

As far as we know, accessing a preview url should be a Simple Request (

https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS#simple_requests

) and therefore a preflight should not be necessary. Can you show an example of a use where preflight is necessary for a GET on these URLs?

Thanks,

frederic

--

---
You received this message because you are subscribed to the Google Groups "Freesound API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to freesound-ap...@googlegroups.com.
To view this discussion on the web, visit https://groups.google.com/d/msgid/freesound-api/489d48b7-c5c4-4b1f-92da-f4ccf806f294n%40googlegroups.com.

--

--

Frederic Font - ffont.github.io

Music Technology Group, UPF - mtg.upf.edu

Freesound - freesound.org

[august black]

Hi Frederic,

Thanks for the response!

The CORS requirements are so complex it feels like black magic to me sometimes :)

I'm still investigating, but I think it has to do with the combination of using the fetch API and "range" headers.

I'm using fetch because the code sits within a PWA setting (using workbox)

The "range" headers are necessary for when you want to seek on the file.

Below is an example in React.  A simple fetch'd download will work, but one with "range" headers will require the preflight.

import React, { FC } from 'react'      
             
const MediaPlayer: FC = () => {                                                                                                                                        
  const download = (e) => {  
    e.preventDefault()                                                                                                  
    window.fetch('https://freesound.org/data/previews/392/392617_7383104-hq.mp3', { mode: 'cors', credentials: 'omit' })      
      .then(console.log)                                                                                                                                              
      .catch(console.error)                                                                                                                                            
  }                                                                                                                                                                    
  const downloadWithRange = (e) => {  
    e.preventDefault()                                                                  
    window.fetch('https://freesound.org/data/previews/392/392617_7383104-hq.mp3', {                                      
      mode: 'cors',                                                
      credentials: 'omit',    
      headers: {                  
        Range: 'bytes=0-1023'                                  
      }                  
    })                  
      .then(console.log)                                                                                    
      .catch(console.error)                                                                                
  }                      
                         
  return (              
    <div className="">                                                                                                                                                
        <button                                                                                                                                                        
          onClick={download}                                                                                                                                          
        >download</button>                                                                                                                                            
        <button                                                                                                                                                        
          onClick={downloadWithRange}  
        >download with Range</button>                                                                                                                                  
                                                                                                                                                                       
    </div>                                                                                                                                                            
  )                                                                                                                                                                    
}    

Thanks so much for your attention and for the great Freesound archive  -August.

You received this message because you are subscribed to a topic in the Google Groups "Freesound API" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/freesound-api/EH1l0-MBYWg/unsubscribe.
To unsubscribe from this group and all its topics, send an email to freesound-ap...@googlegroups.com.
To view this discussion on the web, visit https://groups.google.com/d/msgid/freesound-api/CABDPa_wZj2w617zTkAsv%3DMQit58KG%2B5tUi-SDzTDQ-BPcehQ9w%40mail.gmail.com.

[Frederic Font Corbera]

Hi August,

Thanks for the detailed feedback. You're right, we'll work on it and add the headers. I'll let you know,

Cheers,

frederic

--

Frederic Font - ffont.github.io

Music Technology Group, UPF - mtg.upf.edu

Freesound - freesound.org

To view this discussion on the web, visit https://groups.google.com/d/msgid/freesound-api/CAHjm5xwWrA%3DSm_PET84ai_SyAzbpdf1mAuZdvn3cN%2BvxNHZ3dw%40mail.gmail.com.

[Frederic Font Corbera]

Hi,

We’ve enabled OPTIONS prelfight request for previews now. Is this working for you now?

Thanks,

frederic

[august black]

Hi Frederic,

Yes, it seems to be working now.

Thanks so much!  -August.

To view this discussion on the web, visit https://groups.google.com/d/msgid/freesound-api/CABDPa_yOHsD4qyRszmU_2UgfugsO3eVY12hWEcrwwKB1JzG45g%40mail.gmail.com.