¡Ejecuto Código de Internet!

Rate this content
Bookmark

¿Es prudente ejecutar código de extraños? Bueno, lo hacemos todo el tiempo y no hay vuelta atrás.

Echemos un vistazo a cómo un proyecto JavaScript podría ser hackeado y luego defenderse de los ataques de la cadena de suministro.


¿Limitar el acceso a globales para cada paquete? Claro. ¿Controlar si un paquete puede acceder a la red o al sistema de archivos? Sí, eso también. Y no más scripts de instalación o contaminación de prototipos.

Zbyszek Tenerowicz
Zbyszek Tenerowicz
20 min
23 Oct, 2023

Comments

Sign in or register to post your comment.

Video Summary and Transcription

Los paquetes npm son entradas no sanitizadas de internet que ejecutamos sin mucho escrutinio, por lo que necesitamos abordar el problema de los paquetes maliciosos. Lavamote ofrece protecciones de tiempo de ejecución proactivas para detectar y mitigar amenazas automáticamente. Lava Mode utiliza JavaScript endurecido para proporcionar aislamiento y hacer cumplir una política para el proceso de construcción de su aplicación. La charla introduce un plugin de webpack para aquellos que no quieren usar el ecosistema de browserify. Se explora el comportamiento de Lavamote, mostrando cómo restringe el acceso del paquete a ciertas propiedades. La prueba beta está abierta para recopilar comentarios y mejorar Lava Mode.

Available in English: I Run Code From the Internet!

1. Introducción a los paquetes npm

Short description:

Imagina que te doy un poco de código JavaScript y te pido que lo ejecutes en tu aplicación. ¿Lo harías sin verificarlo? Probablemente no. Pero si ofreciera ponerlo en un archivo tar.gz, algunas personas estarían más dispuestas. Eso es porque los paquetes npm son solo archivos tar.gz que extraes de internet e instalas en tu aplicación. Sin embargo, debemos reconocer que estos son entradas no saneadas de internet que ejecutamos sin mucho escrutinio. Este es el tema que discutiremos hoy.

🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐟🐜🐟🐟🐜🐟🐜🐟🐜🐟🐜🐟🐟🐜🐟🐜🐟🐜🐜🐟🐜🐟🐜🐟🐜🐟🐜🐟🐜🐟🐜🐟🐜🐟🐜🐟🐜🐟🐜🐟🐜🐟 Bueno, imagina que te doy un poco de texto y te digo que es JavaScript, que hace algo, solo ponlo en tu aplicación y ejecútalo. ¿Lo pondrías en tu aplicación y lo ejecutarías en producción para tus usuarios? Bueno, he hecho esto antes, he hecho esta pregunta y nadie quiere ejecutar mi código sin verificar qué es, pero si ofreciera ponerlo en un archivo tar.gz, ¿eso ayudaría? Y ahora, algunas personas de repente están más dispuestas a ejecutar mi código. ¿Por qué es eso? Bueno, eso es porque los paquetes npm son solo archivos tar.gz que extraes de internet, no lees su contenido y los pones en tu aplicación. Y no me malinterpretes, esto es genial, uso paquetes npm todo el tiempo, pero tenemos que admitir que estas son entradas no saneadas de internet que pones en tu aplicación y ejecutas sin mucho escrutinio, ¿verdad? Así que esto es de lo que vamos a hablar hoy.

2. Lidiando con Paquetes npm Maliciosos

Short description:

Necesitamos abordar el problema de los paquetes npm maliciosos. Herramientas reactivas como npm audit y SocketDev pueden ayudar a identificar paquetes potencialmente maliciosos, pero requieren una revisión manual. Alternativamente, Lavamote ofrece protecciones de tiempo de ejecución proactivas para tu aplicación. Imagina un escenario en el que un desarrollador instala una herramienta de construcción, y un hacker malicioso inserta código en una dependencia. Este código puede comprometer información sensible. Para mitigar este riesgo, necesitamos una aplicación que pueda detectar automáticamente estas amenazas.

Sabes, estamos instalando paquetes npm, estamos instalando muchos de ellos. Pero, ¿qué pasa si algunos de ellos no son buenos? Y con no buenos, no me refiero a paquetes malos, he publicado un montón de paquetes malos en mi tiempo. No pasó nada malo, pero me refiero a paquetes realmente maliciosos. Esta masterclass va a ser estrictamente sobre paquetes maliciosos.

¿Cómo manejamos esa situación? Bueno, hay herramientas que yo llamo herramientas reactivas. Puedes usar npm audit o cualquier cosa que pase por informes CVE, etc., y te dice que, hey, este paquete en tus dependencias que ha estado en producción durante dos meses, alguien lo revisó y encontró un problema con él. Ese paquete es realmente malicioso. ¿Es eso suficientemente bueno? Probablemente no. Luego está SocketDev. SocketDev es esta nueva cosa donde ellos usan varias formas de analizar los paquetes automáticamente y vienen con sugerencias de que, hey, este paquete, parece que algo anda mal con él. Deberías buscarlo, deberías revisar qué está haciendo este paquete. Parece arriesgado. Así que SocketDev puede decirte eso incluso horas después de que el paquete ha sido publicado, porque ya está analizado. Eso es una gran mejora. Aunque tienes que hacer la revisión tú mismo. ¿Tienes tiempo para eso? Bueno, ahora tienes que tenerlo. ¿Cuáles son las otras opciones? Bueno, puedes ser proactivo en lugar de reactivo. Y aquí es donde entra Lavamote. Voy a contarte sobre Lavamote. Lavamote es un conjunto de herramientas que juntas proporcionan protecciones para tu aplicación. Pero esas protecciones ocurren en runtime en lugar de cuando estás buscando paquetes que deseas instalar. ¿De acuerdo? Entonces, ¿cómo funciona? Bueno, vamos a repasar los conceptos básicos aquí. Así que imagina a este tipo desarrollador. Quiere instalar una herramienta de construcción para la aplicación. Lo que sucede es que una de las dependencias de desarrollo de su aplicación, en algún lugar del árbol de dependencias de esta herramienta de construcción está controlada por un hacker malicioso representado por un sombrero negro y una sudadera con capucha, obviamente. Y lo que hace el hacker, ponen un poco de código en un paquete existente que ya se confiaba en él. Ese código toma tu token de GitHub y lo envía a algún lugar. ¿Es eso agradable? Eso no es agradable. ¿Lo detectarías? Bueno, es poco probable que leas todo lo que pones en tus dependencias. Así que en su lugar, usemos una aplicación para eso.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Don't Solve Problems, Eliminate Them
React Advanced Conference 2021React Advanced Conference 2021
39 min
Don't Solve Problems, Eliminate Them
Top Content
Humans are natural problem solvers and we're good enough at it that we've survived over the centuries and become the dominant species of the planet. Because we're so good at it, we sometimes become problem seekers too–looking for problems we can solve. Those who most successfully accomplish their goals are the problem eliminators. Let's talk about the distinction between solving and eliminating problems with examples from inside and outside the coding world.
Scaling Up with Remix and Micro Frontends
Remix Conf Europe 2022Remix Conf Europe 2022
23 min
Scaling Up with Remix and Micro Frontends
Top Content
Do you have a large product built by many teams? Are you struggling to release often? Did your frontend turn into a massive unmaintainable monolith? If, like me, you’ve answered yes to any of those questions, this talk is for you! I’ll show you exactly how you can build a micro frontend architecture with Remix to solve those challenges.
Full Stack Components
Remix Conf Europe 2022Remix Conf Europe 2022
37 min
Full Stack Components
Top Content
Remix is a web framework that gives you the simple mental model of a Multi-Page App (MPA) but the power and capabilities of a Single-Page App (SPA). One of the big challenges of SPAs is network management resulting in a great deal of indirection and buggy code. This is especially noticeable in application state which Remix completely eliminates, but it's also an issue in individual components that communicate with a single-purpose backend endpoint (like a combobox search for example).
In this talk, Kent will demonstrate how Remix enables you to build complex UI components that are connected to a backend in the simplest and most powerful way you've ever seen. Leaving you time to chill with your family or whatever else you do for fun.
Jotai Atoms Are Just Functions
React Day Berlin 2022React Day Berlin 2022
22 min
Jotai Atoms Are Just Functions
Top Content
Jotai is a state management library. We have been developing it primarily for React, but it's conceptually not tied to React. It this talk, we will see how Jotai atoms work and learn about the mental model we should have. Atoms are framework-agnostic abstraction to represent states, and they are basically just functions. Understanding the atom abstraction will help designing and implementing states in your applications with Jotai
Making JavaScript on WebAssembly Fast
JSNation Live 2021JSNation Live 2021
29 min
Making JavaScript on WebAssembly Fast
Top Content
JavaScript in the browser runs many times faster than it did two decades ago. And that happened because the browser vendors spent that time working on intensive performance optimizations in their JavaScript engines.Because of this optimization work, JavaScript is now running in many places besides the browser. But there are still some environments where the JS engines can’t apply those optimizations in the right way to make things fast.We’re working to solve this, beginning a whole new wave of JavaScript optimization work. We’re improving JavaScript performance for entirely different environments, where different rules apply. And this is possible because of WebAssembly. In this talk, I'll explain how this all works and what's coming next.
Debugging JS
React Summit 2023React Summit 2023
24 min
Debugging JS
Top Content
As developers, we spend much of our time debugging apps - often code we didn't even write. Sadly, few developers have ever been taught how to approach debugging - it's something most of us learn through painful experience.  The good news is you _can_ learn how to debug effectively, and there's several key techniques and tools you can use for debugging JS and React apps.

Workshops on related topic

React, TypeScript, and TDD
React Advanced Conference 2021React Advanced Conference 2021
174 min
React, TypeScript, and TDD
Top Content
Featured WorkshopFree
Paul Everitt
Paul Everitt
ReactJS is wildly popular and thus wildly supported. TypeScript is increasingly popular, and thus increasingly supported.

The two together? Not as much. Given that they both change quickly, it's hard to find accurate learning materials.

React+TypeScript, with JetBrains IDEs? That three-part combination is the topic of this series. We'll show a little about a lot. Meaning, the key steps to getting productive, in the IDE, for React projects using TypeScript. Along the way we'll show test-driven development and emphasize tips-and-tricks in the IDE.
Web3 Workshop - Building Your First Dapp
React Advanced Conference 2021React Advanced Conference 2021
145 min
Web3 Workshop - Building Your First Dapp
Top Content
Featured WorkshopFree
Nader Dabit
Nader Dabit
In this workshop, you'll learn how to build your first full stack dapp on the Ethereum blockchain, reading and writing data to the network, and connecting a front end application to the contract you've deployed. By the end of the workshop, you'll understand how to set up a full stack development environment, run a local node, and interact with any smart contract using React, HardHat, and Ethers.js.
Remix Fundamentals
React Summit 2022React Summit 2022
136 min
Remix Fundamentals
Top Content
Featured WorkshopFree
Kent C. Dodds
Kent C. Dodds
Building modern web applications is riddled with complexity And that's only if you bother to deal with the problems
Tired of wiring up onSubmit to backend APIs and making sure your client-side cache stays up-to-date? Wouldn't it be cool to be able to use the global nature of CSS to your benefit, rather than find tools or conventions to avoid or work around it? And how would you like nested layouts with intelligent and performance optimized data management that just works™?
Remix solves some of these problems, and completely eliminates the rest. You don't even have to think about server cache management or global CSS namespace clashes. It's not that Remix has APIs to avoid these problems, they simply don't exist when you're using Remix. Oh, and you don't need that huge complex graphql client when you're using Remix. They've got you covered. Ready to build faster apps faster?
At the end of this workshop, you'll know how to:- Create Remix Routes- Style Remix applications- Load data in Remix loaders- Mutate data with forms and actions
Vue3: Modern Frontend App Development
Vue.js London Live 2021Vue.js London Live 2021
169 min
Vue3: Modern Frontend App Development
Top Content
Featured WorkshopFree
Mikhail Kuznetcov
Mikhail Kuznetcov
The Vue3 has been released in mid-2020. Besides many improvements and optimizations, the main feature of Vue3 brings is the Composition API – a new way to write and reuse reactive code. Let's learn more about how to use Composition API efficiently.

Besides core Vue3 features we'll explain examples of how to use popular libraries with Vue3.

Table of contents:
- Introduction to Vue3
- Composition API
- Core libraries
- Vue3 ecosystem

Prerequisites:
IDE of choice (Inellij or VSC) installed
Nodejs + NPM
Developing Dynamic Blogs with SvelteKit & Storyblok: A Hands-on Workshop
JSNation 2023JSNation 2023
174 min
Developing Dynamic Blogs with SvelteKit & Storyblok: A Hands-on Workshop
Top Content
Featured WorkshopFree
Alba Silvente Fuentes
Roberto Butti
2 authors
This SvelteKit workshop explores the integration of 3rd party services, such as Storyblok, in a SvelteKit project. Participants will learn how to create a SvelteKit project, leverage Svelte components, and connect to external APIs. The workshop covers important concepts including SSR, CSR, static site generation, and deploying the application using adapters. By the end of the workshop, attendees will have a solid understanding of building SvelteKit applications with API integrations and be prepared for deployment.
Back to the Roots With Remix
React Summit 2023React Summit 2023
106 min
Back to the Roots With Remix
Featured Workshop
Alex Korzhikov
Pavlik Kiselev
2 authors
The modern web would be different without rich client-side applications supported by powerful frameworks: React, Angular, Vue, Lit, and many others. These frameworks rely on client-side JavaScript, which is their core. However, there are other approaches to rendering. One of them (quite old, by the way) is server-side rendering entirely without JavaScript. Let's find out if this is a good idea and how Remix can help us with it?
Prerequisites- Good understanding of JavaScript or TypeScript- It would help to have experience with React, Redux, Node.js and writing FrontEnd and BackEnd applications- Preinstall Node.js, npm- We prefer to use VSCode, but also cloud IDEs such as codesandbox (other IDEs are also ok)