CORS ISSUE on droplet

Hello. Currently i’m using Rails from my app.

Try to send JS request from another server (website)

  const imageUrl = '';
  fetch(imageUrl, { mode: 'cors' })
    .then(response => response.blob())
      blob =>
        new Promise((resolve, reject) => {
          const reader = new FileReader();
          reader.onload = () => resolve(new Uint8Array(reader.result));
    .then(imageBytes => {
      parent.postMessage({ pluginMessage: imageBytes }, '*');

Receive this message:

Access to fetch at '' from origin 'null' has been blocked by CORS policy: 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.

Receive headers:
accept-ranges: bytes
age: 3365
cache-control: max-age=14400
cf-cache-status: HIT
cf-ray: 6100d4611bb23dfe-EWR
cf-request-id: 07946310ac00003dfed51fd000000001
content-length: 492144
content-type: image/jpeg
date: Mon, 11 Jan 2021 18:51:31 GMT
etag: "5ffc674a-78270"
expect-ct: max-age=604800, report-uri=""
last-modified: Mon, 11 Jan 2021 14:57:14 GMT
nel: {"report_to":"cf-nel","max_age":604800}
report-to: {"endpoints":[{"url":"https:\/\/\/report?s=0ovIr7fF%2FMSz7qwVPHRbyala8ofYVcCK4M8InglxTSrfbmf0uwYuvvb4ssJhnrv%2BAE4XccT6ftJ4stBI%2B%2B%2FFo7rkbTJQGie7QVxMLL1dCB%2Fqp%2FY%3D"}],"group":"cf-nel","max_age":604800}
server: cloudflare
set-cookie: __cfduid=dbb9cbf2bf084c5cfc2b909619736437b1610391091; expires=Wed, 10-Feb-21 18:51:31 GMT; path=/;; HttpOnly; SameSite=Lax
status: 206
vary: Accept-Encoding

How Could I add this header to my application. I tried using Rack :: CORS. How can I solve this problem. As i understand this is Cloudflare issue


Submit an answer

This textbox defaults to using Markdown to format your answer.

You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!

Sign In or Sign Up to Answer