No 'Access-Control-Allow-Origin' header with resumable upload

google-api, google-app-engine, google-cloud-storage, xmlhttprequest

Solution

Ran into this problem and discovered that it was due to a missing "origin" header in the initial POST request coming from App Engine.

My POST request contains content-length (set to 0), x-upload-content-type, and origin and all is well.

[1]https://cloud.google.com/storage/docs/json_api/v1/how-tos/resumable-upload

Problem

We are generating resumable upload url through the cloud storage JSON API from our App Engine application which are used on mobile as well as a web app. In the web app, using XmlHttpRequest to upload a file with the resumable upload url we get the following error : XMLHttpRequest cannot load https://www.googleapis.com/upload/storage/v1beta2/b/... No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://ourapp.appspot.com' is therefore not allowed access. In Chrome developer tools, the network log show a first OPTIONS request with the appropriate "Origin" request header and "Access-Control-Allow-Origin" response header but the following PUT request fails as mentioned. The cors xml on our bucket looks like this: ``` <?xml version="1.0" encoding="UTF-8"?> <CorsConfig> <Cors> <Origins> <Origin>*</Origin> </Origins> <Methods> <Method>PUT</Method> <Method>GET</Method> <Method>POST</Method> <Method>HEAD</Method> <Method>DELETE</Method> <Method>OPTIONS</Method> </Methods> <ResponseHeaders> <ResponseHeader>*</ResponseHeader> </ResponseHeaders> <MaxAgeSec>1800</MaxAgeSec> </Cors> </CorsConfig> ``` Any suggestions are welcome. Thanks.

Original source