Strange characters in Javascript causing it to not load - javascript

My site works fine on localhost, my javascript is loading and working fine. But when I deploy the site the script is not working. When I right click the page and say view source and then view the linked script file, it has some strange characters at the start of the file (function($){
On localhost, my script file starts like this (function($){
What is causing these characters to be prepended to my javascript file?

You have to re-save the file in encoding "UTF-8 without BOM".
You can use Notepad++ or other editors.
In visual studio:
By default, Visual Studio uses UTF encoding with the BOM; however, you can save it to a different encoding if you'd prefer. When you go to the Save As dialog, you can expand the Save button to see the 'Save with Encoding' option. This will prompt you for a different encoding, and I think one of the Unicode options will leave out the BOM (somewhere in the list is UTF-8 without signature).
Source: http://forums.silverlight.net/forums/t/144306.aspx

I think Briedis is right about the problem, but I suggest a different solution.
When you serve the file, is it being served with a Content-type like
Content-Type: text/javascript;charset=US-ASCII
?
If so, make sure to serve it with a charset of UTF-8 instead.

I just hit this same problem, and have found a fix.
As an answer to Martjin's question, the problem is that these URF-8 BOM characters invalidate the javascript when the client is expecting pure ASCII. So it will say there is an error at char 1, line 1 or some such, basically, right at the beginning of the file because it makes the codefile look like there's a typo in the first few bytes of the script.
In my case, I have a Site in IIS that is an ASP.NET app, and an Application underneath it that is also an ASP.NET app. This had caused some complications with inheriting web.configs, and the solution was to put a tag that negates inheritance from that point on.
I then discovered that all my .js in the child site was throwing an error for that stupid UTF-8 encoding symbol that was the first 3 bytes of every file. I am reasonably confident, that it is caused by some confusion in the httphandlers from my 2-tier solution for web.configs.
My solution, however was to convert the .js files back to pure ASCII, as that's what IIS was sending out and the client was expecting. For me, I have a build.bat that copies all the web files, removes any source control and project files and puts them all in a final build directory for copying to the test or production server. I made a modification to that script to also convert all the .js files to ASCII format.
It uses a combination of DOS batch (because that's where I started) and PowerShell (because that's the only way I found to convert without adding even more utility programs):
set DIRTOCONVERT=whatever path you want it to convert all the files for
ECHO remove UTF-8 BOM chars ï»? from front of files
for /r %DIRTOCONVERT% %%g in (*.js) do (
powershell -command "gc -en utf8 \"%%g\" | Out-File -en ascii .\tmp.txt"
move /y .\tmp.txt "%%g"
)
Note, a few people online (even in StackOverflow) had the idea to try:
type badfile.txt > goodfile.txt
but that still carries over the UTF-8 encoding. Apparently, it did not used to do that.

I had a similar issue, and found the fix when stumbling on this thread.
There was indeed a problem with the files not being UTF-8 (without BOM), but re-saving my js files as utf-8 didn't work, instead, it was my HTML file that imported these scripts that was the culprit. After I saved that file as UTF-8, the issue was resolved.

Related

Special characters at end of javascript file

I am needing some advise on this weird issue im running into randomly which i havent been able to figure out yet.
I am writing some javascript code on my local desktop at work and moving the file via citrix session to the right static content folder. Randomly i start getting script errors on code that worked before. Upon accessing the content of the js file through the URL that is being used to render it, i start seeing multiple lines of:"���������������������������������������������������" at the end of the javascript file.
Initially i thought some how the encoding was changing while saving the file, but i have tried to enforce various encodings and the issue still persists. I have also tried various text editors such as notepad, notepad++, sublime text.
Does anyone have any ideas on what might be happening here that would be causing these � to be appended at the end of the file?

Grunt Uglify weird characters at last line leading to no changes

I am working since month with Grunt Watch, which is using Uglify to minify Javascript files and also generating a .map file which worked perfectly since yesterday.
When I now do grunt watch and save a Javascript file, Grunt workes like intended and runs the tasks which copy the Javascript file into the public area and generating the filename.js and filename.js.map file into the public area.
Now I am refreshing the page to look my changes, but instead of my changes, the browser seems loading the old Javascript file (Yes, I am using version like filename.js?v=....).
When I look in the source code and open the Javascript file, at the end of the file following weird characters are there:
//# sourceMappingURL=filename.js.map��������������������
I am using Chrome as my browser and PHPStorm as my IDE.
I tried to convert to UTF-8, UTF-8 without BOM, changed line Feeds to LF and CRLF, but nothing seems to be the solution.
I also displayed all invisible characters to look if there is something hidden, but there is nothing.
Inside the generated file there is the console.log('Test'); I written into, but in the same file I opened in the source code, the console.log('Test'); is not there:
Open file in any IDE: [public/js/filename.js]
... function(){l=!0,console.log("Test"),c.setTimeout(fun ...
Open file in any Browser: [/js/filename.js]
... function(){l=!0,c.setTimeout(fun ...
If I delete the 2 files in the public folder, change something in the original file and save, grunt is uglifying and copying everything and it's working! But just this one time.. the next changes leading to the same weird characters and no changes to the file in the browser again.
Like I said: The whole process I am doing worked for months! But since yesterday it's not working anymore.
I didn't installed/patched anything. This behaviour came from one to another second.
Operating System is:
Linux packer-virtualbox-iso-14225xxxxx 3.2.0-4-amd64 #1 SMP Debian 3.2.65-1 x86_
I am searching since yesterday, but can't find any solution or idea what is wrong.
Used to have the same problem. You should turn off your sendfile in nginx.
sendfile off;
see https://github.com/mitchellh/vagrant/issues/351#issuecomment-1339640
I just restartet my computer and it seems working right now.
But if anyone has a suggestion to prevent this or solving this problem in the future, I would be happy to hear from it! If in the next few days no answer comes, I will mark my answer as solution.

How do I find this parse error reported by Firebug after YUI compression?

I have a website that uses Javascript. In my home testing environment, the Javascript is contained in a number of different files. When I upload the files to the live site, I use a Bash script to combine and compress the files so the site is overall more efficient.
First I combine the Javascript files using cat:
cat list_of_javascript_files_to_combine.txt | xargs cat > combined_javascript_file.js
Then I use YUI Compressor to compress the resulting Javascript:
java -jar yuicompressor-2.4.7.jar combined_javascript_file.js -o combined_javascript_file.js --charset utf-8
In my local testing environment, before the Javascript is combined and compressed, it works without reporting any errors at all.
However, after uploading, when I look at the console in Firebug, I get this error:
SyntaxError: JSON.parse: unexpected character
...|0)}}this._yuifacade=true;this._event=z;this.pageX=t;this.pageY=w;x=z.keyCode||z...
The problem is that because the javascript is compressed, everything is on one long line, making it nearly impossible to determine where the error is in the pre-compressed files. Also, it's not at all certain that the snippet of code Firebug is showing me is where the error actually is. I have, of course, searched for the part of the string displayed, but it doesn't look erroneous to me, and Netbeans, which I use to Debug, doesn't report any warnings for where that code is.
Since this error only seems to appear after I compress the Javascript, I assume there's something about the compression itself that is causing trouble. However, the resulting compressed file is, by design, really hard for a human like me to parse, making debugging a little beyond my abilities.
Is there a way I can narrow down what the problem is so that I can fix it?

Why do some PHP or JS files get uploaded as one-line rather than keep formatting?

I am offering zip files of a plugin I wrote with JS, PHP and CSS files for the user to upload to their server. However, in some user cases the JS file gets uploaded as one line, obviously causing a massive FAIL and a complaint from users. To get it working again, I just open the file and copy/paste from my properly formatted version onto theirs. Presto! So, can someone explain what is going wrong here and how I can prevent this easy-to-fix but time consuming problem? I am using Notepad++ on Win, is there some kind of setting I should be using to save my files? Or is it a remote server problem that I just can't prevent?
Most likely this is caused by different line endings and their interpretations on various operating systems. I would thought that nowadays these problems are over, apparently not.
Ask your customer for any file created on the target system and see what line ending is natively used there. Then simply give them file for the target platform (AFAIR Notepadd++ allows you to save file in with any EOL).

YUI Compression? gui? and comptible with european letterS?

I am trying to find some sort of gui or batch utility where i can YUI compress a JS file i have.. I have a utility that sort of consolidates all my js into 1 single js .. and works great but i need to compress this file..
I was using something similar before to compress but it failed on european character i.e. character with accents over letters... like Día , Sábado etc
So basically what happend was it worked great but when i had a string with a european word with accents on it.. it would put escape characters in etc... I had to manually edit it.. it was a nightmare.-..
Can anyone point me in the right direction of a good GUI that works with YUI or somehtign similar so i can point it to my file (and files and i have more than one) so i can just one it like in batch mode or similar.. It needs to compress jquery also... i suppose yui has no issues with this?
Does anyone know if something like this exists at all?
I didn't really want to use the command like as i have a few files...
Any help really appreciated
My suggestion may not be exactly what you are looking for, but I am using batch file(s) to drive the compression/packaging of multiple JS files.
Without any special batch file fu, and assuming your on Windows, you could write a batch file similar to this (in the order in which you want the files to load in the browser):
compress.cmd:
echo. > compressed.js
java -jar yuicompressor-2.4.2.jar jquery.js >> compressed.js
java -jar yuicompressor-2.4.2.jar file1.js >> compressed.js
java -jar yuicompressor-2.4.2.jar file2.js >> compressed.js
You can then run this anytime you need to "re-package" everything into the single deployment file "compress.js".
BTW, make sure all your JavaScript source files are UTF8 and then run the compressor with the --charset UTF-8 option; this should take care of character encoding issues.

Categories

Resources