Local Tomcat instance with css and javascript resources - javascript

I'm sorry if this question has been asked before, but I can't seem to find an answer for it anywhere else.
I am running a local tomcat instance using eclipse and wtp. When the local server is running, I have to use the url http://localhost:8080/appName in order to access it.
I have been using relative URLs to use my javascript and css, but now I would like start using namespaced URLs, such as domain.com/admin/users. I can't use relative css and javascript resources with these urls, since there is no javascript in the admin directory.
How can I use css and javascript resources from either my development or my production context? Is there a way to use my local tomcat instance from the ROOT context, as I can do in production? Do I have to use something to build the URLs for my resources (I would have to do this a lot, in both struts2 jsps, as well as sitemesh) ?

Don't think it's a good idea to hard code the domain urls. You can always work with the root context of your web application. You can use request.getContextPath() to know your context root. Your js/css should be under this. So you can access it like "<%=request.getContextPath()%>/js/some.js". So even when the context root changes you do not have to do any code changes. I have used the scriplet here as an example.

Related

Javascript URI/Origin Override

I have a very specific challenge where a self contained website and assets are stored in a location that is not a web server and cannot be a web server.
I need to be able to provide staff a stand alone index.html file that they can run from their local computer which will reference the online location as a sort of external storage repository.
The website has a lot of assets and javascript... in many cases the javascript calls to assets using local paths such as images/image_file.png
Without manually updating all the asset paths within the website code, modifying hosts file... using iframe... is there a way with javascript alone to add prefix to all paths that come after in the document?
Almost like defining or setting origin which I don't believe is possible.
I had thought to read the code in with a parser and try and regex replace but was hoping for a simpler solution.
Thanks in advance for your consideration.

Changing web environment URLs automatic

I'm currently working on a web project(js, html, php with no frameworks) using AWS technology, including AWS version control. I work locally with Xampp and when I push my code to the master branch there is a trigger that deploys the code to the Production environment.
My main problem now is that I need to manually change the development-production urls or use a html tag and relative URLs, and it's a mess.. When working on development my url is something like: "192.168.64.2/web" and when production it's "myweburl.com". So I need something that checks out my actual URL and change all those over the project. Something like a global variable with the URL to use.
I've read about using "dotenv" and "dotenv-webpack" for environment manage, but I do need to install it on the server, as well as nodejs, and configure .gitignore, and I expect an easier solution. I would like to avoid nodejs. I've searched about my question all around internet but I just find ways that do not convince me, but if this question is repeated just redirect me there.
Is there any secure approach just using javascript, php or a config file?
The objective is having something that depending on my URL (DEV, TEST, PROD) changes all the URLs of my project, and protect the other environment URLs from being seen.
Thank you

Meteor.js serve javascript files without (function() { ... }).call(this)

The title should be self explanatory, but is there a way to get Meteor to serve up a javascript file without stuffing it into (function() { <<code>> }).call(this)?
I wrote an app that relies on javascript objects each stored in their own file and then instantiated when they are ready to be used. However, because of the aforementioned problem, they are isolated and unable to be viewed from outside files.
The only option I have come up with is to store them as plaintext and then load them using an HTTP request and then store them into the main file. Hopefully I am missing a much easier way.
If you need any code, let me know, but I think this is general enough to not warrant any.
--EDIT--
I originally wrote this to be a standalone html page, but then decided to go all out and use meteor to make it a full-blown web app.
Its probably not a good idea to try and get the javascript file this way because when you deploy the app or set production mode on, all the javascript files and html files will be minified into a single js file & they wouldn't exist the normal locations during development anymore:
If you want the javascript file to be untouched by meteor you would need to put it in a folder called /public in your projects root directory.
If you are more interested in whats inside the javascript files as opposed to getting them by filename you might want to switch to the devel branch of meteor, or wait for the never version after 0.6.2.1 and put your javascript files in /client/compatibility/ as these files are not variable scoped & will still be automatically referenced unlike the /public dir.

cookieless domain to serve css and js - way to organize code?

I would like to configure my environment to serve css and javascript files from static.example.com instead of example.com/static.
The second has the convenience that I can code my html pages to load the css and javascript files relatively eg "static/reset.css" independent of the actual domain.
Is there a good practice to avoid altering all my source files whenever I change
static.example.com to static.otherexample.com
as I would have to rewrite all my HTML source files importing css and javascript?
Use some kind of configurable prefix to include js and css files. Depending on the technology you're using, it is helpful to have some kind of helper method for this. In ASP.NET MVC, I use some custom method like CSS.Add("reset.css"), which knows the path and URL.
The js files should not really care where they are loaded from. As for css, it's important to know that relative URLs in CSS are interpreted as relative to the URL the CSS was loaded from, not relative to the URL the page was loaded from. So make sure you understand that background-image: url('/images/img1.png') would also load from the static page (which is usually a good thing).
The better way
It's best practice to compress, minify and merge all of the CSS / js files. Therefore, you should only have a very small number of files (one js, one css) to keep the number of requests low. The inclusion of these files would happen on the server, so the URLs don't matter. To implement this, you will need some kind of helper method (and a lot of compression logic, but there are libraries for all this).
For ASP.NET MVC there is SquishIt, but I'm sure there are plenty of tools for various environments.
How is the html being generated?
You could use a config value or constant, and use that value for the domain portion of the url for any of the static assets.
You can always do a trick on the server, i.e. all your urls in HTML could be relative to /static, but once your server receive request, it can "change" the route and get files from static.current-domain.com instead of current-domain.com/static

Django : Is it a good idea to generate JS dynamically?

When I write my JS files for a Django project, of course I do some AJAX calls, and for the moment the urls for those calls are hard-coded (which is very ugly).
I was thinking of having the JS files served by django (instead of Apache), so I could take advantage of the template tags ({% url %} !!!).
Is there a reason why I shouldn't do this ?
Or is there a right way to do this ?
(I can give a least one : it will consume a lot of time resending JS files that haven't changed. What would be great is to have an application that generates files when restarting django server, and serves them statically after !)
I would go for a hybrid technique. Serve most of your javascript statically. But in your Django template, have a <script> block that defines various global variables, which are generated by the server-side code - url is a good example. Then your static JS can refer to the variables that are generated in the dynamic code.
I searched deeper in those asset manager applications from djangopackages, have found out that django-mediagenerator provides that feature, even if it is not well documented : you can generate your js or css files as django templates, and then serve them statically (they are also bundled, and caching is managed etc ... so two birds with one stone + it is really easy to set-up !).
In order to have JS files generated as django templates (after having set-up django-mediagenerator), just add the filter :
ROOT_MEDIA_FILTERS = {
'js': 'mediagenerator.filters.template.Template',
}
in your settings.
Dynamically generating Javascript on your server can be a tremendously powerful tool and I've experienced both it's upside and downside in my projects.
In general you want to keep as much as possible static to minimize the work to be done on every request. This includes having the browser cache as much as possible, which might become a problem in your case.
What I usually do is to have a block in the header in my base template. In templates that need to do custom javascript that is only known at runtime (customization based on logged in user, for example), I add it to the block. Here I can dynamically generate javascript that I know won't be cached so I can make some assumptions. The downside is more complexity.
If what you need are just pointing to urls, or have some simple configuration, etc, then I would suggest creating a view that will return a Javascript file with these settings. You can set the correct headers(Etag, Cache-Control, etc) so the browser will cache the file for some reasonable time. When you upgrade your code, make sure the Etag will change.
In the code that needs to use the configuration, you need to always check that the variable you are looking for is actually defined otherwise you will run into problems that are hard to debug when for some reason the configuration javascript is not loaded correctly.
The .js that gets sent to the browser would vary. That could make debugging more cumbersome. Maybe not a problem but something to potentially consider...
Nowadays, the best way to do this is to use Django.js
Here is the doc where they talk about the URL reversing: http://djangojs.readthedocs.org/en/0.8.1/djangojs.html#reverse-urls

Categories