Alguns sites começaram a abusar de um recurso super interessante do JavaScript para acabar com uma das características mais importantes da Internet: a capacidade de copiar/colar.

O tratamento dos clipboard events (oncut, oncopy e onpaste) deveria servir para permitir que os programadores façam coisas legais quando você copia/cola um texto (por exemplo, um processador de textos online pode inserir/remover formatação), mas tenho visto cada vez mais ele ser usado para adicionar uma mensagem de copyright no final de um texto copiado, impedir usuários leigos de copiarem textos na web e evitar que se cole coisas que você copiou em formulários.

O que mais me incomoda (e que me levou a escrever esta postagem) é que, hoje, quem copia um trecho de uma reportagem da Folha (para guardar, compartilhar numa rede social ou o que quer que seja) acaba colando:

Para compartilhar esse conteúdo, por favor utilize o link http://www1.folha.uol.com.br/fsp/bla-bla-bla ou as ferramentas oferecidas na página. Textos, fotos, artes e vídeos da Folha estão protegidos pela legislação brasileira sobre direito autoral. Não reproduza o conteúdo do jornal em qualquer meio de comunicação, eletrônico ou impresso, sem autorização da Folhapress (pesquisa@folhapress.com.br). As regras têm como objetivo proteger o investimento que a Folha faz na qualidade de seu jornalismo. Se precisa copiar trecho de texto da Folha para uso privado, por favor logue-se como assinante ou cadastrado.

Não é incrível (e sintomático) que o grupo que gerencia o portal mais importante da Internet no Brasil (UOL) tenha uma concepção tão atrasada da rede? Ok, não dá nem pra dizer que isso nos surpreende depois da censura da Falha e do paywall.

Sem mais delongas: isso merece ser hackeado. Neste post, proponho algumas soluções simples para você poder voltar a copiar e colar no seu navegador como sempre fez. Minha preferida, como sempre, é a última.

Solução trivial para quem usa Linux

Antes de sugerir soluções de verdade, convém observar que quem usa Linux (X11) pode copiar selecionando um texto (sem apertar Ctrl+C ou qualquer outra combinação esdrúxula de teclas) e colar apertando o botão do meio do mouse. Quando se copia/cola dessa forma, o navegador não emite os temidos eventos oncopy/onpaste (ou seja, tudo funciona normalmente).

Rodolfo Mohr também observou que você pode copiar um texto selecionando-o, clicando com a tecla direita na seleção e em “Pesquisar no Google”. Uma aba vai abrir com a pesquisa no Google e você pode copiar o texto lá. É um hack válido, embora incômodo.

Somente Firefox: usando about:config

Se você usa Firefox, pode desabilitar os clipboard events digitando, na barra de endereços, em about:config. Talvez ele diga que é perigoso e peça para você clicar num botão dizendo que sabe o que está fazendo. Pode confiar. Em seguida, procure a chave dom.event.clipboardevents.enabled e clique duas vezes nela para mudar seu valor para false. Reiniciando o navegador, o recurso copiar/colar estará funcionando normalmente (ou talvez nem precise reiniciá-lo).

Extensões (para Firefox, Chrome e Opera)

Não tem o que explicar. Simplesmente clique no nome do seu navegador e instale: Firefox, Chrome, Opera.

Editado em 01/04/2014, 22:30: A extensão que eu havia colocado para Chrome só desabilita o tratamento de eventos onpaste em formulários. Se você conhecer alguma extensão similar a do Firefox ou a do Opera, me avise pelos comentários.

Desabilitando sob demanda via JavaScript

É muito importante ter em mente que aplicações web como processadores de texto podem usar os eventos oncut/oncopy/onpaste para coisas úteis. Por isso, é desejável desabilitar esses eventos somente em sites específicos.

Não encontrei nenhuma extensão que faça isso, mas um código simples em JavaScript para recuperar o comportamento padrão dos eventos em um determinado site (testei no Firefox e no Chrome) é:

all = document.querySelectorAll("*");
fn = function (e) {
  e.stopPropagation();
  return true;
};
for (var i = 0; i < all.length; i++) {
  all[i].oncut = fn;
  all[i].oncopy = fn;
  all[i].onpaste = fn;
}

Se digitarmos isso no console (Shift+Ctrl+J), as funções copiar/colar devem voltar a funcionar.

Userscript

A solução anterior nos permite criar um userscript para desabilitar o tratamento dos eventos apenas no site da Folha:

// ==UserScript==
// @name Permite copiar textos da Folha
// @include http://*.folha.uol.com.br/*
// ==/UserScript==

window.onload = function () {
  all = document.querySelectorAll("*");
  fn = function (e) {
    e.stopPropagation();
    return true;
  };
  for (var i = 0; i < all.length; i++) {
    all[i].oncut = fn;
    all[i].oncopy = fn;
    all[i].onpaste = fn;
  }
};

Portanto, se você quiser copiar do site da Folha sem preocupações (e sem desabilitar os eventos em outros sites), pode instalar as extensões GreaseMonkey (Firefox) ou TamperMonkey (Chrome), e então esse userscript clicando neste link: falha.user.js.

Bookmarlet

Acho o método acima (do userscript) o melhor para copiar da Folha. No entanto, é conveniente ter um método mais genérico. Por isso, criei um bookmarklet, isso é, um pequeno script que podemos executar clicando num botão na barra de favoritos (neste caso, para restaurar o comportamento padrão das funções copiar/colar).

Aqui está ele: Restaurar copiar/colar

Para instalar, arraste esse link para sua barra de favoritos. Para usar, clique sempre que precisar copiar um texto e então copie normalmente.

Viva a Internet!

Depois de ouvir esse improviso do André Mehmari sobre Odeon e Choro pro Zé, fiquei com vontade de encontrar a partitura desse belo choro do Guinga. Porém, descobri que infelizmente é extremamente difícil encontrar o songbook “A música de Guinga”.

Procurando na rede, encontrei um torrent com um PDF com qualidade ruim e um documento do Scribd com qualidade boa. O problema é que o Scribd tem um paywall para não deixar as pessoas baixarem ou lerem os documentos que seus usuários colocam lá:

Percebi que ele passa todas as imagens corretamente para o navegador e só no lado do cliente muda a opacidade das páginas para elas ficarem semitransparentes. Então escrevi um userscript bem simples (usando jQuery por comodidade) para o Greasemonkey (uma dessas extensões indispensáveis do Firefox) para recuperar a opacidade das páginas do texto e, se necessário, remover essa mensagem “You’re reading a free preview”.

// ==UserScript==
// @name Suppress Scribd Paywall
// @include http://*.scribd.com/doc/*
// @require http://code.jquery.com/jquery-2.0.3.min.js
// ==/UserScript==

(function ($) {
  $(document).ready(function () {
    window.setInterval(function () {
      $(".absimg").css("opacity", "1");
    }, 1000);
    $(".autogen_class_views_read_show_page_blur_promo").on("click", function (
      e
    ) {
      $(this).hide();
    });
  });
})(jQuery);

Para usar, é só instalar o Greasemonkey no Firefox e depois baixar o userscript scribd.user.js. Resultado:

TL;DR: Instale o Adblock Plus em seu navegador, entre nas suas opções, peça para adicionar seu próprio filtro e adicione o filtro: *paywall*. Você agora deve ser capaz de ler notícias de Folha, Estadão e Globo sem cadastro. Caso tenha interesse em saber o caminho que levou a solução até aqui, continue lendo o post.

A mídia tradicional mudou a forma como publica na internet. A regra agora é que sem cadastro você só pode acessar um determinado número (pequeno) de notícias. O nome do sistema é paywall. Ao chegar no limite, você recebe mensagens como as seguintes:

No caso da Folha, só o cadastro pago dá acesso ilimitado. Nos outros, aparentemente um cadastro gratuito é suficiente. De qualquer forma, por que dar seus dados para esses sites saberem quem você é, como navega e o que gosta de ler? Para quem esses sites vão dar essas informações?

Para além da preocupação com privacidade e anonimato, esse sistema funciona como um bloqueio para que as pessoas não possam ler e disseminar as notícias da internet. Torna a circulação de informações mais difícil e o espaço internético mais privado e menos democrático. Por isso, compartilho aqui um pouco sobre o funcionamento do paywall e algumas formas de contorná-lo.

Os sites não querem que buscadores tenham dificuldade de acessar e indexar seu conteúdo. Tampouco querem bloquear endereços de IP, já que a quantidade de pessoas que usa internet via NAT (compartilhando o mesmo endereço de IP com outras pessoas numa mesma rede) é enorme. Por isso, eles fazem todo o controle não no computador deles (servidor), mas no seu computador (cliente).

Para fazer isso, eles contam com a ajuda do seu navegador. Eles mandam a página sempre da mesma forma e o seu navegador é que faz o trabalho sujo. Roda um programa escrito em JavaScript para olhar pros dados que ele mesmo já tinha registrado anteriormente (os chamados cookies). Baseado nesses dados, redireciona você para outra página (no caso de Folha e Estadão, simplesmente coloca um fundo preto semi-transparente em cima do conteúdo do site).

Isso torna não só possível, como trivial contornar o bloqueio. Basta dizer para o seu navegador não registrar cookies, desativar a execução de JavaScript ou rodar outro programa para anular a ação do programa da grande mídia. Abaixo vou mostrar diversas formas de fazer isso usando o Mozilla Firefox, mas em outros navegadores há formas semelhantes de fazer o mesmo. Como sempre, a última forma é a que eu considero melhor.

Usar janela de navegação privada

A forma mais simples de acessar um conteúdo bloqueado é acessar a página numa janela de navegação privada. Para abrir tal janela, basta usar o atalho Ctrl+Shift+P no Firefox (ou Ctrl+Shift+N no Chromium). Como essa janela não vai usar os cookies que seu navegador tem registrado na janela principal, você vai conseguir acessar o conteúdo proibido normalmente (como se nunca tivesse acessado nenhuma notícia antes). Há pessoas que usam só o modo de navegação privada o tempo todo (uma opção razoável para evitar rastreamento).

Remover cookies individuais

No Firefox, você pode usar Editar → Preferências → Privacidade → Remover cookies individuais para remover cookies registrados no seu computador. Se você remover todos, vai sair automaticamente de todos os sites onde está logado. Como seu objetivo é contornar o paywall, você pode remover cookies somente dos sites que deseja acessar (no caso, procurar globo, folha e estadao na barra de busca da remoção de cookies).

Desativar JavaScript

É possível desativar a execução de programas enviados pelos sites que você acessa no Firefox desmarcando a caixa Permitir JavaScript no menu Editar → Preferências → Conteúdo do Firefox. Dessa forma, você vai perder muitas funcionalidades dos sites, mas navegar mais rápido e não ter que encarar paywall algum.

A extensão NoScript do Firefox torna mais fácil ativar/desativar scripts de determinados domínios.

Desativar CSS

Se você não se importar com leiaute e diagramação da página, Exibir → Estilos da página → Nenhum estilo vai fazer tudo ficar feio, mas o texto legível.

Usar extensão Web Developer

Instalar a extensão Web Developer no Firefox torna ainda mais simples remover cookies de um determinado domínio e desativar JavaScript ou CSS (aparece uma barra embaixo da barra de endereço com botões pra executar essas ações).

Remover lightbox

No caso de Folha e Estadão (que sobrepõe um fundo preto semi-transparente e uma lightbox na página ao invés de redirecionar você para outra página como faz o Globo), é possível fazer a lightbox desaparecer (sem mexer nos cookies ou no JavaScript) usando o modo de inspeção (Ctrl+Shift+I), selecionando os elementos que quer remover e adicionando o CSS display:none; neles. Por meio de um userscript do Greasemonkey seria possível automatizar isso.

Forma definitiva (minha preferida): filtros no Adblock Plus

Adblock Plus é uma extensão do Firefox extremamente eficiente para bloquear publicidades e scripts não desejados. Os seguintes filtros bloqueiam os scripts de paywall de Folha, Estadão e O Globo:

||paywall.estadao.com.br^
||estadao.com.br/paywall/*
||www1.folha.uol.com.br/folha/furniture/paywall/*
||static.folha.com.br/paywall/*
||oglobo.globo.com/servicos/inc/payWall.Conteudo.js
||oglobo.globo.com/plataforma/js/*/minificados/paywall/registraConteudosLidos.js

(Depois de escrever, fiquei pensando que talvez seja razoável bloquear simplesmente paywall de uma vez.)

Para usar, basta ter instalado o Adblock Plus, copiar essas regras (todas juntas) e colá-las em Ferramentas → Adblock Plus → Preferências de filtros → Filtros personalizados.

I wrote a small WordPress plugin to prevent users from publishing a post without excerpt or thumbnail, or with a too big excerpt, or with a too small thumbnail, or with an uppercase-only title.

This screenshot is showing some of the messages the plugin displays in portuguese.

For some of my websites it’s important to require the editors to fix some stuff before publishing something, and it looks like this is a useful feature for other people as well. There is even a Require Thumbnail plugin in the WordPress Plugin Directory that seems to do one of the things I’ve just implemented.

The plugin works with two different types of requirements: ths first generates errors (i.e., you can’t publish if you don’t fix it) and the second generates warnings (i.e., you will receive a message but you can proceed to publish if you really want to do that).

I thought of not releasing the plugin (because it’s written in Portuguese and you don’t have a cool interface to decide what’s required yet), but in a fashion of overstated bazaar I decided to push the code anyway (without putting in the WordPress plugin directory, of course) so that other people can collaborate if they want to. Take a look :)

Github project home page: https://github.com/tmadeira/antiforget

Git repository to clone: https://github.com/tmadeira/antiforget.git

Code (PHP): https://github.com/tmadeira/antiforget/blob/master/antiforget.php

Download: antiforget.zip (this is pre-alpha: I provide no warranty!)

O WordPress é um dos meus programas preferidos e um dos que mais consome as madrugadas já faz alguns anos. Escrevi inúmeros temas, alguns plugins (um único genérico o suficiente para ser público) e já modifiquei algumas partes do código (embora hoje seja raro isso ser necessário).

Acho muito simples e me divirto ao programar em PHP para a web (talvez porque eu faça isso há uns dez anos). Gosto muito da forma como o WordPress é escrito e, com efeito, seu lema é Code is poetry — Código é poesia. Sua documentação e seu código são muito didáticos e foram, assim como seus temas e as tabelas no banco de dados, evoluindo de acordo com o tempo: as atualizações sempre têm novas features e formas mais genéricas e mais elegantes de fazer as coisas.

O WordPress é um software livre usado por mais de 15% da web (um número incrível!) e tem uma comunidade que produz várias extensões (temas e plugins). Gosto tanto dele que certa vez (no final de 2007) escrevi um plugin só para ganhar uma camiseta (que é tamanho G e ainda assim uso de vez em quando).

Propaganda e blogagem a parte, me deparei com um problema interessante em um dos sites que administro com ele no último fim de semana (a gente sempre se depara com problemas interessantes no WordPress também): dado uma categoria com várias subcategorias, gostaria de mostrar um link para o último post de cada uma de suas subcategorias na página inicial.

Uma solução trivial seria fazer uma query pedindo os filhos de uma dada categoria (usando a tabela wp_term_taxonomy) e uma query por categoria para descobrir seu último post (usando as tabelas wp_posts e wp_term_relationships). Suponha (até o final desse post) que a categoria-mãe de todas as categorias que eu quero mostrar na página seja a de ID 33. Então, essa solução seria algo como:

<?php
$query = mysql_query("SELECT term_id FROM wp_term_taxonomy
                      WHERE parent = 33 AND taxonomy = 'category'");
while (list($cid) = mysql_fetch_row($query)) {
    $posts_query = mysql_query("SELECT p.ID, p.post_name, p.post_title
                                FROM wp_posts AS p,
                                     wp_term_relationships AS r
                                WHERE p.ID = r.object_ID AND r.term_taxonomy_id = '$cid'
                                ORDER BY p.post_date DESC
                                LIMIT 1");
    if (mysql_num_rows($posts_query)) {
        list($id, $permalink, $title) = mysql_fetch_row($posts_query);
        // Faça o que quiser com o post aqui
    } else {
        echo "A categoria $cid não tem posts.\n";
    }
}
?>

Não deve ser difícil de entender, mas dá pra resolver de forma ainda mais simples que essa. O WordPress é fantástico e usar as funções dele próprio é bem mais simples, genérico e resolve o problema. A função get_categories aceita um monte de parâmetros, mas só precisamos do child_of:

<?php
foreach (get_categories('child_of=33') as $cat) {
    list($post) = get_posts("numberposts=1&category={$cat->term_id}");
    // Faça o que quiser com o post aqui
}
?>

(quem entrou no post procurando a solução pro problema pode parar por aqui se não for nerd)

Porém, eu queria resolver o problema com uma única query. Achei que seria mais elegante resolver o problema todo no banco de dados sem escrever em PHP e achei que poderia ficar mais rápido. Acho que não ficou mais elegante e não faço ideia se fica mais rápido (fiquei com a impressão de que seja pior porque faço JOIN de quatro tabelas enormes), nem acho que tenha volume de dados (ainda) no site em que implementei isso pra realmente me preocupar, mas me diverti fazendo. Então segue o resultado:

SELECT p.ID AS id,
       CASE WHEN (p.post_date > DATE_SUB(CURDATE(), INTERVAL 1 MONTH)) THEN
           p.post_title
       ELSE
           ''
       END AS title,
       GROUP_CONCAT(c.slug) AS cat
FROM wp_posts AS p
INNER JOIN
    (
        SELECT MAX(p.post_date) AS post_date, c.term_ID AS cid, COUNT(p.ID) AS count FROM
            wp_posts AS p,
            wp_term_relationships AS r,
            wp_terms AS c
        WHERE
            p.ID = r.object_ID AND
            c.term_ID = r.term_taxonomy_ID AND
            p.post_status = 'publish' AND
            p.post_type = 'post'
        GROUP BY c.term_id
    ) AS last ON p.post_date = last.post_date
INNER JOIN wp_term_relationships AS r ON p.ID = r.object_ID
INNER JOIN wp_terms AS c ON c.term_id = r.term_taxonomy_ID
INNER JOIN wp_term_taxonomy AS t ON t.term_id = r.term_taxonomy_ID
WHERE
    c.term_id = last.cid
    AND t.parent = 33
    AND t.taxonomy = 'category'
    AND p.post_status = 'publish'
    AND p.post_type = 'post'
    # AND last.count >= 3
GROUP BY p.ID ORDER BY p.post_date DESC, last.count DESC;

A query (que na verdade é duas) ordena o resultado por data, retorna o título vazio caso o post seja de mais de um mês atrás, junta as categorias (separando-as por vírgula) se um mesmo post for o último de mais de uma categoria e neste caso ordena as categorias por ordem decrescente de número de posts na mesma.

(A parte comentada seria para caso eu só quisesse mostrar o último post de categorias com três ou mais posts.)

Usei o resultado da query da seguinte forma:

<?php
$q = mysql_query($query); // $query é a string com aquele SQLzão
$print_final_li = false;
$first = true;
while ($a = mysql_fetch_array($q, MYSQL_ASSOC)) {
    echo "\t\t<li>\n";
      $permalink = get_permalink($a["id"]);
      $title = $a["title"];
      if ($title == "") {
          $print_final_li = true;
          echo "Veja também: ";
      } else if ($first == true) {
          echo "<a href="$permalink" title="$title">";
          echo get_the_post_thumbnail($a["id"], "home-thumbnail",
                                      Array("title" => get_the_title()));
          echo "</a> ";
          $first = false;
      }
      $cats = explode(",", $a["cat"]);
      foreach ($cats as $low) {
          $up = strtoupper($low);
          echo "<a class="cat" href="http://$low.juntos.org.br/"
                   title="Juntos! $up">$up</a> ";
      }
      if ($print_final_li) break;
      echo "<a class="post" href="$permalink" title="$title">$title</a>";
      echo "</li>\n";
}
while ($a = mysql_fetch_array($q, MYSQL_ASSOC)) {
    $cats = explode(",", $a["cat"]);
    foreach ($cats as $low) {
        $up = strtoupper($low);
        echo "<a class="cat" href="http://$low.juntos.org.br/"
                 title="Juntos! $up">$up</a> ";
    }
}
if ($print_final_li) {
    echo "</li>\n";
}
?>

(e se você quiser vê-lo em prática, entre em juntos.org.br e procure por “Juntos pelo Brasil”)

Não ficou bonitinho? Se por um lado gostei da solução, por outro fiquei imaginando que deva ser um SQL tremendamente ingênuo e digno da minha inexperiência com grandes bancos de dados. O que você acha? Consegue pensar numa forma mais simples, mais eficiente e mais elegante de resolver o mesmo problema? Ou ao menos sem subqueries?

Acho que as relações necessárias já ficaram explícitas na query que eu escrevi, mas segue o diagrama do banco de dados do WordPress pra quem precisar: