We can create external JavaScript file and embed it in many html page.
It provides code re usability because single JavaScript file can be used in several html pages.
An external JavaScript file must be saved by .js extension. It is recommended to embed all JavaScript files into a single file. It increases the speed of the webpage.
Let's create an external JavaScript file that prints Hello Javatpoint in a alert dialog box.
message.js
Let's include the JavaScript file into html page. It calls the JavaScript function on button click.
index.html
Advantages of External JavaScript
There will be following benefits if a user creates an external javascript:
- It helps in the reusability of code in more than one HTML file.
- It allows easy code readability.
- It is time-efficient as web browsers cache the external js files, which further reduces the page loading time.
- It enables both web designers and coders to work with html and js files parallelly and separately, i.e., without facing any code conflictions.
- The length of the code reduces as only we need to specify the location of the js file.
Disadvantages of External JavaScript
There are the following disadvantages of external files:
- The stealer may download the coder's code using the url of the js file.
- If two js files are dependent on one another, then a failure in one file may affect the execution of the other dependent file.
- The web browser needs to make an additional http request to get the js code.
- A tiny to a large change in the js code may cause unexpected results in all its dependent files.
- We need to check each file that depends on the commonly created external javascript file.
- If it is a few lines of code, then better to implement the internal javascript code.
Feedback
- Send your Feedback to [email protected]
Help Others, Please Share
Why you shouldn't use external javascript files
Using external javascript files can be harmful to you and your site visitors.
Many websites use javascript files located to an other domain. Usually this happens when we copy-paste ready-to-use code for a script (jquery, slider, gallery, etc) we found on the internet. This practice can lead to many problems and especially to serious security issues for both the site administrator and its visitors. In this article we will refer to the problems that can arise by the use of external js files and what we can do to achieve maximum availability and security.
Availability problems
Consider we have an image slider using jquery and we use an external javascript file example.com/slider.js in order for the slider to work in our site. Let's see what problems may arise to our site by just the fact that it is an external file.
The other domain is not available
If the domain in which the file is located (example.com) is down, or for some reason not-available (eg due to routing issues of the internet provider), then our script wont work because the external js file wont be loaded. Even if our site is fine and online the script wont work and the slider will break just because some other, irrelevant, site is down. This is valid for google, microsoft, and any other site you think will be online forever.
Speed reduce
The web browser takes more time to load files from external sites as it queries third sites which make page loading slower. A web-page is consisted by many files (images, videos, javascript, etc). For each file the browser makes a request to the web server in order to load it. If you pay attention to the bottom line of your web browser (eg Firefox) when you visit a page it shows you the files it loads. The local files get loaded faster than the external ones. This is valid for any file type, images, javascript, css, etc.
The file doesn't exist any more
The owner of example.com can any time delete, rename, or move the javascript file to which you have a link. The whole example.com might even completely close as a site. The slider will stop working and you will struggle to understand why this happens. In case the other domain is closed you will have an additional problem to find the js file your slider needs in order to work.
Security issues
Now, the most serious problems. The owner of example.com can any time change the contents of the js file or add something extra in the file irrelevant to the slider functionality. The same can happen by a third person if example.com is hacked. Hackers don't want to get noticed, and so most probably they will leave the slider's code as is -in order the sliders on the sites they use it to keep working- and add malicious code at the end of the file. Ιt is very difficult to notice such a change. What this additional malicious code in the js file can be? They can easily steal your cookies which may contain information about your login status. Just for your information Elxis 4.2+ uses HTTP ONLY cookies which means that javascript has no access to the cookies generated by Elxis. So at least for Elxis 4.2+ you are safe by this threat, but not for older versions or other CMSs/sites.
Họ thậm chí có thể thêm một sự kiện Onclick trên biểu mẫu đăng nhập để bạn nhấn nút Gửi, thông tin đăng nhập Tên người dùng và mật khẩu được gửi qua AJAX vào e-mail hoặc được đăng nhập vào tệp. Lưu ý rằng tin tặc không cần phải có quyền truy cập vào bất kỳ tệp nào trên trang web của bạn để thực hiện việc này. Anh ta có thể làm mọi thứ từ tập tin JS mà anh ta lưu trữ trên trang web của mình. title event on a login form so when you press the submit button the login credentials username and password are sent via ajax to an e-mail or are logged to a file. Note that the hacker doesn't need to have access to any file on your website to do this. He can do everything from the js file he hosts on his site.
Nếu bạn có một giỏ hàng, anh ấy có thể đánh cắp chi tiết thẻ tín dụng của khách hàng hoặc bất kỳ thông tin nào khác mà họ gửi trên trang web của bạn. Thông qua tệp JS bên ngoài này và bằng cách sử dụng AJAX, người có quyền truy cập vào tệp có thể theo dõi các yêu cầu trên trang web của bạn và sao chép dữ liệu mà anh ta quan tâm ở một nơi khác.steal the credit card details of your customers or any other information they submit on your web site. Via this external js file and by using AJAX the person that has access to the file can track the requests on your site and copy the data he is interested in somewhere else.
Giải pháp - Sử dụng các liên kết nội bộ
Sợ hãi? Tôi hy vọng là có. Nhưng đừng lo lắng, giải pháp rất đơn giản. Chỉ cần sao chép tệp JS bên ngoài cục bộ vào trang web của bạn và trong mã tích hợp của tập lệnh của bạn (ví dụ: Slider) Thay đổi liên kết trỏ vào tệp bên ngoài (example.com/slider.js) vào đường dẫn của tệp cục bộ được sao chép ( my-own-site.com/somothing/slider.js). Đó là tất cả!