Inicio>Recursos para la creación de sitios web>Datos del sitio web
Descargar

Nota

? ¡Pruebe el proyecto más avanzado WebSafeCompiler para obtener una protección confiable de su sitio para copiar o cualquier análisis del código fuente!

? Guardia html

Cuando agrega el módulo estático html-guard.js ofuscará automáticamente el diseño de la página. Proteja su aplicación/sitio web.

? Permite utilizar la carga dinámica de recursos utilizando funciones incorporadas, lo que evita la descarga estática de estilos y scripts.

Brevemente sobre las funciones de HTML Guard:

  • ? Ofusión de HTML (Auto)
  • ? Adición dinámica de CSS/JS (requiere configuración)
  • ? Atributos protegidos a través del prefijo _
  • ? Bloquear DevTools en cualquier navegador
  • ? Bloquear el menú contextual
  • ? Bloquear arrastrando desde una página
  • ? Bloquear la selección de texto en una página
  • ? Bloquear la salida de la consola

? Agréguelo a su sitio 

 <!DOCTYPE  html >
< html >
    < head >
        <!-- Site protection ON! -->
        < script src =" html-guard.min.js " > </ script >
        < script >
            // Configure protection & resource loading
        </ script >
    </ head >

    < body >
    </ body >
</ html >

✅ Configurar

? Estilo seguro/script que agrega protección (recomendado)

Evite usar <link> . ¡Cargue dinámicamente archivos .css y .js! Este método permite evitar los descargadores de sitios como Web2zip.com. La adición dinámica de los recursos del sitio hace que sea imposible copiarlos durante el análisis estático. Y en este caso, cuando se elimina la protección HTML de las dependencias, el contenido de la aplicación web no podrá cargarse por razones obvias. 

 < script >
    // ADDING: Add link to 'style.css'
    HtmlGuard . loader . loadStyleByRef ( "styles.css" ) ;
</ script > 
 < script >
    // ADDING: Add script "test.js" to head
    HtmlGuard . loader . loadScriptBySrc ( "test.js" ) ;

    //  OR

    // ADDING: Add script "test.js" to head after document loading
    HtmlGuard . loader . loadScriptBySrc_ContentLoaded ( "test.js" ) ;
</ script >

? Protección de atributos dinámicos (recomendado)

Agregue _ prefijo antes de cualquier atributo para que src se convierta en _src . HTML Guard cargará automáticamente este elemento

Este método de protección tiene 2 ventajas:

  • Las imágenes y otros recursos no se cargarán a través de una descarga estática del sitio.
  • Sin los atributos de guardia HTML no se cargarán

Por ejemplo: 

 < img _src =" image.jpg " />

Bloquear Toolas de desarrollo (recomendado)

Esta función bloquea cualquier intento de abrir herramientas de desarrollador y, si se detecta, recarga la página. 

 < script >
    // PROTECTION: Disable DevTools
    HtmlGuard . protections . antiDevTools ( ) ;
</ script >

Deshabilitar el menú contextual

Bloquea la apertura del menú contextual estándar. 

 < script >
    // PROTECTION: Disable context menu
    HtmlGuard . protections . blockContextMenu ( ) ;
</ script >

Desactivar arrastre

El usuario no podrá arrastrar elementos desde el sitio. 

 < script >
    // PROTECTION: Disable drag
    HtmlGuard . protections . blockDrag ( ) ;
</ script >

Deshabilitar la selección

Elimina la capacidad de usar la selección. 

 < script >
    // PROTECTION: Disable selection
    HtmlGuard . protections . blockSelection ( ) ;
</ script >

Desactivar la salida de la consola

Esto será útil para ocultar registros de depuración de la consola del navegador. Hooks Funciones como log , debug , warn , error , dir , dirxml , assert , table haciéndolos devolver nulo 

 < script >
    // PROTECTION: Disable console output
    HtmlGuard . protections . blockConsoleOutput ( ) ;
</ script >

? Ejemplo de usar 

 < head >
<!-- Example of HTML-Guard protection -->

<!DOCTYPE html >
< html >

< head >
    < script src =" ../html-guard.js " > </ script >
    < script >
        // PROTECTION: Disable DevTools
        HtmlGuard . protections . antiDevTools ( ) ;

        // PROTECTION: Disable context menu
        HtmlGuard . protections . blockContextMenu ( ) ;

        // PROTECTION: Disable drag
        HtmlGuard . protections . blockDrag ( ) ;

        // PROTECTION: Disable selection
        HtmlGuard . protections . blockSelection ( ) ;

        // PROTECTION: Disable console output
        HtmlGuard . protections . blockConsoleOutput ( ) ;

        // ADDING: Add link to 'style.css'
        HtmlGuard . loader . loadStyleByRef ( "styles.css" ) ;

        // ADDING: Run 'test.js' script
        HtmlGuard . loader . loadScriptBySrc ( "test.js" ) ;
    </ script >
</ head >

< body >
    < div >
        <!-- '_id' is protected variant of 'id' -->
        < p > Hello, world! Time: < span _id =" time " > </ span > </ p >

        <!-- '_src' is protected variant of 'src' -->
        < img _src =" test.jpg " _alt =" Test image " />

    </ div >

    < a _href =" https://github.com/DosX-dev/HTML-Guard " > HTML Guard in GitHub! </ a >

</ body >

</ html >

Nota

Este módulo está destinado a proteger las aplicaciones web que para sitios simples. Si está desarrollando aplicaciones utilizando marcos como reactjs, vuejs (y así sucesivamente), entonces este proyecto es perfecto para usted

Expandir
Información adicional
Aplicaciones relacionadas
Recomendado para ti
Información relacionada Todo