Home » Html » Failed to load resource: the server responded with a status of 404 (Not Found)

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

Posted by: admin November 30, 2017 Leave a comment

Questions:

I can’t solve my link problem. Could you help on to this to link CSS and JS File?

CSS:

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

JS:

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

Error:

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) http://localhost:8080/RetailSmart/jsp/Jquery/prettify.js

https://www.dropbox.com/s/31pwda3u4is4qz0/link.png Refer this link Directory structure.

Answers:

Your files are not under the jsp folder that’s why it is not found.
You have to go back again 1 folder
Try this:

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

Questions:
Answers:

Note the failing URL:

Failed ... http://localhost:8080/RetailSmart/jsp/Jquery/jquery.multiselect.css

Now examine one of your links:

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

The “../” is shorthand for “The containing directory”, or “Up one directory”. This is a relative URL. At a guess, you have a file in /jsp/<somefolder>/ which contains the <link /> and <style /> elements.

I recommend using an absolute URL:

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

The reason for using an absolute url is that I’m guessing the links are contained in some common file. If you attempt to correct your relative pathing by adding a second “../”, you may break any files contained in /jsp.

Questions:
Answers:

If you have resource with woff extension and getting error then add following code in your web.config application will help to fix.

<system.webServer>
<staticContent>
   <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
</staticContent>
</system.webServer>

For Resources like JavaScript or CSS not found then provide the path of adding link or script in following way

<link ref="@(Url.Content("path of css"))" rel="stylesheet">

<script src="@(Url.Content("path of js"))" type="text/javascript"></script>

Questions:
Answers:

Please note , you might need to disable adblocks if necessary.
Drag and drop off script path in visual studio doesn’t work if you are using HTML pages but it does work for mvc ,asp.netwebforms.
I figured this after one hour

Questions:
Answers:

Add this to your Configuration file. Then put all your resources(eg. img,css,js etc) into the src > main > webapp > resources directory.

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

After this, you can access your resources like this.

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

Leave a Reply

Your email address will not be published. Required fields are marked *