HTML5 Exam Notes PDF

Lecture 26: HTML5: The Next Generation Notes ● HTML5, the latest version of the HyperText Markup Language (HTML) ● Semantics: HTML5 introduces more semantic elements like <article>, <section>, <nav>, <header>, <footer>, and <aside>. These elements make the structure of web pages clearer not only for...

Lecture 26: HTML5: The Next Generation Notes ● HTML5, the latest version of the HyperText Markup Language (HTML) ● Semantics: HTML5 introduces more semantic elements like <article>, <section>, <nav>, <header>, <footer>, and <aside>. These elements make the structure of web pages clearer not only for developers but also for search engines and assistive technologies. ○ <section>- a grouping of content, e.g. chapters or tabbed pages or a page is divided into Introduction, News Items and Contact Information ● Multimedia Integration: It supports audio and video elements (<audio> and <video>) natively, reducing the reliance on third-party plugins like Flash for multimedia content. This means videos and audio files can be easily embedded and played directly in web browsers. ○ • Video container files include video and audio files ○ To insert a video file in a web page, use the <video> element ○ <video src="pr6.webm" width="320" height="240"></video> ○ Here’s an example of a video that will start downloading (but not playing) as soon as the page loads: ■ <video src="pr6.webm" width="320" height="240" preload></video> ○ And here’s an example of a video that will not start downloading as soon as the ○ page loads: ■ <video src="pr6.webm" width="320" height="240" preload="none"></video> ○ Here’s an example of a video that will start downloading and playing as soon as possible after the page loads: ■ <video src="pr6.webm" width="320" height="240" autoplay></video> ■ The autoplay attribute tells the browser that you want to start downloading the video file as soon as the page loads, and you would like it to start playing the video automatically as soon as possible. Mostly blocked by browsers, unless muted. ● Graphics and Effects: HTML5 includes support for scalable vector graphics (SVG) and canvas elements, allowing for more complex graphical operations and animations directly within the browser. ○ A canvas is a rectangle in your page where you can use JavaScript to draw anything you want. ○ A <canvas> element has no content and no border of its own. ○ The <svg> element is “a container for SVG graphics.” ○ ● ● ● ● ● ● ● ● ● ● Geolocation, whereby visitors can choose to share their physical location with your web application Cross-Platform Compatibility: Designed to work across different browsers and devices, including mobile devices, HTML5 provides a consistent user experience across various platforms. Offline Capabilities: Persistent Local storage Application caching and local storage features in HTML5 allow web applications to store data locally and operate offline. This is a significant improvement over the previous reliance on server-side storage. ○ Local Storage ■ localStorage is a client-side key-value database, ● data is stored in the user's browser and remains there even across sessions (open/close browser) ● data is only available when on that machine and in that browser ● localStorage is per browser not per computer. ● localStorage only supports storing of strings ○ Session Storage ■ The sessionStorage object is equal to the localStorage object, except that it stores the data for only one session. The data is deleted when the user closes the specific browser tab. ■ Sites can add data to the session storage, and it will be accessible to any page from the same site opened in that window. ■ If the user had multiple windows opened on the site, each one would have its own individual copy of the session storage object. Game Development: With its advanced features like canvas and WebGL, HTML5 has become a popular choice for developing browser-based games. Form Controls and Validation: HTML5 introduces new form elements and attributes that provide better input control and validation. This includes elements like date pickers, range sliders, and email/URL inputs. Interactivity and Script APIs: HTML5 enhances web interactivity with new APIs (Application Programming Interfaces) for tasks such as drag-and-drop, file handling, and more sophisticated client-side data processing. Accessibility Improvements: HTML5 places a strong emphasis on making web content more accessible. Semantic elements, ARIA roles, and new attributes enhance the ability of assistive technologies to interpret web content. Performance and Integration: It enables more efficient, faster-loading web pages due to improved parsing rules, which contribute to better performance and backward compatibility. Mobile Optimization: HTML5 is designed with mobile users in mind, offering features that are particularly beneficial for mobile web development, like touch events and mobile-friendly form elements. Doctype Simplicity: The doctype declaration in HTML5 is simple (<!DOCTYPE html>), which is a significant simplification compared to previous HTML versions. ● ● Compatibility and Fallbacks: While HTML5 is designed to be forward-compatible, it also allows for fallback mechanisms (like providing alternate content for non-supporting browsers) ensuring that web pages are accessible in older browsers too. HTML5 represents a significant step forward in web development, addressing many of the limitations of its predecessors. Its focus on semantic content, multimedia capabilities, and cross-platform support has made it a cornerstone technology for modern web development HTML5 - Removed Elements ● The following elements are not in HTML 5 because their effect is purely presentational and therefore better handled by CSS: ○ – basefont, big, center, font, s, strike, tt, u ● The following elements are not in HTML 5 because their usage affected usability and accessibility for the end user in a negative way: ○ – frame , frameset, noframes ● The following elements are not included because they have not been used often, created confusion or can be handled by other elements ○ – acronym is not included because it has created lots of confusion. Authors are to use abbr for abbreviations. ○ – applet has been obsoleted in favor of object. ○ – isindex usage can be replaced by usage of form controls. ○ – dir has been obsoleted in favor of ul. ○ Lecture 27: Web Security Notes ● Why Secure the Web? ○ The Web has evolved into an ubiquitous entity providing a rich and common platform for connecting people and doing business. } BUT, the Web also offers a cheap, effective, convenient and anonymous platform for crime. ● Web Security from a Hackers Perspective ○ If you dont have CCV…ccv is hugely important..that’s why those cards cost more…no need for zip codes ● ● ● ● ● ● ○ ○ Amex is more expensive bc the spending limit is much higher ○ Incentives for hacking are clear! There is a huge market demand. ○ Spamming db is a good return on investments A look at current state of web (in)security ○ According to the WhiteHat Website Security Statistics Report (2013-2014), ■ 86% of all websites have at least one SERIOUS vulnerability. ■ Average number of open SERIOUS vulnerabilities per website was 56 (unfixed) ■ Cross-Site Scripting (XSS) is #1 vulnerability ■ PHP apps have highest risk of exposing vulnerabilities ○ According to the Symantec Internet Security Threat Report, ■ A new Zero-Day Vulnerability was discovered on average each week in 2015 } ■ Zero-day Vulnerability: a zero-day vulnerability is a flaw. A zero-day attack happens once that flaw, or software/hardware vulnerability, is exploited and attackers release malware before a developer has an opportunity to create a patch to fix the vulnerability—hence “zero-day.” ■ It is unknown to website or company that has the vulnerability…hacker that knows that vulnerability and actually exploit ■ No longer a 0 day vulnerability once the company/website knows about it. About 13% of requests are exploiting malware Variant is a version…change one character in code of a virus and the hash will be different ○ If you have a good virus then people would want to create 10 variants 5.4B wannacry attacks blocked (wannacry targeted hospitals) 600% increase in attacks against IoT devices Phishing - use spam email..hope someone clicks on links and then take control of their accounts ● ● No one is really immune…every country has ransomware as major types of attacks Ransomware attacks: Ransomware is a malware designed to deny a user or organization access to files on their computer. By encrypting these files and demanding a ransom payment for the decryption key, cyberattackers place organizations in a position where paying the ransom is the easiest and cheapest way to regain access to their files. ● ● ● Anonymous (early years..early 2000 came out) ○ Anonymous is an international cabal of criminal hackers dating back to 2003 who have shut down the websites of the U.S. department of Justice and the F.B.I. they have hacked into the phone lines of Scotland Yard. They are responsible for attacks against MasterCard, Visa, Sony and the Governments of the U.S., U.K., Turkey, Australia, Egypt, Algeria, Libya, Iran, Chile, Colombia, New Zealand and Canadian MP Marc Gameau. ○ Hacked nazi-site Daily Stormer ○ DDOs attacks Anonymous (Latest…last year) ○ After years of quiet silence, Anonymous roared back to action in support of Ukraine and against Russia. ○ Activist group declared “cyber war” against Russia. ○ Hacked hundreds of Russia internet providers, government websites, TV broadcasts, media agencies, energy company Gazprom, media and news agency RT. Anatomy of a typical web attack ○ ○ How does “Joe” infect websites with malware? ■ Some common ways that websites get infected are (ref [6]) ● Cross-site scripting attacks (XSS) ○ Most common form of attack since 2008. More details on this later ○ ● Cross-site scripting is a type of security vulnerability that can be found in some web applications. XSS attacks enable attackers to inject client-side scripts into web pages viewed by other users. A cross-site scripting vulnerability may be used by attackers to bypass access controls such as the same-origin policy ○ Cross-site scripting works by manipulating a vulnerable web site so that it returns malicious JavaScript to users. ● SQL injection attacks ○ These attacks maliciously alter the backend databases of websites thus making them redirect users to malware sites ○ Top 15 Attacks ■ Information leakage ■ Cross-site scripting ■ Content spoofing ■ Brute force ■ SQL Injection Authentication Attacks ○ Brute Force Attacks ■ Brute Force attack is an automated process of trial and error used to guess a person’s username, password, session ids, credit-card, cryptographic key or anything that is unique to the user and authenticates him. ■ Two types of Brute Force attacks } Normal : Uses a single username against many passwords. } Reverse: Uses many usernames against a single password. In a system with millions of accounts, the odds of finding two users with same password increases. ■ Brute-forcing is easy when websites do not implement any form of account lockout policy. ■ Example: 2009 twitter didnt have a lockout policy… hacker used brute force and unlimited number of rapid-fire login…hacked into obama ○ Insufficient Authentication ■ Happens when a website allows users to access sensitive content or functionality without proper authentication ■ For example, many times web servers have an /admin directory which is not linked to the main website. But if not properly configured for permissions, a user can view the contents by typing in the right URLs. ■ Example: ebay hacked and man ○ Weak Password Recovery Validation ■ Weak Password Recovery Validation is when a web site permits an attacker to illegally obtain, change or recover another users credentials. ■ A website is said to have a weak password recovery mechanism when a hacker can easily foil the recovery mechanism by easily guessing the ○ ○ ○ answers to the secret questions and thus recovering or changing the password of the legitimate user. ■ The following are some example of bad recovery methods. ● } Information Verification :Asking the user to supply their email address along with their phone number. Note that these are both publicly available. ● } Password Hints : Many users have a tendency to embed the password in the hint itself. Example hint : bday+favauthor which can be easily translated by someone knowing the person to 110490asimov. ● } Secret Question + Answer : Something like “In which city were you born?” for a password recovery system is easily circumventable today because most of the information is public due to social networking sites. ■ Example: Paris hilton was hacked…what is paris favorite pet name? All the celebrity phone number was posted ■ What is a good recovery method? ● Something that uses real email ● Push notification..hasn’t been compromised ● 2FA Weak Passwords ■ 123456 is the most used password (#1 for several years) ■ "Password1" "most common password used by businesses: it satisfies Microsoft Active Directory setting: 1UL letter, a number, at least nine characters. Passphrases ■ How do you fix weak passwords? ● Use passphrase ■ A passphrase is like a password but longer and more secure. It is an encryption key that you memorize. ■ } Problem: how do you come up with easy-to-memorize but very secure passphrases? Just thinking of one is incredibly hard, especially if your adversary really is capable of one trillion guesses per second. ■ } Using an entirely random sequence of characters it might be very secure, but it’s also agonizing to memorize. } ■ Solution: use Diceware: ● } Diceware is based on a word list which contains 7,776 English words — 37 pages of it printed: ● } Roll a dice 5 times to select one word at a time for your passphrase Blame Bill Burr… ■ In August 2017, the original author of NIST 2003 password guidelines, Bill Burr, regrets making the error of recommending passwords with: } ● ● Uppercase and lowercase. } Letters and Numbers. } Special characters. } A minimum of 8 characters Authorization Attacks ○ Credential / Session Prediction (Session Hijacking) ■ Credential/Session prediction is a method of hijacking or impersonating a web site user. ■ } Typically, websites associate a unique value called a session ID with a user when the authentication is done. ■ } The session ID authorizes the users' actions on the website ■ Session Id/cookies compromized Client Side Attacks ○ Cross-site Scripting (XSS) ■ Cross-site scripting (XSS) is a type of computer security vulnerability typically found in Web applications. ● Due to breaches of browser security, XSS enables attackers to inject client-side script into Web pages viewed by other users. ● A cross-site scripting vulnerability may be used by attackers to bypass access controls such as the same origin policy. ○ Cross-site Scripting (XSS) Reducing the Threat ■ The primary defense mechanism to stop XSS is contextual output encoding/escaping. ● There are several different escaping schemes that must be used depending on where the un-trusted string needs to be placed within an HTML document including HTML entity encoding, JavaScript escaping, CSS escaping, and URL (or percent) encoding ● } Most web applications that do not need to accept rich data can use escaping to largely eliminate the risk of XSS in a fairly straightforward manner. ■ Many web applications rely on session cookies for authentication between individual HTTP requests, and because client-side scripts generally have access to these cookies, simple XSS exploits can steal these cookies ● } To mitigate this particular threat many web applications tie session cookies to the IP address of the user who originally logged in, and only permit that IP to use that cookie ● } Another mitigation present in IE, Firefox, Safari, Opera, and Chrome, is an HttpOnly flag which allows a web server to set a cookie that is unavailable to client-side scripts ■ Session Cookies ● If you use httponly flag then javascript cant see it. One good protection is to use http only flag. ● Http only and secure prevents people to get you session cookies ○ ● Browser and plugin vulnerabilities ■ You need to download it unless you really need it ■ } Loosely defined, these are vulnerabilities in the client browser software or client plugins (Java/ActiveX/Flash/Acrobat etc.) that can either enable other attacks, can enable execution of arbitrary code, raise privileges, compromise users' privacy or simply crash the browser. These are specific to the particular make and version of software like Mozilla, IE etc. and cannot be generalized. ■ } These vulnerabilities have to be patched by the vendors and the web application developers cannot do much about these except be aware of the issues. ○ Clickjacking ■ ‘Clickjacking’ is a method used by malicious individuals to trick users into clicking something without them knowing what they have clicked. ■ } The idea is simple: An iframe is positioned above what looks like a clickable button on a website. ■ } This iframe is invisible to the user (opacity:0) and so the user unknowingly clicks on the iframe which may contain anything! ■ } This can be achieved through CSS alone, no JavaScript is required Injection Attacks ○ Injection Attacks occurs when an application does not properly validate user supplied input and then includes that input blindly in further processing. \ ■ } SQL/LDAP/XPATH/SOAP/JSON Injection are all types of Injection Attacks that are enabled by improper input validation. ○ SQL Injection ■ Type in sql code in login and user and gets logged in ○ Javascript Hijacking ■ JavaScript Hijacking allows an unauthorized attacker to read confidential data from a vulnerable application using a technique similar to the one commonly used to create mashups ■ an attacker can mimic the client and gain access to the confidential data the server returns. ■ Web browsers enforce the Same Origin Policy in order to protect users from malicious websites. JavaScript Hijacking allows an attacker to bypass the Same Origin Policy in the case that a Web application uses JavaScript to communicate confidential information. ■ Other users cannot access this information without knowing the user's session identifier (stored as cookie). However, if a victim visits a malicious website, the malicious site can retrieve the information using JavaScript Hijacking. ■ The dynamic script tag ■ ● ● The malicious code uses a script tag to include the JSON object in the current page. The Web browser will send up the appropriate session cookie with the request. (CSRF!! Cross Site Request Forgery) ● In other words, this request will be handled just as though it had originated from the legitimate application. ○ Search worms ■ Search worms automate finding of vulnerable web servers by sending carefully crafted queries to search engines. ■ } Such worms spread by using popular search engines to find new attack vectors. ■ } Note that this eliminates the need for worms to randomly scan hosts in the network to find targets.This also helps them evade common detection methods. ■ } These worms not only put significant load on search engines, they also evade detection mechanisms that assume random scanning ○ Bypassing the Same-Origin Policy ■ JSON and the dynamic SCRIPT tag ● JSON with Padding (JSONP) is a way to bypass the same-origin policy by using JSON in combination with the <script> tag. ● } When the <script> tag loads, the function executes, and the information returned from the server passes to it through its arguments. ● Recent Attacks ○ Worms ■ Stuxnet ● A highly sophisticated computer worm ● First discovered malware that spies and subverts industrial systems. ● } First to include Programmable Logic Controller (PLC) rootkit. ● Targeted a PLC ○ Account Breaches ■ Linkedin breach ■ Yahoo ■ Target ■ ADOBE ■ ICLOUD ■ Equifax…database of credit card users….credit cards compromised ○ Yahoo has top corporate hacks ○ Then equifax Privacy Tools ○ TOR ■ TheWeb ● ● ● ■ TOR ● ● ● ● } Surface Web - where the vast majority of people spend their internet time. All is public, all is searchable, and all is (mostly) friendly. Examples: Google, CNN,Amazon. } Invisible Web (intranet) - can only be accessed by individuals who have logins for the websites. Most of the activity is perfectly legal. Examples: NASA, the U.S. National Oceanic and Atmospheric Administration, the U.S. Patent Office and private databases like LexisNexis and Westlaw. Search engines can’t find these pages. } Dark Web - part of the deep web that is accessible only to those who use software called TOR, which stands for The Onion Router. The TOR network is a protective layer that sits between the User and the Internet. It provides an anonymous path between you and sites you visit. TOR directs Internet traffic through a free, worldwide, volunteer overlay network consisting of more than seven thousand relays to conceal a user's location and usage from anyone conducting network surveillance or traffic analysis. Onion routing is implemented by encryption in the application layer of a communication protocol stack, nested like the layers of an onion. Tor encrypts the data, including the next node destination IP address, multiple times and sends it through a virtual circuit comprising successive, random-selection Tor relays Based on a military project