JavaScript working differently locally than online - javascript

I've noticed that some simple scripts in JavaScript that work perfectly on my local server don't work at all online.
How can be this possible? JS client-side scripting? Any ideas?
Sorry for not providing much information, and for my English, too.
Mine was a general question.
For example:
$('#posticipa').click(function(){
var stato = $('#future').css('display');
if(stato == 'none'){$('#future').css('display', 'block');}
else{ $('#future').css('display', 'none');}
});
This piece of code works perfectly on my local Apache server on Ubuntu 9.10, with Firefox 3.6, 3.5, Google chrome and Opera.
When I upload it on my remote CentOS server, also running Apache, it doesn't work. No errors are displayed in Firebug or the console; it just doesn't run.
I'm using the same version of jQuery on both servers.

Check console in your browser for errors. If it is Firefox - install firebug, if it chrome - press Ctrl + Alt + J.

It depends on what your script is trying to do. "Any ideas?" is pretty broad. But client-side scripting has a lot more restrictions than server-side, for obvious security reasons. For example, if you could access the client's file system through client-side JS, any website on the internet would be able to take control of your system.
JavaScript Security Restrictions

Having looked at your edited question, I think it's most likely that one of two things is happening:
Some kind of error is causing the JS to fail before this code is hit (but you say FireBug isn't displaying an error, so if you've got FB set up right this shouldn't be the problem)
The entire script is never getting hit, probably due to an incorrect src attribute in the script tag.
Try putting a debugger; line or an alert somewhere very early in your JS code. That should tell you whether the script is getting hit (the debugger command should tell FireBug to go into debug mode, provided you have FB's Script tag enabled on when you load the page).
If it isn't getting hit, make sure the script's src is the correct, reachable URL. If it is, move the line steadily down your code until it doesn't fire anymore. That should help you figure out where the error is.

Related

Cant even run code in browser because localhost refused to connect

Use Vscode for the first time. Use ctrl + f5 to run code. It opens up a chrome window and get hit with a
This site can’t be reachedlocalhost refused to connect.
Try:
Checking the connection
Checking the proxy and the firewall
ERR_CONNECTION_REFUSED
What to do?
You're probably not running a server correctly. But if you are, that probably means you have a problem in your configuration.
If you just want to run a document that is located on your computer, Chrome will run it just fine if you put the file path in your address bar.
(I had a problem just like this when I was just getting started with HTML, CSS, JS. It is also important to note, if you are also just starting out, that the file path will need to point to an HTML document, not a JS. JavaScript normally cannot be rendered on its own.)

How to debug when javascript doesn't load

I have 2 sites using the same theme. (http://www.kentishtowner.co.uk and http://here-is.com/kentishtowner-old/ )
They are WP multisite subsites, both using the exact same child theme (same template files exactly).
However, the former website is not loading javascript, causing the masonry layout and mobile menu to not work!
I assume this is something to do with when I mapped the domains, or changed the URL from something like here-is.com/kentishtowner-new to here-is.com/kentishtowner, before domain mapping...
As I am not a JS person, can someone give me some insight as to how I can go about debugging this?
I haven't slept a wink last night and it's now 11am - am getting an hour's shuteye, and would hugely appreciate any responses!
Thanks!
In Chrome's console you'll see
Resource interpreted as Script but transferred with MIME type
text/html:
"http://here-is.com/?dm=c078877dcf0e3101dc20cc337a8e4214&action=load&blogid=13&siteid=1&t=1522670393&back=http%3A%2F%2Fkentishtowner.co.uk%2F".
In fact, further digging shows that here-is.com is returning an empty response to that request.
The page is actually referring absolutely to a number of resources on here-is.com and that works fine when you access it via that domain, but has issues when you access via www.kentishtowner.co.uk. I don't know enough about your setup to say for sure how to resolve it but you probably need to configure the base URL of the project to tell it where it's being deployed, or if you can tell it to use relative links that would work too.
(In Chrome's developer tools you can hit ctrl+shift+F and type here-is.com to see the references)
Browsers have consoles where javascript errors are thrown. They will tell you what error was thrown, and where it was thrown from. Once you know that, you can google around to see if there is anything obvious to fix.
My guess, though, is that somewhere the site that isn't working is trying to use a script that was hosted on the working site. If that's the case, you just need to update the script paths.
--edit--
Fortunately for me (from what I hear), I have never used Wordpress. Unfortunately for you, I don't know how to tell you where the .js files would be located, or how they are organized at all.
I usually debug in Chrome, so this is how you can check to see if your page is able / unable to get an external script.
When you are focused on the page you're having a problem on, hit F12 to open up the dev tools in Chrome.
Click on the Network tab, and then hit F5 to refresh the page.
Click on the Type table header, and look for files that say text/javascript. Those will be the external script files your site is requesting.
Look at the Status column for each of those rows. If it doesn't say 200 OK., then your page isn't able to access the corresponding script.
From there, you would need to find where those scripts are supposed to be located. Once you know that, just find the scripts from the other site, and copy them into the correct location of the broken site.
Good luck!

Why wont the nude.js html5canvas demo work locally?

Try this nice JavaScript: http://www.patrick-wied.at/static/nudejs/demo/
Warning: slightly NSFW.
It won't work when i open it from my local machine. Either by copying the 3 exact source codes and making the picture locations absolute (or else by downloading https://github.com/pa7/nude.js/archive/master.zip).
I am lost why? it must be a silly/simple reason since the demo page is obviously working and JavaScript only, so why would it make a difference where you store it?
I think this is because of the browser security restrictions. are you opening the html file from the file system, instead of serving it from localhost? or are you referencing resources from another domain that does not have CORS enabled? Debugging with the console should help.

Microsoft Word download from web server issue

I am trying to troubleshoot the following issue. A client tried to download a word document and is getting the following error.
Your organization's policies are preventing us from completing this action
for you. For more info, please contact your help desk.
I believe this issue is because of cross-domain javascript. However, the file is being downloaded from a pop-up that doesn't stay on the screen long enough for me to do anything. It is an issue with IE8 / 9.
I can not find which javascript is opening the popup let alone which javascript is being run from within the popup. I am using fiddler to try and view the http requests and that is not helping.
Is there a way for me to debug what is happening within that popup? Is there a way to debug javascript to break on a type of condition being met?
EDIT:
I have tried working on this issue on my local environment and the same issue comes up. The popup appears to first come from the same domain https://company.aj.com, then goes to a different domain https://apps.aj.com and the file is being downloaded from the apps domain.

How do you log to the error console from untrusted Javascript?

In Chromium, 'console.log()' lets you print to the error console, but only from javascript embedded in the html, or in a .js file on the local machine.
What are your workarounds for debugging Javascript that is contained in .js files on a remote machine and included in a page?
Add breakpoints and / or watch expressions.
See http://code.google.com/chrome/devtools/docs/scripts-breakpoints.html
I recently had to do this with a Facebook SDK javascript, hosted by Facebook. I downloaded the script and hosted it locally for debugging. I could then add in all the console.log messages I wanted.
When everything was done I removed the local file and returned to Facebook's hosted script.
Phil's suggestion of breakpoints is also very useful when you want the value of a variable at a specific location in the code.
Another useful technique for code executed upon a user action, such as a button click, is to use the Scripts tab of the Chrome inspector, or FireBug in FF, to edit the javascript prior to execution. I've had limited use for this, but it's quite useful from time to time.
The problem is cross-domain security policy. Only javascript from the domain of the html file can use console.log

Categories