Failed to load resource: the server responded with a status of 404 (not Found nextjs)

On: July 4, 2022 Views: 77 Author: kttutoria

  • What is the error “Failed to load resource: the server responded with a status of 404 (not found)”?
    • What causes error?
  • How to fix it? 
    • Solution 1: Reload the website 
    • Solution 2: Using absolute URL
    • Solution 3: Edit config file
  • Conclusion

For technology users, the error “Failed to load resource: the server responded with a status of 404 (not found)” is quite common, it often occurs when they want to access a certain website. If you don’t know how to fix the above error, this article will be what you are looking for. Let’s see how to handle it below!

What is the error “Failed to load resource: the server responded with a status of 404 (not found)”?

This is a common error on the website when the user wants to access a URL. When a request is sent to the website server but it cannot be fulfilled or cannot be found, the server will display the message “Failed to load resource: the server responded with a status of 404 (not found)“. In other words, the URL doesn’t exist so the server can return the result to the browser’s request.

For you to understand better, we will give an example below.

You have several URLs to download the JavaScript or CSS code as below:

CSS Links:

<link  href="../Jquery/jquery.multiselect.css" rel="stylesheet"/> <link  href="../Jquery/style.css" rel="stylesheet" />

JS Links:

<script  src="../Jquery/jquery.multiselect.js"></script> <script  src="../Jquery/prettify.js"></script>

However, when you access the above address, the above error occurred and it is displayed as follows:

Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8080/RetailSmart/jsp/Jquery/jquery.multiselect.css Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8080/RetailSmart/jsp/Jquery/style.css Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8080/RetailSmart/jsp/Jquery/prettify.css Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8080/RetailSmart/jsp/Jquery/jquery.multiselect.js Failed to load resource: the server responded with a status of 404 (Not Found)

Depending on different websites or links, the display of the error will also be different, it may appear in some of the following forms:

  • 404
  • 404 Resource not found
  • Error 404
  • Http Not Found
  • Error 404 Not Found
  • 404 Page Not Found
  • 404 File or Directory Not Found
  • 404 not found nginx
  • http error 404. The requested resource is not found
  • failed to load resource: the server responded with a status of 404 (not found)

What causes error?

Most of the reason for this error is that the user has entered the wrong URL, leading to the inability to access the website. In addition, there are a few other common causes, such as:

  • The URL has been changed by the administrator of that website to a new URL but has not been redirected.
  • Website may have been closed/removed from the internet
  • The process of writing website code is wrong, leading to this error website.
  • Turn on Mod_rewrite in .htaccess form but there is an error, then the website will automatically navigate to a new link with this 404 error. 

How to fix it? 

If you encounter the error “Failed to load resource: the server responded with a status of 404 (not found)“, stay calm and find a solution because the way to fix it is very simple. Depending on the situation you are facing, here are some solutions for you to choose from:

Solution 1: Reload the website 

 There is a possibility that when you visit the website address at the right time when the website server is having problems, the URL is temporarily not displayed. A quick fix is to try reloading the page by pressing the F5 button on your keyboard, or clicking the back button in the browser’s menu bar.

Solution 2: Using absolute URL

In some situations, because the URL of the web is quite long, it is difficult to remember, so the user has chosen to use a relative path. This can lead to incorrect address input or the path pointing to an incorrect address. The way to fix the error is to use the absolute path to ensure accuracy.

For example:

If you are using this link:

<link href="../Jquery/jquery.multiselect.css" rel="stylesheet"/>

As you know,  “../” is shorthand for “The containing directory”, or “Up one directory”, So if you use a relative path, the redirect can be confused.

Instead, use it like this:

<link href="/RetailSmart/Jquery/jquery.multiselect.css" rel="stylesheet"/>

Solution 3: Edit config file

If the above methods don’t work, you can try following this guide. Open your config file and go to this path: src > main > webapp > resources, then add your resources in it, like this: 

public class Config extends WebMvcConfigurerAdapter{    @Override    public void addResourceHandlers(ResourceHandlerRegistry registry) {       registry.addResourceHandler("/resources/**").addResourceLocations("/resources/");    } }

Next, use a path similar to the following to access the page:

<link href="${pageContext.request.contextPath}/resources/assets/css/demo.css" rel="stylesheet" />

Conclusion

To summarize, above we have helped you better understand the error “Failed to load resource: the server responded with a status of 404 (not found)” and some solutions to handle it. If you have any questions, please leave a comment for us to be able to assist you as soon as possible. Thanks for reading!