Javascript path in Ruby on Rails - javascript

I need to include a plugin javascript stored in folder app/assets/plugins/
In application.html.erb:
<script> var plugin_path = "<%= Rails.root.join("app", "assets", "plugins") %>";</script>
<%= javascript_include_tag 'script' %>
In script.js:
loadScript(plugin_path + '/pluginA/js/pluginA.js', function() {
Init(false);
});
When I start my server and load my homepage, terminal displays a message like
[GET] cannot find route
'/home/myapp/app/assets/plugins/pluginA/js/pluginA.js'
This url is correct (I suppose). So what is the problem here and how to load this plugin in a correct way?

The heart of this issue is that /home/myapp/app/assets/plugins/pluginA/js/pluginA.js is not a URL. It's a filesystem path. Your web browser currently believes that's a route in your Rails app (you should be able to verify a 404 in your development.log for your Rails app for that path.
The easiest fix may be to use file:///home/myapp/app/assets/plugins/pluginA/js/pluginA.js which is a URL. You may wish to try that during development.
There is no chance this will work as you move this work to staging or production, where the site will be accessed by other web browsers. You will need to learn how to integrate this plugin into the Rails asset pipeline. (It looks like requiring your script in application.js, and initializing it near the bottom of that file may be appropriate, but this is difficult to say without more knowledge.)

Related

How would I add URL subsections/subpages?

How would I add things like this:
/page/sub-section
ex: https://url.com/account/notifications
In terms of a static site, each slash represents a single directory on your web server.
/page/sub-section
Would mean you have the
/ the root directory
/page a folder called page
/sub-section another folder called sub-section
In the last folder, you would then have your index file, which will be loaded once visiting the URL. For example index.html.
In terms of web development this is named routing and all the big web frameworks come with own modules for routing. Here you don't have to create directories as described above, instead these frameworks will handle the request and route it internally to find the right content and display it for that route.

Confusion regarding Apache document root

In one of the applications that I am working on for my company, I came across a weird behaviour or maybe it's just my misunderstanding and I hope I can get some clarification.
The application is served by Apache and the root is : /company/client. For every page that I visit, for example https://11.11.11.11/index.phtml, it will actually point to the file in the server /company/client/index.phtml and so on. In one of the modules of the application, it contains a move_uploaded_file php function, and the target directory is /images/example/, when the page is run, the app is trying to go to the absolute server root /images/example/ instead of /company/client/images/example/.
Also the a new windowed opened up by window.open has an img tag having src='/images/exmaple/', this points to the server root instead of /company/client/images/example/, is this expected?
Am I missing anything, or is it something to do with Apache configuration?
Additional info:
The application is served as a virtual host in conf file, with DocumentRoot "/company/client/".
The page that is executing window.open and php function is used as an Iframe inside /company/client/index.phtml
sorry for my mistake.
Thanks for the help from the everyone especially Chris G, the problem was that the code is using a GET variable incorrectly, as a result the image name isn't passed. And I got confused because someone made a mistake in the code by moving image relative to the root folder which is incorrect. That made me think that PHP is also treating path like the client side which is a mistake. I'm guessing I can conclude that the web server document root only applies to everything client side, like the url, JS, HTML?

Failed to load resource: the server responded with a status of 409

After an automatic WordPress update the plugin forms (Contact Form 7) now display a slash just below them and are no longer firing the wpcf7mailsent listener event, so it is no longer being redirected to the thanks page after submitting the form.
This error: “the server responded with a status of 409 or also known as net :: ERR_ABORTED 409” from what I see is a problem loading styles.css and scripts.js files.
This must be the reason why it is not issuing the wpcf7mailsent listener event and a slash just below the forms.
Strangely if on the same page I manually click and open the styles.css file via URL, the file starts to load on the page and it stops showing that bar just below the form.
For this reason I am saying that you are not loading the styles.css and scripts.js files, as they do not even appear in the uploaded files folder, just after I open them by URL.
Here’s the test I did to show it:
The error happening:
https://ibb.co/Vvm8jwG
Did not load CSS file and JS file:
https://ibb.co/kHszgW9
After I open the CSS style link that says it didn’t load:
https://ibb.co/FXcLRXQ
https://ibb.co/997nMgK
You no longer see the error that you did not upload the CSS file and now the file has been uploaded to the folder showing the contents. The same will happen with the JS file if I manually load it as the CSS file.
https://ibb.co/jGPQ2MH
https://ibb.co/chVjRTQ
What I already tried to do to fix, but it didn’t work:
– I disabled several plugins
– I updated the plugin
– I reinstalled the plugin
– I tested in other browsers, the error persists
Other sites with Contact Form 7 are also experiencing the same.
Environment Settings:
Theme: Javelin
WordPress: 5.2.4
PHP: 7.1.24
Hosting: Hostgator
The page I need help with: https://verdecia.com.br/central-de-atendimento/
For anyone who is facing this issue, this is a known issue in bluehost and hostgator hosting. Basically the root reason for this seems to be that they are blocking image/js/css or other assets in any path with contact string.
The reason that contact form 7 assets are randomly blocked is probably also due to this same reason.
I had html websites running on my server where contact (or any other) page with assets in for example /images/contact/ folder also did not load with 409 conflict error, due to the contact path in the assets folder.
Unfortunately I found no solution to this just like many many users out there. Check out these links:
Link 1
Link 2
What is the solution?
Well wasting time with hosting provider support is of no use. I just use
hostgator/bluehost for development purpose. There are many hosting providers out there,
so next time you can choose some other one, especially for live websites.
For custom websites, avoid naming your assets folder to anything that has contact in it.
For CF7 in wordpress stop loading the assets in wp-config file using define( 'WPCF7_LOAD_JS', false ); define( 'WPCF7_LOAD_CSS', false ); and manually load the files in the header by separately downloading the files and importing them.
EDIT:
I have been using a simpler fix recently when using CF7, just rename the plugin folder from contact-form-7 to anything without contact keyword, like cf7. This will start loading all assets without the conflict.

Rails duplicating asset in production page load?

It's my first deploying a real application to production, and we are having some problems with speed on the website. The main problem right now is the time it takes to load the index page, so I know it's really a thing about queries or anything like that.
We are using Heroku + Puma + CloudFront as a CDN to server our static assets. Thing is, I'm not really that sure this should be happening:
As you can see, application.js and application.css is being loaded twice, one from cloudfront and one from /assets. Should this be happening? This is only an example but is happening too with some images and .svgs that I have, they are 'being loaded' twice.
Important to notice that the call for including both js and css is only being made once in the head tag
Thanks
The assets are being loaded once, but via two HTTP calls, the first being a redirect to the second. You can see that the first application.js results in a redirect (see below the URL in the third column) to the second application.js, and the same goes for application.css
To avoid the redirect, you need to configure Rails to load assets from a different domain. To do so, set config.action_controller.asset_host in the relevant environment config file, like so:
config.action_controller.asset_host = "http://XXXXXXX.cloudfront.net"

STS Spring MVC: How to include a JS file in a JSP

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

Categories