Página Inicial>Recursos de construção de sites>Dados do site
Baixar

Observação

? Experimente o Projeto mais avançado WebsAfCompiler para obter uma proteção confiável do seu site contra a cópia ou qualquer análise do código -fonte!

? Guarda HTML

Quando você adiciona o módulo estático html-guard.js ele ofuscará automaticamente o layout da página. Proteja seu aplicativo/site da web.

? Possibilita o uso do carregamento dinâmico de recursos usando funções internas, o que impede o download estático de estilos e scripts.

Resumidamente sobre as funções do HTML Guard:

  • ? OBFUSCAÇÃO DE HTML (AUTO)
  • ? A adição dinâmica de CSS/JS (requer configuração)
  • ? Atributos protegidos via prefixo _
  • ? Bloqueando os devtools em qualquer navegador
  • ? Bloqueie o menu de contexto
  • ? Bloco arrastando de uma página
  • ? Bloquear a seleção de texto em uma página
  • ? Bloco de saída do console

? Adicione -o ao seu site 

 <!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 adicionando proteção (recomendado)

Evite usar <link> . Carregue dinamicamente os arquivos .css e .js! Este método possibilita ignorar downloaders de sites como o web2zip.com. A adição dinâmica dos recursos do site torna impossível copiá -los durante a análise estática. E, nesse caso, quando o HTML Guard for removido das dependências, o conteúdo do aplicativo da Web não poderá carregar por razões óbvias. 

 < 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 >

? Proteção de atributos dinâmicos (recomendado)

Adicione _ prefixo antes de qualquer atributo para que src se torne _src . O HTML Guard carregará automaticamente este elemento

Este método de proteção tem 2 vantagens:

  • Imagens e outros recursos não serão carregados através de um download estático do site
  • Sem atributos de guarda html não carregarão

Por exemplo: 

 < img _src =" image.jpg " />

Block Dev-Tools (recomendado)

Esta função bloqueia qualquer tentativa de abrir ferramentas de desenvolvedor e, se detectado, recarregue a página. 

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

Desative o menu de contexto

Bloqueia a abertura do menu de contexto padrão. 

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

Desative o arrasto

O usuário não poderá arrastar elementos do site. 

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

Desativar a seleção

Remove a capacidade de usar a seleção. 

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

Desative a saída do console

Isso será útil para ocultar logs de depuração do console do navegador. Hooks funções como log , debug , warn , error , dir , dirxml , assert , table que os retornam nulos 

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

? Exemplo de uso 

 < 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 >

Observação

Este módulo destina -se mais à proteção de aplicativos da Web do que para sites simples. Se você estiver desenvolvendo aplicativos usando estruturas como Reactjs, Vuejs (e assim por diante), este projeto é perfeito para você

Expandir
Informações adicionais
Aplicativos Relacionados
Recomendado para você
Informações Relacionadas Todos