Video upload error with react app on windows10 - reactjs

I've a weird problem with react.
We use this react video component ([https://www.npmjs.com/package/react-video-recorder) to record or upload a vide file. And It's working fine on mac (both chrome and firefox).
On windows, it's also working fine for the recording part. However for the upload part, when the upload file is more than 20mb, It's not working neither for chrome nor for firefox (on windows).
The weird thing is that we doesn't have any log error on our web server. The only error is a "cors error" showing up in the browser developer console. So it seams that the upload fails even before reaching our api. (That say I'm sure that its not a cors issue because it's working fine when the video size is less than 20Mb, and both front and back share the same domain anyway)
I'm also sure that is not a timeout issue because our axios timeout is set to 1 hour and fails after only a few second (and it is working fine on mac anyways so It couldn't be a time out issue).
Could someone help please?

Related

Rails app with react frontend works fine in Safari but not on chrome

I am working on a project which is using rails for its backend and react components for its frontend. The app works fine in the Safari browser but for some unknown reason, in the chrome app, it loads the correct path but just renders a white screen showing nothing. If I check the developer tools console, I get to see the following errors
Similarly I refreshed the page and opened the network tab in developers tool and got to realise that some of the packages have not been downloaded.
The point to note is that the app also requires a certificate for running it locally and I have already downloaded that certificate and trusted it so it should also not be a problem. I am stuck at it for a really long time. Can anyone tell me the solution?
As the app works fine in safari, I don't think its related to code but its just a guess. So far I have tried disabling all the extension as well as clearing the browser data but haven't been able to see any progress...

Google analytics script fails to load within page with 500 error code

Google analytics script fails to load with 500 error code on the website however if the link is opened in a new tab it's working fine.
Checked on MacOS BigSur Chrome, Firefox, Safari in normal and Incognito/Private mode without any active browser extension and got the same error.
Even the solution provided by NextJS https://github.com/vercel/next.js/tree/canary/examples/with-google-analytics does not work
Whatever I tried, I can't get rid of this error: GET https://www.googletagmanager.com/gtag/js?id=G-O5IW7EZ46Q net::ERR_ABORTED 500
Also tried to create simple static site to check is it NextJS issue or not and seems like it's not. https://codesandbox.io/s/nifty-currying-1hzu1?file=/index.html - this is the link to sandbox with google analytic script initialization and it fails as well with same error code.
Try to move the Google Analytics snippet in head section of the page.
I found the problem. The issue was in the Adguard software installed on the machine. Since the app was on OS level tt was automatically blocking across all browsers and private or incognito mode.

Firebase Deployment: My web appear in "project.firebaseapp.com" but not "project.web.app"

I've completely deployed my website with Firebase CLI, and project.firebaseapp.com is accessible and works fine. However, project.web.app keeps showing "Site Not Found".
I'm building my web app with React and already set the folder to "build"
Edit1: I've tried safari, chrome, incognito of both, and also hard refresh and empty cache still showing SITE NOT FOUND.
Edit2: It's working on Line Application Built-in Browser (mobile), but not on Chrome (mobile).
Edit3: Sent the domain to my friends around the world and found out that it's not working for only people living in South East Asia.
As I mentioned in comments, try any other browser. Both the domains are working on my computer. It might just take some time for both to deploy and update the cache.
It's usually better to ask someone who stays far from you and maybe has a different ISP to test update website. I sometimes use Lighthouse and it turns up even it won't show up on my computer. (Apparently the older version gets cached).
I'd recommend disabling cache from network tab in browser console when in development stage:

IE randomly stops loading the necessary resources for a frontend

I have a really strange problem with an AngularJS application using Internet Explorer (ver 11.0.9600.18697) as browser.
I am developing an application using AngularJS. The application runs perfectly on Firefox and Chrome, but on IE I'm experiencing the following problem.
What happens is that, when I start the application, the startup stops because IE at a certain point randomly stops loading the necessary resources, simply terminating some calls of js, i18n, css files.. (calls do not arrive at the server, simply IE blocks them, despite being the path all correct).
I have not understood the reasons of this behavior. What I know is that I use RequireJs for loading files (ver. 2.1.22), and that on Firefox and Chrome everything is loaded properly. Moreover, if I start the application on IE keeping Fiddler open, then the application works very well on IE too.
Has anyone ever had a similar problem?
Here the network console:

Protractor tests on BrowserStack iPhone devices are not working

For some reason the iPhone devices are never able to load the url requested by Protractor, they always show a blank page. It tries to load the url several times and then gives up.
The other BrowerStack devices all seem to work, including Windows, Android, and Safari/Macbook.
Has anyone encountered a similar problem?
For reference, we're using Protractor v2.2.0 (have not been able to updated because we're stuck in an old version of NodeJS, but we could try if that is the cause of the issue).

Resources