Quando os desenvolvedores pensam em segurança em seus aplicativos Web, raramente a segurança de imagens está no topo da lista; não porque proteger a mídia não seja importante, é claro, mas porque a segurança de mídia nem sempre é fácil. Alguns até dirão que a segurança da mídia não é importante, mas se você quiser manter as informações do proprietário da mídia seguras, reduzir a largura de banda e os hotlinks ou simplesmente quiser o crédito pela mídia, é extremamente importante tomar medidas para protegê-la da melhor forma possível.
Cloudinary reconhece que a mídia de seus usuários é importante e oferece vários recursos para ajudar os desenvolvedores a manter as imagens seguras, com marca d’água e usadas somente como pretendido. Vamos dar uma olhada!
Marca d’água básica
A técnica de marca d’água tem sido usada por fotógrafos e sites de banco de imagens desde os primórdios da Internet. Existem algumas estratégias diferentes para marca d’águae tudo isso o Cloudinary permite que o senhor controle:
- Marca d’água em um determinado ponto de uma imagem
- Marca d’água repetida com opacidade de 50% em toda a imagem
- Texto como marca d’água
A implementação de cada uma dessas técnicas de marca d’água é fácil com o Cloudinary:
Marca d’água na imagem
https://.../l_logo,g_south_east,w_100,x_20,y_20,o_60/v1486595264/ringo.jpg
Marca d’água repetida
https://.../l_logo,w_100,x_20,y_20,o_20,fl_relative.tiled/v1486595264/ringo.jpg
Marca d’água de texto
https://.../l_logo,w_100,x_20,y_20,o_20,fl_relative.tiled/v1486595264/ringo.jpg
Marca d’água invisível
Meus amigos da Cloudinary me mostraram uma técnica incrível de “marca d’água invisível” usando baixa opacidade no canal azul, que é difícil de ser vista pelo olho humano. Considere a seguinte imagem:
<img src="https://res.cloudinary.com/demo-robert/image/upload/l_text:arial_30_bold_stroke:David%20Walsh%20Blog,bo_15px_solid_rgb:000000,a_45,e_screen,o_7,co_rgb:0000FF,fl_tiled/q_90/234_72_z_qpwsct.jpg">
O senhor provavelmente não consegue perceber, mas a imagem acima tem marca d’água. Se o senhor fizer upload dessa imagem para sua conta do Cloudinary e aplicar uma transformação de canal azul, verá a marca d’água com toda a clareza:
<img src="https://res.cloudinary.com/demo-robert/image/fetch/e_green:-100/e_red:-100/e_auto_contrast/https://res.cloudinary.com/demo-robert/image/upload/l_text:arial_30_bold_stroke:David%20Walsh%20Blog,bo_15px_solid_rgb:000000,a_45,e_screen,o_7,co_rgb:0000FF,fl_tiled/q_90/234_72_z_qpwsct.jpg">
Esse efeito é incrível e uma ótima maneira de marcar suas imagens sem adicionar marcas d’água tradicionais que causam distração. Se alguém tirar uma captura de tela da sua imagem, a técnica azul ainda verá o texto da marca d’água!
Autenticação baseada em token ou cookie para transformações
Proteger o conteúdo para um visualizador por IP ou token é comum, muitas vezes para fornecer visualizações prévias do conteúdo antes que ele seja publicado. Seja qual for o seu motivo para proteger o conteúdo por ID ou token, o Cloudinary permite que o senhor limite a renderização de imagens por IP de forma incrivelmente fácil:
// Only allow users at 192.168.0.1 to see the image
cloudinary.image("contract.png", {
type: "authenticated",
auth_token: {
key: "_key_", ip: "192.168.0.1"
},
sign_url: true });
Se preferir não isolar por IP (o que é incrivelmente rigoroso), o senhor pode limitar a renderização da imagem ao cookie! Para proteger o valor da imagem para o cookie, o senhor cria um CNAME que aponta para o Cloudinary, por meio do qual o Cloudinary pode garantir que um cookie seja definido em seu domínio principal e, em seguida, servir a imagem de acordo. Agora *isso é seguro!
URLS assinados
Uma vantagem de usar o Cloudinary é a capacidade de criar imagens em tempo real simplesmente modificando o URL da imagem, mas pode haver ocasiões em que o senhor queira URLs de imagens assinadas para que transformações adicionais não possam ser adicionadas à imagem por terceiros; nesse caso, o senhor usaria o sign_url para assinar uma imagem:
cloudinary.image("yellow_tulip.jpg", {
sign_url: true,
width: 300,
height: 200,
crop: 'crop',
gravity: 'center'
});
Que renderiza uma imagem com uma assinatura:
<img src="https://.../image/upload/s--o1_ZfmFP--/c_crop,g_center,h_200,w_300/yellow_tulip.jpg">
A tentativa de acessar uma transformação diferente ou a inclusão de uma assinatura inválida resultará em uma resposta de erro 401!
Imagens privadas
O Cloudinary permite que o senhor defina um private quando o senhor faz upload de uma imagem:
cloudinary.uploader.upload(
'sheep.jpg',
result => {},
{
public_id: 'sheep',
type: 'private'
});
Depois que a imagem for carregada, se um usuário tentar acessar uma imagem privada diretamente, ela não será exibida! Se quiser permitir que a imagem seja exibida somente em determinadas dimensões e outras transformações, será necessário usar o console de gerenciamento do Cloudinary para criar regras para transformações rigorosas da sua imagem:
Com suas regras rígidas de imagem em vigor, o senhor pode exibir apenas a imagem transformada com o seguinte URL:
<img src="https://res.cloudinary.com/private-demo/image/private/w_300,h_200,c_fill,r_20/sheep.jpg" alt=""gt;
Remoção de dados EXIF
A maioria das pessoas não percebe que, quando o senhor tira uma foto com qualquer câmera moderna, o arquivo de imagem contém vários metadados, inclusive onde a imagem foi tirada, com que dispositivo a imagem foi tirada e muito mais. Recentemente, escrevi sobre como obter e remover dados EXIF usando o exiftoolmas se estiver usando um terceiro para gerenciar ou carregar a mídia do usuário, será necessário garantir que ele remova os dados EXIF, o que o Cloudinary faz por padrão para novas transformações.
Se o senhor quiser manter os metadados, adicione o keep_iptc à imagem:
cloudinary.image('sample.jpg', {
width: 300,
flags: 'keep_iptc', // keep EXIF data
crop: 'scale'
});
Adoro o fato de os dados EXIF serem salvos em uploads de imagens brutas, mas removidos em imagens transformadas – é a melhor maneira de manter sua imagem original e, ao mesmo tempo, manter o remetente seguro!
Whitelisting baseado em referência
O Cloudinary permite que o senhor forneça uma lista branca para referenciadores de imagens:
Esse recurso está disponível somente para nossos planos Premium. Além disso, um CNAME personalizado deve ser configurado para sua conta para que isso funcione. O senhor precisa nos informar os domínios que deseja incluir na lista de permissões da sua conta e, após uma breve configuração manual da nossa parte, qualquer solicitação de acesso a uma imagem que não venha de um domínio na lista de permissões será negada. Da mesma forma, qualquer solicitação de acesso a uma imagem proveniente de um domínio na lista negra será negada.
Se o senhor realmente deseja bloquear suas imagens para não incorrer em taxas de largura de banda, essa parece ser uma boa ideia.
Há um equívoco comum de que não há nada que o senhor possa fazer para proteger sua mídia e propriedade intelectual, especialmente quando a reproduz em um serviço externo. Na realidade, há muito que se pode fazer para proteger a mídia e o Cloudinary oferece várias maneiras de fazer isso. Nunca é demais falar do Cloudinary: eles oferecem todos os efeitos, APIs e conjuntos de segurança que o senhor poderia desejar!
