OiO.lk Community platform!

Oio.lk is an excellent forum for developers, providing a wide range of resources, discussions, and support for those in the developer community. Join oio.lk today to connect with like-minded professionals, share insights, and stay updated on the latest trends and technologies in the development field.
  You need to log in or register to access the solved answers to this problem.
  • You have reached the maximum number of guest views allowed
  • Please register below to remove this limitation

In my React static web app, why is my call to Supabase producing "TypeError: Load failed" randomly?

  • Thread starter Thread starter isaac
  • Start date Start date
I

isaac

Guest
In my React app, I am currently facing an issue where randomly, every once in a while, a call returns an error to the website instead of the data from the call to Supabase. I am having a difficult time debugging it. Supabase shows that it is not failing on its side. Every time it happens I am logging the error, but I still can't really figure out a reason for the bug. My app is also deployed as a static web app with Azure if that helps at all. It seems to happen randomly for all my API calls. It is not quite evenly distributed amongst them. Any and all help would be much appreciated. It's very weird that the API calls work most of the time, but produce an error every once in a while. If the proportion of errors was lower I would maybe ignore but it seems like I get about 80 or so errors a day for about 1200 people using the site in the same day. Also, I am on the free Supabase plan if that might factor in. I'll put my compute usage at the bottom.

Here is a code snippet for one of the calls (they are all quite similar but some call Supabase functions instead):

Code:
  const { data, error } = await supabase
    .from('all_questions')
    .select('*')
    .eq('day', formattedDate);

  if (error) {
    console.error('Error fetching data:', error.message);
    report_error(userID, "read current question", error.message, (Date.now() - sessionStart) / 1000, String(formattedDate), JSON.stringify(data));
    throw error;
  }

  setTodaysData(data);
  console.log("Data fetched successfully!");

(report_error() is a function that inserts an error log into supabase so I can track them)

Here is the information I log when an error occurs:

my error logging


Error distribution:

error distribution


Here is Supabase error tracking showing no errors:

supabase error log


Supabase compute usage:

Memory: 45%
Swap: 20%
Average CPU: .6%
Max CPU: 1.76%
Disk IO: 1%

I have tried researching what the error message means but I can't find too much on it specifically. Can't think of what might cause it. I expect the API call to Supabase to return data, but it is producing an error randomly.

<p>In my React app, I am currently facing an issue where randomly, every once in a while, a call returns an error to the website instead of the data from the call to Supabase. I am having a difficult time debugging it. Supabase shows that it is not failing on its side. Every time it happens I am logging the error, but I still can't really figure out a reason for the bug. My app is also deployed as a static web app with Azure if that helps at all. It seems to happen randomly for all my API calls. It is not quite evenly distributed amongst them. Any and all help would be much appreciated. It's very weird that the API calls <em>work most of the time</em>, but produce an error every once in a while. If the proportion of errors was lower I would maybe ignore but it seems like I get about 80 or so errors a day for about 1200 people using the site in the same day. Also, I am on the free Supabase plan if that might factor in. I'll put my compute usage at the bottom.</p>
<p>Here is a code snippet for one of the calls (they are all quite similar but some call Supabase functions instead):</p>
<pre><code> const { data, error } = await supabase
.from('all_questions')
.select('*')
.eq('day', formattedDate);

if (error) {
console.error('Error fetching data:', error.message);
report_error(userID, "read current question", error.message, (Date.now() - sessionStart) / 1000, String(formattedDate), JSON.stringify(data));
throw error;
}

setTodaysData(data);
console.log("Data fetched successfully!");
</code></pre>
<p>(<code>report_error()</code> is a function that inserts an error log into supabase so I can track them)</p>
<p>Here is the information I log when an error occurs:</p>
<p><img src="https://i.sstatic.net/TUUDFtJj.png" alt="my error logging" /></p>
<p>Error distribution:</p>
<p><img src="https://i.sstatic.net/c9MsOWgY.png" alt="error distribution" /></p>
<p>Here is Supabase error tracking showing no errors:</p>
<p><img src="https://i.sstatic.net/xFwvO5Yi.png" alt="supabase error log" /></p>
<p>Supabase compute usage:</p>
<p>Memory: 45%<br />
Swap: 20%<br />
Average CPU: .6%<br />
Max CPU: 1.76%<br />
Disk IO: 1%</p>
<p>I have tried researching what the error message means but I can't find too much on it specifically. Can't think of what might cause it. I expect the API call to Supabase to return data, but it is producing an error randomly.</p>
 

Latest posts

Online statistics

Members online
0
Guests online
5
Total visitors
5
Top