Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Javascript Invalid or Unexpected token (\u0)

Javascript Error

As you will see in the image there is a number of red dots that are apparently each identify as \u0

File Content or Editor Make no difference.

The JS file being compiled or not compiled makes no difference, in fact more red dots appear in a non minified version because of spaces and new lines, even a blank file loaded and then adding something simple like console.log('abc') will result in all red dots only;

Adding Content

These invisible and unselectable characters appear the same number of times on the end of the file as the number of any other characters that I have typed out in any other part of the script.

The invisible characters are not in the actual file itself on disk only in the one served by the web server.

Deleting Content

If i boot the VM and then delete characters out from anywhere in the JS script then the same number of chars will vanish from the END of the content in a webresponse request for the file.

Unmodified use

When I first boot up the VM and visit the website in a browser there is no error ever on multiple requests as long as the file is never modified in any way.

Conclusion

If I modify the file in any way while the VM is running the result is as if the server has somehow kept a snapshot of what the byte size of the file was when the server either first booted or the content was first served. Then upon making alterations to the content of the file while the server is running it either chops off content if made smaller or pads out with \u0 if made bigger as if it is padding the file.

Can clear the fault its not permenant

If I reboot the VM after making the file corrupt and refresh the request for the js file with the modifications that previously cause the error, the error is gone and my new changes are fine.

I can also undo the last changes that corrupted the response and normal operation will continue.

This issue only just started happening since the 18th November give or take a couple of days and I had been running the setup for over a month prior without issue, the only thing I remember changing recently is a couple of windows updates last week?

I am running Virtualbox VM Centos 7, Apache 2.4.6 + PHP 7.1.12 on Windows 10 with the source code directory mounted to the VM using VBox Guest Additions shared folder configuration.

It seems this issue is related to the VM and it's serving of the assets, some form of padding and culling if the file changed after being loaded.

Restarting the httpd service has no affect, only rebooting the VM after every file modification clears the issue.

Has anyone else run into this problem or able to reproduce it?

VM Setup (Reproduction)

Here are the instructions I have been building up as I learn how to create and run a local development environment if you want to try and reproduce the issue:

https://docs.google.com/document/d/11cBF75hfcehB3np4nlLhc1EqIOKVchKIuQJyrvn8ztk

UPDATE 1 - 26/11/17

I have tried rebuilding a new VM from scratch, still same problem.

I have noticed it is also happening to CSS files, as a test I changed the following code:

.flexData.tools .settings:hover {
    color: #0a0a0a;
}

/*# sourceMappingURL=flexData.css.map */

to add a class called test:

.flexData.tools .settings:hover {
    color: #0a0a0a;
}
.test {
    color:blue;
}

/*# sourceMappingURL=flexData.css.map */

Results in this at the end of the file served by the server looking like this:

.flexData.tools .settings:hover {
    color: #0a0a0a; 
}

/*# sourceMappingURL=flexData.css.map */
�������������������������

Notice how the test class is missing before the comment and the strange chars have appeared after the comment.

Then I rebooted the VM then pressed F5 (refresh) in my browser, the chars vanish and my test class appears:

.flexData.tools .settings:hover {
    color: #0a0a0a; }
.test {
    color:blue;
}
/*# sourceMappingURL=flexData.css.map */

I checked the HTML source code response, it is not doing this to the HTML output from PHP.

UPDATE 2 - 26/11/17

I installed XAMP and tested all the issues above... None of the file modifications caused the error so this confirms there is some sort of file cache issue going here with the VM or the httpd service in the VM.

like image 680
Marc Avatar asked Nov 22 '17 22:11

Marc


People also ask

What is Unexpected token error in JavaScript?

The JavaScript exceptions "unexpected token" occur when a specific language construct was expected, but something else was provided. This might be a simple typo.


1 Answers

I had the same issue, it's caused by the VM.

For NGINX in the location / block add the sendfile off setting.

location / {
    ...
    sendfile off;
}

For Apache, look for EnableSendfile in httpd.conf and set it to off:

EnableSendfile off

You must restart the services for the changes to take effect, hard refresh in your web browser (CTRL+F5) is required to see the change in effect.

EnableMMAP and EnableSendfile: On systems that support it, memory-mapping or the sendfile syscall may be used to deliver files. This usually improves server performance, but must be turned off when serving from networked-mounted filesystems or support for these functions is otherwise broken on your system.

like image 79
Radu Ciobanu Avatar answered Oct 13 '22 20:10

Radu Ciobanu