I installed SpringSource Tool Suite 2.8.0.
I'm trying to include a JS file in a JSP, using the Spring MVC template as a starting point.
My JSP looks like this:
<%# taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%# page session="false" %>
<html>
<head>
<title>Home</title>
<script type="text/javascript" src="/a.js"></script>
</head>
<body>
Hello world!
</body>
</html>
a.js is under src\main\resources and looks like this:
window.alert("A");
The result is that "Hello world!" gets printed without the alert :-(
I tried putting the JS file in different places, changing the src to be with/without "/", and even adding a servlet-mapping in web.xml to use "default" servlet for "*.js".
Nothing seems to work.
What am I doing wrong?
is the js file getting included in your .war file? I usually put my js and css in src/main/webapp. something like src/main/webapp/js and src/main/webapp/css.
Secondly, you can reference it appropriately using c:url which will take care of putting the app context on there and stuff.
<script type="text/javascript" src="<c:url value="/a.js" />" />
You can use firebug or chrome's developer tools to see if you are getting a 404 for a.js and see what path it is actually requesting.
I advise placing those js files under webapp folder. (I usually put them under webapp/resources/js)
And to make this path accessible, I use the mvc:resources tag:
This tag allows static resource requests following a particular URL
pattern to be served by a ResourceHttpRequestHandler from any of a
list of Resource locations. This provides a convenient way to serve
static resources from locations other than the web application root,
including locations on the classpath. The cache-period property may be
used to set far future expiration headers (1 year is the
recommendation of optimization tools such as Page Speed and YSlow) so
that they will be more efficiently utilized by the client. The handler
also properly evaluates the Last-Modified header (if present) so that
a 304 status code will be returned as appropriate, avoiding
unnecessary overhead for resources that are already cached by the
client. For example, to serve resource requests with a URL pattern of
/resources/** from a public-resources directory within the web
application root, the tag would be used as follows:
<mvc:resources mapping="/resources/**" location="/public-resources/"/>
Source: Spring Reference
Related
I would like to make an input mask with javascript in Oracle Apex a bit prettier. How can I do that?
Is there any way I can upload and embed a .js file?
If so, how do you do it?
Can I style whole pages with js and then upload it?
I’m confused.
Thank you
Step 1 open Shared Components and upload your .js script into static application files
Step 2 Upload the js script into Static Application Files and copy the reference, this reference works exactly the same as an URL
Step 3 In shared components open User Interface Attributes
Step 4 Paste it into Javascript / File URLS
Your script .js will be available in all your app, also you can add .css files in Cascading Style Sheets option
You can upload files to use as application or workspace resources, but for most static files (images, js libraries, etc.) you will get much faster response if you serve them from a separate web server and just put the links in your APEX code. For example, if you are using Apache HTTP or nginx as a reverse proxy for APEX you can serve them from there.
Select a page.
Click Edit Attributes.
Scroll down to HTML Header.
Enter code into HTML Header and click Apply Changes.
For example, adding the following would test a function accessible from anywhere on the current page.
<script type="text/javascript">
function test(){
window.alert('This is a test.');
}
</script>
In Oracle Application Express you can reference a .js file in the page template. This approach makes all the JavaScript in that file accessible to the application. This is the most efficient approach since a .js file loads on the first page view of your application and is then cached by the browser.
The following demonstrates how to include a .js file in the header section of a page template. Note the line script src= that appears in bold.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>#TITLE#</title>
#HEAD#
<script src="http://myserver.myport/my_images/custom.js" type="text/javascript"></script>
</head>
<body #ONLOAD#>#FORM_OPEN#
I am a complete newbie to this and I'm using Eclipse Oxygen platform to run my application and Apache Tomcat 8.0.36 server.
Firstly, I created a simple HTML page first.html in WEB-INF folder inside my project.
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<h1>First Page</h1>
<a href="MiniPro/WebContent/WEB-INF/NewFile.html" >Press Here</a>
</body>
</html>
When I run this code, it directs to this link http://localhost:8081/MiniPro/WEB-INF/first.html
and shows an HTTP status 404 error.
Even when I tried this
http://localhost:8081/MiniPro/WebContent/WEB-INF/first.html
it shows the same error.
When I changed the location of first.html page into WebContent folder and run it is showing the result.
Can someone tell why it was not working when it is placed inside WEB-INF folder.
A special directory exists within the application hierarchy named
WEB-INF. This directory contains all things related to the application
that aren’t in the document root of the application. The WEB-INF node
is not part of the public document tree of the application. No file
contained in the WEB-INF directory may be served directly to a client
by the container. However, the contents of the WEB-INF directory are
visible to servlet code using the getResource and getResourceAsStream
method calls on the ServletContext, and may be exposed using the
RequestDispatcher calls.
If you want to keep your file in WEB-INF - you need a Servlet to manage it.
Just a general example of how to get HTML file with servlet:
RequestDispatcher view = request.getRequestDispatcher("mypage.html");
view.forward(request, response);
Otherwise, move your file outside WEB-INF and try to get it with http://localhost:8081/MiniPro/first.html
You May try the ~/<path here >/<file>
~ this will help you point the Home path from you localhost
You are using the path like
MiniPro/WebContent/WEB-INF/NewFile.html
above that path has been located like
http://localhost:8081/MiniPro/WebContent/WEB-INF/first.html
so you can use instead of http://localhost:8081 use the ~
~/MiniPro/WebContent/WEB-INF/NewFile.html
the WEB-INF directory is special in a web project. It is designed that not allow direct visit for outside, but you can visit it with your servlet or jsp code.
I have an html page which references a number of local script files, and in turn those script files reference other local resources. By local I mean local to the html file.
Is it possible to serve such a web page using a node.js server approach? So far as I've been able to work out so far, the node.js server can return html content, but when that is displayed in the user's browser, I can't easily see how it would be able to reference the various scripts, because the html isn't being served from a normal folder on the server, with relative access to the folders and resources around it.
Is there any way of doing this, or is it mad to even contemplate such an approach? Better just to stick the html and related resources on a standard server and be done with it?
EDIT: I should explain that the motivation for serving the html from node.js is that I'm already serving images from the node.js server, where those images are generated using the same scripts that the html will be using. So there are two ways for the user to get the same content: as a png file or as a web page, and in both methods the work is done by the same core scripts... one has an html front end and the other has a node.js front end. So it would be nice to be able to keep all the code in a single location, rather than having to duplicate stuff and have it in two places, and have to remember to update the code in the secondary location when I update it in the primary location.
EDIT to add folder structure to help debug this (see comments below):
mypage.html
myLibFile.js
/lib/*.js (various js resources including jquery)
/lib/modules/*.js (various js resources)
/lib/fonts/* (various resources)
/themes/*.js (various js resources)
In mypage.html I have:
<script type="text/javascript" src="/lib/jquery.1.9.1.min.js"></script>
<script type="text/javascript" src="/lib/libFile.js"></script>
<script type="text/javascript" src="/lib/modules/modFile.js"></script>
<link href="/lib/fonts/awesomefont.css" rel="stylesheet">
<script type="text/javascript" src="/myLibFile.js"></script>
<script type="text/javascript">
$(function () { // On DOM ready...
// ... code ...
});
</script>
and in my node.js I have attempted to set up express as follows:
self.app.use(express.static(__dirname));
self.app.use('/lib', express.static(__dirname + '/lib'));
self.app.use('/themes', express.static(__dirname + '/themes'));
Of course your relative paths will work when using your own custom built nodejs server, which can serve files, .html .css .js and such.
I assume you have some sort of public folder from where you serve your assets. If you don't use any special routing magic, and just reffer to structure of your public folder, then relative paths in your HTML, will work.
<link rel="stylesheet" href="styles/main.css">
Code above could load something like: public/styles/main.css
I am having a problem in the location of my javascript, the location is right, but when I run it in my visual web developer 2010 express, the location can not be found, I don't know the reason why...
here is the location of my javascript:
<script src="Style/javascript/jquery-1.7.1.js" type="text/javascript"></script>
here is the error:
**Server Error in '/Maitenance' Application.**
**The resource cannot be found.**
**Description: HTTP 404. The resource you are looking for (or one of its dependencies) could have been removed, had its name changed, or is temporarily unavailable. Please review the following URL and make sure that it is spelled correctly.**
**Requested URL: /Maitenance/Maintenance/Style/javascript/jquery-1.7.1.js**
Use this... It will work
<script src="<%=Page.ResolveUrl("~")%>Style/javascript/jquery-1.7.1.js" type="text/javascript"</script>
I guess you are using a master page and your .aspx page is put in another directory. The file path you included in master page is relative to the .aspx file. It works OK when your page in the same directory with the master page.
You can include your js file using ResolveUrl:
<script src="<%=ResolveUrl("~/js/jquery.js")%>" type="text/javascript"></script>
or you can include your script in the code behind of master page:
ClientScript.RegisterClientScriptInclude("jquery", ResolveClientUrl("~/js/jquery.js"));
I'm using webform asp.net and C#. I linked the master page with javascript file like this
<script type="text/javascript" src="javascript/main.js"></script>
but when I'm going to inner pages inside folders.. I can't access the JavaScript file.. (404 error).I tried to solve the problem by using ResolveClientUrl but it's not work!
What's the problem?
but when I'm going to inner pages inside folders.. I can't access the JavaScript file
Since the page you're accessing is at a different level than your master page, you want to make the script path relative to the root of your application
<script type="text/javascript" src="/javascript/main.js"></script>
EDIT if that's not working, then I would keep the script tag as it is above, run it in Chrome with the developer tools / network tab open, and look at the exact address that shows up for the failed request. Then look closely at your application and see what's different / wrong.
You can do:
<script type="text/javascript" src="<%=Page.ResolveClientUrl("~/javascript/main.js") %>" />
Allows you to use ASP.NETs ~. If this doesn't work then the file doesn't exist in that directory.