[Solved] Loggin to external service fails in production, not preview

Hi There

I created a small log implementation to log all my log entries to Loggly. The logging seems to work just perfect when I hit my web worker via the preview GUI. When I do that, I can see all the entries in Loggly.

But when I deploy the code, and try to hit the live webworker, even waiting 10 minutes to make the web worker is deployed everywhere, I don’t receive any log entries in Loggly.

To give an idea of how I log:

const url = 'http://logs-01.loggly.com/inputs/<my-token>/tag/'
fetch(new Request(url, { method: 'POST', body: JSON.stringify(payload), headers: new Headers({ 'content-type': 'text/plain' }) }))

I have tried with http and https for the loggly url. Same issue with both.

What should I look into? Any tips are welcome.

1 Like

The first thing I would try is to check the response of the fetch. If the service is not live, you could simply return that to the user add it to the response header as described here.

Have tried to set that to json?

I have tried different content-type headers, but the given header is how the loggly docs instruct. I did try to just catch the response of my log action and return that response. In preview I get a 200, but in production I get a 400 Bad Request response. So this makes me wonder if the Cloud Flare web workers modifies the request in the live environment versus the preview environment.

This is the code I use to test, in preview it works, in production I get a 400

addEventListener('fetch', event => {
    event.respondWith(interceptRequest(event.request));
});

async function interceptRequest(request){


  try{
    const req = createRequest({tags : [], payload : 'IAN WAS HERE'});
    const response = await fetch(req);
    return response;
  }catch(e){
    return new Response(e.message);
  }

}

function createRequest({ tags, payload }) {
   const DEFAULT_ENDPOINT = 'http://logs-01.loggly.com/inputs/<my-token>/tag/http';
    const url = `${DEFAULT_ENDPOINT}${tags.join(',')}`;
    return new Request(url, {
        method: 'POST',
        body: JSON.stringify(payload),
        headers: new Headers({
            'content-type': 'text/plain'
        })
    });
}

Seems that Loggly does not place nice with Cloudflare headers… even after 4 years

The Cf-Visitor: {"scheme":"http"} header that Cloudflare sends when deployed makes the 400 happen.

Can you publish your recipe on a Git, like github.com, gitlab.com… so others can find it and fork it?

1 Like

I don’t have a working solution, so not sure what to share as recipe :slightly_smiling_face:

I solved it by creating a small proxy that I will use to log to. This proxy just strips some of Cloudflare’s headers before hitting the Loggly API.

2 Likes