Just non-descript error page In console the only thing that seems relevant is "react_devtools_back

K

kian•7/25/22, 6:02 PM

You’d need to do that yourself - like string replacement with a script.

Wrangler / TOML don’t have that feature - but it could be implemented by Wrangler. Make a feature request on the GH repo

SSobhan Hi All! I'm currently having an issue making fetch requests to my cloudflare wo...

T

TheSunSide•7/25/22, 8:02 PM

In worker, add a path to OPTIONS with the Access-Control-Allow-Origin in the headers

T

TheSunSide•7/25/22, 8:04 PM

So if you have a router:

 router.options((req)=>{
const headers = new Headers(); headers.set(headerString, value);  
return new Response(200, {headers})
})

 router.options((req)=>{
const headers = new Headers(); headers.set(headerString, value);  
return new Response(200, {headers})
})

 router.options((req)=>{
const headers = new Headers(); headers.set(headerString, value);  
return new Response(200, {headers})
})

 router.options((req)=>{
const headers = new Headers(); headers.set(headerString, value);  
return new Response(200, {headers})
})

T

TheSunSide•7/25/22, 8:05 PM

You might need to add Allowed methods too

T

TheSunSide•7/25/22, 8:06 PM

An example for something i use with manual "tests":

 router.options('*', () => {
  const headers = new Headers();
  headers.set('Access-Control-Allow-Origin', 'http://localhost:4200');
  headers.set('Access-Control-Allow-Methods', 'POST, OPTIONS');
  headers.set(
    'Access-Control-Allow-Headers',
    'Content-Type, mode, Access-Control-Allow-Origin, Access-Control-Allow-Credentials'
  );
  headers.set('Access-Control-Allow-Credentials', 'true');
  headers.set('Access-Control-Max-Age', '86400');
  return new Response('ok', { headers });
});

 router.options('*', () => {
  const headers = new Headers();
  headers.set('Access-Control-Allow-Origin', 'http://localhost:4200');
  headers.set('Access-Control-Allow-Methods', 'POST, OPTIONS');
  headers.set(
    'Access-Control-Allow-Headers',
    'Content-Type, mode, Access-Control-Allow-Origin, Access-Control-Allow-Credentials'
  );
  headers.set('Access-Control-Allow-Credentials', 'true');
  headers.set('Access-Control-Max-Age', '86400');
  return new Response('ok', { headers });
});

 router.options('*', () => {
  const headers = new Headers();
  headers.set('Access-Control-Allow-Origin', 'http://localhost:4200');
  headers.set('Access-Control-Allow-Methods', 'POST, OPTIONS');
  headers.set(
    'Access-Control-Allow-Headers',
    'Content-Type, mode, Access-Control-Allow-Origin, Access-Control-Allow-Credentials'
  );
  headers.set('Access-Control-Allow-Credentials', 'true');
  headers.set('Access-Control-Max-Age', '86400');
  return new Response('ok', { headers });
});

 router.options('*', () => {
  const headers = new Headers();
  headers.set('Access-Control-Allow-Origin', 'http://localhost:4200');
  headers.set('Access-Control-Allow-Methods', 'POST, OPTIONS');
  headers.set(
    'Access-Control-Allow-Headers',
    'Content-Type, mode, Access-Control-Allow-Origin, Access-Control-Allow-Credentials'
  );
  headers.set('Access-Control-Allow-Credentials', 'true');
  headers.set('Access-Control-Max-Age', '86400');
  return new Response('ok', { headers });
});

T

TheSunSide•7/25/22, 8:08 PM

You can do some if(event.req.method === 'OPTIONS") return ResponseWithHeaders

T

TheSunSide•7/25/22, 8:08 PM

The reason you're hitting cors is that the worker doesn't have the same address/domain/zone as the website

T

TheSunSide•7/25/22, 8:28 PM

async function handleRequest(event) {
  if(event.request.method === 'OPTIONS') {
// copy-paste the above, change the localhost
return new Response(ok, {status:200, headers})
}
if(event.request.method === 'GET') {
// do your actual Fetch thing here
return new Response(YOURVALUE);
}
  return new Response('We have not implemented this method/path/...', {status:404};
}

addEventListener("fetch", (event) => {
    event.passThroughOnException();
    return event.respondWith(handleRequest(event));
})

async function handleRequest(event) {
  if(event.request.method === 'OPTIONS') {
// copy-paste the above, change the localhost
return new Response(ok, {status:200, headers})
}
if(event.request.method === 'GET') {
// do your actual Fetch thing here
return new Response(YOURVALUE);
}
  return new Response('We have not implemented this method/path/...', {status:404};
}

addEventListener("fetch", (event) => {
    event.passThroughOnException();
    return event.respondWith(handleRequest(event));
})

async function handleRequest(event) {
  if(event.request.method === 'OPTIONS') {
// copy-paste the above, change the localhost
return new Response(ok, {status:200, headers})
}
if(event.request.method === 'GET') {
// do your actual Fetch thing here
return new Response(YOURVALUE);
}
  return new Response('We have not implemented this method/path/...', {status:404};
}

addEventListener("fetch", (event) => {
    event.passThroughOnException();
    return event.respondWith(handleRequest(event));
})

async function handleRequest(event) {
  if(event.request.method === 'OPTIONS') {
// copy-paste the above, change the localhost
return new Response(ok, {status:200, headers})
}
if(event.request.method === 'GET') {
// do your actual Fetch thing here
return new Response(YOURVALUE);
}
  return new Response('We have not implemented this method/path/...', {status:404};
}

addEventListener("fetch", (event) => {
    event.passThroughOnException();
    return event.respondWith(handleRequest(event));
})

T

TheSunSide•7/25/22, 8:28 PM

Might be missing something did it roughly

S

Strike•7/25/22, 9:53 PM

you can try postgrest https://developers.cloudflare.com/workers/tutorials/postgres/

Build data-driven applications with Workers and PostgreSQL · Cloudf...

Documentation for Cloudflare Workers, a serverless execution environment that allows you to create entirely new applications or augment existing ones without configuring or maintaining infrastructure.

S

Strike•7/25/22, 9:53 PM

besides that only http protocol is allowed afaik

S

Strike•7/25/22, 9:54 PM

you can always make a lambda

S

Strike•7/25/22, 11:15 PM

does type-graphql work on cloudflare workers?

MMicha I'm curious, why do you offer auto deployment for cloudflare pages but not for c...

E

Erwin•7/26/22, 7:03 AM

So.. here is a dirty little secret.. With Pages Functions you can run basically any worker on Pages without any static assets whatsoever

Other than that, it is basically a matter of things like priority and UX. Building it would be a lot of work, but it would also be another way to build/deploy/publish Workers..

F

Flare•7/26/22, 11:14 AM

The following features are currently on the roadmap for R2 but not yet implemented.

Public Buckets
Mapping a bucket to your custom domain
Pre-signed URLs are now implemented!

In the meantime, you can use a Worker to replicate the vast majority of functionality such as serving & caching public assets.
Take a look at the Demo Worker example here: https://developers.cloudflare.com/r2/examples/demo-worker/
Also, there's a great community project called Render that's made for R2:
https://github.com/kotx/render

Workers will not be required for making assets publicly available in the future, they are just an interim stop-gap.

Ggotfredsen I ahve a worker returning a trackingpixel .. having issues with it caching . wha...

P

Peps•7/26/22, 2:07 PM

response.headers.set("Cache-Control", "no-store");

response.headers.set("Cache-Control", "no-store");

response.headers.set("Cache-Control", "no-store");

response.headers.set("Cache-Control", "no-store"); should do the trick
Edit: replaced

no-cache

no-cache

no-cache

no-cache with

no-store

no-store

no-store

no-store, as apparently

no-cache

no-cache

no-cache

no-cache still allows for responses to be cached

U

Unsmart•7/26/22, 7:06 PM

Well trying to track apple mail is probably your first problem I'm sure they know a lot of tricks to try and stop that

K

kian•7/26/22, 7:54 PM

Yeah

K

kian•7/26/22, 8:05 PM

export default {
  async fetch(request) {
    const response = await fetch ("example.com");

    const newResponse = new Response(response.body, response);

    newResponse.headers.add('x-foo', 'bar');

    return newResponse;
  }
}

export default {
  async fetch(request) {
    const response = await fetch ("example.com");

    const newResponse = new Response(response.body, response);

    newResponse.headers.add('x-foo', 'bar');

    return newResponse;
  }
}

export default {
  async fetch(request) {
    const response = await fetch ("example.com");

    const newResponse = new Response(response.body, response);

    newResponse.headers.add('x-foo', 'bar');

    return newResponse;
  }
}

export default {
  async fetch(request) {
    const response = await fetch ("example.com");

    const newResponse = new Response(response.body, response);

    newResponse.headers.add('x-foo', 'bar');

    return newResponse;
  }
}

K

kian•7/26/22, 8:05 PM

new Response(response.body, response);

new Response(response.body, response);

new Response(response.body, response);

new Response(response.body, response); is required since the

headers

headers

headers

headers on the

response

response

response

response object returned by

fetch

fetch

are immutable

K

kian•7/26/22, 8:15 PM

If you're putting the Worker on the same route as Pages, I'd use #functions

K

kian•7/26/22, 8:15 PM

It's Workers but integrated into Pages

D

danboyle8637•7/26/22, 10:00 PM

I'm debugging my app which uses 4 total workers. I'm using DO for some of the persistence... but when my worker in (wrangler dev) mode does not receive a request in 2 minutes or so ... it always resets and then I get this error...

Error on remote worker: ParseError: A request to the Cloudflare API[MY_URL/edge-preview] failed.

Error on remote worker: ParseError: A request to the Cloudflare API[MY_URL/edge-preview] failed.

Error on remote worker: ParseError: A request to the Cloudflare API[MY_URL/edge-preview] failed.

Error on remote worker: ParseError: A request to the Cloudflare API[MY_URL/edge-preview] failed.

Anybody else every get this behavior? Normal?

Is the best way to fully test your DO to publish and work with a LIVE one?

W

Walshy•7/26/22, 10:04 PM

https://twitter.com/KentonVarda/status/1552052028595208197

Kenton Varda (@KentonVarda)

Today I replaced the nginx instance on the https://t.co/c1rBFLD0ca / https://t.co/VaOZBc1EkN origin server with the soon-to-be-open-source Cloudflare Workers runtime. Converting an old, crusty nginx config to JavaScript felt pretty good TBH.

Twitter

•

7/26/22, 10:03 PM

W

Walshy•7/26/22, 10:04 PM

K

kian•7/26/22, 10:04 PM

Kenton flexing

WWalshy https://twitter.com/KentonVarda/status/1552052028595208197

Z

zegevlier•7/26/22, 10:06 PM

We're just gonna forget that cloudflare uses nginx heavily lol

Just non-descript error page In console the only thing that seems relevant is "react_devtools_back

Similar Threads

Similar Threads

Similar Threads