React App not Working

i think something is wrong, my react app also is not running without making anything changes to the script, it was smooth running until yesterday :frowning:

Hi j-patch,

Is your issue related to the same .htaccess issue? If not please create your own topic.

Cheers!

3 Likes

error 1. Response was blocked by CORB (Cross-Origin Read Blocking)

  1. Cross-Origin Read Blocking (CORB) blocked a cross-origin response.

  2. AFFECTED RESOURCES

1. 1 request

  1. main.fbafe23c.js 

my .htaccess

RewriteEngine On
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]

# Exclude certain file types from being redirected to index.html
RewriteCond %{REQUEST_URI} \.(css|js|png|jpg|jpeg|gif)$
RewriteRule ^ - [L]

# If the requested pattern is file and file doesn't exist, send 404
RewriteCond %{REQUEST_URI} ^(\/[a-z_\-\s0-9\.]+)+\.[a-zA-Z]{2,4}$
RewriteRule ^ - [L,R=404]

# Otherwise, use history router
RewriteRule ^ /index.html [L]

<IfModule mod_headers.c>
    <FilesMatch "\.css$">
        Header set Cache-Control "no-cache, must-revalidate"
    </FilesMatch>
</IfModule>

sorry for reposting i just cant figureout which topic is active!

react

Manifest: Line: 1, column: 1, Syntax error.

seems that the main script canā€™t run but it was running smoothly till yesterday.

htaccess.

RewriteEngine On
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]

# Exclude certain file types from being redirected to index.html
RewriteCond %{REQUEST_URI} \.(css|js|png|jpg|jpeg|gif)$
RewriteRule ^ - [L]

# If the requested pattern is file and file doesn't exist, send 404
RewriteCond %{REQUEST_URI} ^(\/[a-z_\-\s0-9\.]+)+\.[a-zA-Z]{2,4}$
RewriteRule ^ - [L,R=404]

# Otherwise, use history router
RewriteRule ^ /index.html [L]

<IfModule mod_headers.c>
    <FilesMatch "\.css$">
        Header set Cache-Control "no-cache, must-revalidate"
    </FilesMatch>
</IfModule>

i think the main file is autofeleted every tiem i upload it. i did try some rebuilds etc

If you share code on the forum, please make sure to put it in a code block. The forum is very flexible with different ways it supports to format your post, so if you just dump code into the field, youā€™re basically guaranteed that it will get processed as formatting data incorrectly.

As for your question itself:

Please note that there is a 1 MB file size limit for HTML files and Javascript files. Single Page Application frameworks tend to produce very large code files, which may run into this limit.

Please check whether any of your generated code files are over the 1 MB limit (or close to it, due to unit conversions any file over 900 kB is in the danger zone). And if so, see if there is any way you can reduce the size of those files. Usually there are some knobs to turn in the build process that results in more smaller output files.

4 Likes

excuse me for using not the block code! until yesterday it was working. i didnt do any changes to it and today it does not. i rebuild the app and re uploadded the files. but still doesnt work, also in chrome it marks it as dangerous?!! iā€™m not sure about the file size it produces but the whole build file is like 8mb. i dont know what else to do or how i can inspect the app. but the error i m getting is a syntax error at the first html tag. really i dont know :frowning:

i figoured out something, the first GET tried to fetch the main htm produced i think is around 512-578 kb and it has a 304 error no modified, the second GET too the script has a 302 not found error

i did tried to host it somewhere else and its working normally, i think is a bug of the file manager which deleting the mainā€¦js everytime i upload it!! check it when you have time!

Read again

4 Likes

Hi j-patch,

The file manager failed to show you that file limit, which is frankly not very user-friendly.

React uses Webpack for bundling assets as you may know, so you should find this webpack.config.js file and this is where the ā€œknobā€ is.

In that file, add the following section:

 performance: {
    hints: false,
    maxEntrypointSize: 1000000,
    maxAssetSize: 1000000
}

where 1,000,000 bytes = 1MB.

Then recompile your bundles and upload. You might better benefit if you can further consider more optimized code structure by design.

Let us know if you need further assistance.

Cheers!


Source: node.js - Webpack 4 "size exceeds the recommended limit (244 KiB)" - Stack Overflow

4 Likes

The file manager doesnā€™t have a way to set file size limits. It does have an upload limit, but thatā€™s set higher than 10 MB to allow for larger zip uploads (no guarantees it works of course, but at least you can try).

And besides the need to show a file size limit, there are different file size limits for different file types.

3 Likes

Is the file manager custom coded?

No, itā€™s off-the-shelf software, called monsta FTP.

3 Likes

In that case, itā€™s for FTPā€™s work to show a custom error message during the command return.

Thatā€™s even more difficult than adding it to the file manager I think.

I donā€™t even know if this is possible with FTP at all. Iā€™m not that familiar with the protocol, but itā€™s possible that there is just no way to return an error message at the end of a transfer. Any error may have to be returned when starting the transfer, and the file size may not be known at that time.

And even if itā€™s theoretically possible, the FTP server also uses off the shelf software called PureFTPd. I canā€™t speak for iFastNet, but I really wouldnā€™t want to be mucking in the guts of software like that.

And even if we could build it in the FTP server, then the file manager may not relay that message as-is. I think it maps FTP response codes to itā€™s own messages.

3 Likes

That sounds beyond the scope of IF afaik IF is using infrastructure from IFN. The FTP protocol is basically a chat between server-client to transact details about the file and begin data transmission. Normally FTP would engage in exchanging the file details and size info before doing the transfer. But having a checking there would definately means the FTP server has to have some kind of adjustability, and thatā€™s on IFN.

If IF were to do this, itā€™s more likely a web-based solution, but since IF is free, Iā€™m guessing itā€™s a workload consideration on your end, i.e. a custom web based file manager. It doesnā€™t sound as easy as most would think.

In that case, maybe a notice before opening the File Manager through control panel would be a ā€œeasy patchā€ to the matter, however I doubt if anyone would really read those before slapping on the button (including myself lol) :joy:

Whatever :see_no_evil:

2 years ago when Iā€™m uploading a 80 MB zip file to the server with online FTP, it successfully throwed the raw 413 Entity too large error to me. Iā€™m pretty confident on this as 413 became a status code that got stuck in my head after that.

1 Like

Most likely because you went over the hardcoded limit in Monsta, not necessary something from the FTP server itself.

Technically true, but not true in the way I think you are trying to convey.

Itā€™s a very limited sort of chat. From my understanding of it, the protocol does not allow for custom responses, custom information, etc to be sent. Only status codes (and any parameters, like username and password) are sent from client to server and vise-versa.

https://www.w3.org/Protocols/rfc959/4_FileTransfer.html

I would highly criticize that implementation. All it would do it add extra friction to the process if it poped up every single time you opened the file manager.

And if you set it to only pop up the first time, then you are giving even more information to a new user that they a) donā€™t care about, they only want to get a website up, and b) wonā€™t remember for when it really matters.

3 Likes