Send Cookie with setUpload function POST request

[arsvprem]

How do I include my auth-cookie when I trigger setUpload function? My backend needs a session token to authenticate. Currently, it doesn't seem to include my cookie be default

[dkmorgan]

I had the same issue, but managed after digging through some posts on how to use tus-js-client. Pass in your own onBeforeRequest() into TusHooksUploadOptions:

onBeforeRequest: req => {
  const xhr = req.getUnderlyingObject()
  xhr.withCredentials = true
  xhr.setRequestHeader("Header Name", token)
}

[kqito]

Thank you for your issue!

As @dkmorgan mentioned, we can use cookies by enabling xhr.withCredentials in the onBeforeRequest method, which is described in the tus-js-client documentation.

This can be used to modify the outgoing request. For example, you can enable the withCredentials setting for XMLHttpRequests in browsers:

https://github.com/tus/tus-js-client/blob/main/docs/api.md#onbeforerequest

Could you take a look at it once, please?

[arsvprem]

Great, Thanks for your help folks. With above solution, I think I got one half of the issue fixed. I can successfully authenticate to my backend and get uploadURL (Location) header for a video stream provider. Here is the issue - I guess the 2nd request going to upload url also has withCredentials=true set and because of which CORS fails, since provider has set their access-control-allow-origin: * which is causing a conflict. Anyway I can make withCredentials=false on the second request?

upload:1 Access to XMLHttpRequest at 'https://uploadurl' from origin 'http://localhost:5173' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

[arsvprem]

Sorry, I accidentally closed the issue

[dkmorgan]

Is it your preflight request (OPTIONS method) that is being blocked? If it is, you can add a condition by checking the method that is used for the request. Something like this:

if (req.getMethod() === 'POST') {
  xhr.withCredentials = true
}

[arsvprem]

Working perfectly now. Thanks folks. I thought I'd never be able to fix this. You folks are awesome!

[arsvprem]

FYI, I had to use req instead of xhr for the conditional - if (req.getMethod() === 'POST')

[dkmorgan]

FYI, I had to use req instead of xhr for the conditional - if (req.getMethod() === 'POST')

Oops, apologies for that. Corrected the example in my comment!