avatarrutbar

Summary

The undefined website provides an overview of JavaScript essentials, emphasizing its role in cyber security, and outlines best practices for its use in web development.

Abstract

TryHackMe's "JavaScript Essentials | Cyber Security 101 (THM)" article serves as a primer on JavaScript, detailing its significance in cyber security education. It covers fundamental concepts such as variables, data types, functions, loops, and the request-response cycle. The article also illustrates how JavaScript interacts with HTML, the differences between internal and external JavaScript integration, and the use of dialogue functions for user interaction. It further touches on the potential for dialogue function abuse, control flow manipulation, and the importance of minification and obfuscation in code protection. Best practices in JavaScript development are highlighted, including the necessity of server-side validation, the careful inclusion of trusted libraries, the avoidance of hardcoded secrets, and the use of minification and obfuscation to enhance security and performance.

Opinions

  • The article conveys that JavaScript is a fundamental language for web development and cyber security, with its client-side execution and interaction with HTML.
  • It suggests that understanding JavaScript is crucial for recognizing and preventing web application vulnerabilities.
  • The use of external JavaScript files is recommended for better code organization and reusability across multiple web pages.
  • The article implies that while JavaScript provides interactive elements like alert, prompt, and confirm, they can be misused to create disruptive user experiences.
  • It emphasizes that client-side validation alone is insufficient for security and that server-side validation is essential to protect against bypass attempts.
  • The inclusion of only trusted JavaScript libraries is advised to mitigate the risk of introducing malicious code.
  • The article advocates for the protection of sensitive information by avoiding hardcoding secrets in JavaScript files.
  • It promotes the practice of minifying and obfuscating JavaScript code to improve performance and add a layer of complexity for potential attackers.

TryHackMe — JavaScript Essentials | Cyber Security 101 (THM)

Essential Concepts

  • Variables: Containers for storing data in JavaScript. Declare with var (function-scoped), let, or const (both block-scoped) for controlled visibility.
  • Data Types: Define value types for variables, like string, number, boolean, null, undefined, and object (e.g., arrays).
  • Functions: Code blocks for specific tasks. Instead of repeating code, use functions like PrintResult(rollNum) to manage repeated actions.
  • Loops: Run code multiple times while a condition is true, using loops like for, while, and do...while.
  • Request-Response Cycle: A client sends a request, and the server responds with resources (e.g., a webpage).

Questions and Answers

  1. What term allows you to run a code block multiple times as long as it is a condition?
  • Loop

JavaScript Overview

JavaScript (JS) is an interpreted language that runs directly in the browser. Here’s a breakdown of key concepts in a sample JS program:

  • Hello, World!: A simple log to the console.
  • Variables and Data Types: Define values, e.g., let age = 25;.
  • Control Flow: Uses if statements to execute different code based on conditions.
  • Functions: Code blocks like greet(name) that can be reused.

JS is client-side, so you can write and run it in the Chrome Console.

Example Program:

let x = 5;
let y = 10;
let result = x + y;
console.log("The result is: " + result);

Questions and Answers

  1. What is the code output if the value of x is changed to 10?
  • The result is: 20
  1. Is JavaScript a compiled or interpreted language?
  • Interpreted

Integrating JavaScript in HTML

JavaScript can be added to HTML in two main ways:

  • Internal JavaScript: Code is embedded directly within the HTML using <script> tags. Ideal for small scripts and learning how JS interacts with HTML.
  • External JavaScript: Code is stored in a separate .js file and linked in HTML with the src attribute in the <script> tag. Keeps HTML cleaner and makes it easier to reuse JS across multiple pages.

Verifying Internal or External JS: Check the page’s source code. Internal JS appears in <script> tags without src, while external JS has the src attribute in <script>.

Questions and Answers

  1. Which type of JavaScript integration places the code directly within the HTML document?
  • Internal
  1. Which method is better for reusing JS across multiple web pages?
  • External
  1. What is the name of the external JS file that is being called by external_test.html?
  • thm_external.js
  1. What attribute links an external JS file in the <script> tag?
  • src

Abusing Dialogue Functions

JavaScript offers functions like alert, prompt, and confirm for user interaction:

  • Alert: Shows a message with an “OK” button (e.g., alert(“Hello THM”);).
  • Prompt: Displays a message asking for user input; returns the input or null (e.g., name = prompt(“What is your name?”);).
  • Confirm: Shows a message with “OK” and “Cancel”; returns true or false based on user choice (e.g., confirm(“Do you want to proceed?”);).

Exploitation Example: A malicious HTML file could repeatedly use alert boxes to disrupt user experience. For instance, alert(“Hacked”); in a loop could force multiple pop-ups.

Questions and Answers

  1. In the file invoice.html, how many times does the code show the alert Hacked?
  • 3
  1. Which of the JS interactive elements should be used to display a dialogue box that asks the user for input?
  • prompt
  1. If the user enters Tesla, what value is stored in the carName= prompt(“What is your car name?”)? in the carName variable?
  • Tesla

Bypassing Control Flow Statements

Control flow in JavaScript directs the sequence of code execution based on conditions. Structures like if-else statements allow decisions based on conditions, while loops (for, while) repeat actions as long as a condition is true.

Conditional Statements: For example, in an if-else statement, entering a value for age triggers different messages. If age is 18 or above, it displays “You are an adult”; otherwise, “You are a minor.”

Login Form Bypass: In some cases, developers implement simple JS-based login forms that require specific credentials. Testing these forms can help you understand basic JS authentication.

Questions and Answers

  1. What is the message displayed if you enter the age less than 18?
  • You are a minor.
  1. What is the password for the user admin?
  • ComplexPassword

Exploring Minified Files

Minification in JavaScript compresses files by removing unnecessary characters, which reduces file size and improves load times. Obfuscation further hides code by renaming variables and inserting junk code to make it hard to read, though the functionality remains intact.

Practical Example:

  1. Create an HTML file, hello.html, with JS code in hello.js. Running this shows an alert with “Welcome to THM.”
  2. Use an online tool to minify/obfuscate the code. It becomes unreadable but functions the same.
  3. Deobfuscation tools can help revert obfuscated code back to a more readable form.

Questions and Answers

  1. What is the alert message shown after running the file hello.html?
  • Welcome to THM
  1. What is the value of the age variable in the following obfuscated code snippet?
  • 21

Best Practices

When developing web applications with JavaScript, follow these practices to reduce vulnerabilities:

  1. Avoid Relying on Client-Side Validation Only: Always perform server-side validation since users can bypass or manipulate client-side JS validation.
  2. Refrain from Adding Untrusted Libraries: Only include libraries from trusted sources to avoid malicious code.
  3. Avoid Hardcoded Secrets: Never hardcode sensitive data (e.g., API keys) directly in JS, as it is easily accessible.
  4. Minify and Obfuscate Your JavaScript Code: Minifying and obfuscating code improves load time and adds a layer of protection by making the code harder to interpret.

Questions and Answers

  1. Is it a good practice to blindly include JS in your code from any source (yea/nay)?
  • nay
Tryhackme
Tryhackme Walkthrough
Tryhackme Writeup
Recommended from ReadMedium