Copiar url da imagem

[Wellington09 1]

Criei a seguinte função para pegar a url da imagem.

function copiarEnderecoImagem(id){

    url = id.src;

   alert(url);

}


<img id="imagem_1" onClick="copiarEnderecoImagem(this);" src="http://www.meudominio.com.br" />

Gostaria de saber se alguém conhece algum comando js que faz um CTRL+C nesta variável url.

Em vez do usuário clicar com o botão direito em cima da imagem e escolher a opção COPIAR ENDEREÇO DA IMAGEM, eu estou querendo fazer um COPIAR apenas com um único clique do botão esquerdo do mouse.

[William Bruno 1501]

Precisa de algumas gambiarras para copiar para o clipboard.

Veja:

 

https://github.com/zenorocha/clipboard.js/

[Wellington09 1]

Vlw, William ficou perfeito... só achei 8 KB muita coisa para uma função dessa.

 

Utilizando javascript puro, não teria uma função que faz a função do ctrl+c?

 

Agradeço pela dica.

[William Bruno 1501]

Tem sim, é a document.execCommand, mas esses 8k ali, são os fallbacks para funcionar em diversos navegadores antigos/diferentes.

[Wellington09 1]

É verdade, esses fallbacks salvam a vida, mas no meu caso o document.execCommand vai cair bem, pois o sistema é homologado para apenas um tipo de navegador no caso o Chrome.

 

William, vou aproveitar este mesmo post para fazer uma outro pergunta, que tem uma relação com o ctrl+c da url da imagem .

 

 

**********************************************************************************************************************

OBS (resumido):

 

Após digitar todo o post percebi que não tinha necessidade de fazer um post tão grande.

Então se você entender o problema apenas aqui dentro do **** asterisco **** não tem necessidade de ler todo o conteúdo abaixo

 

Ah! fiz um teste utilizando apenas o textarea, sem utilizar o tinymce digitando na unha a tag

<img src="http://www.meudominio.com.br/images/uploads/id/nome_da_imagem.jpg" />

Salvei na base de dados e verifiquei na pagina post.php que a imagem estava aparecendo perfeitamente.

 

Foi ai que percebi que no momento que eu clico no botão OK do Insert/edit image do tinymce ele converte a url

http://www.meudominio.com.br/images/uploads/id/nome_da_imagem.jpg

para

../../../images/uploads/id/nome_da_imagem.jpg

 

 

***********************************************************************************************************************

 

 

 

 

 

DETALHADO:

 

Estou utilizando este clipboard para copiar a url da imagem desta forma.

$url = "http://www.meudominio.com.br/images/upload/2/teste.jpg";
<img data-clipboard-text="<?php echo $url;?>" src="<?php echo $url;?>" />

Até ai tudo blz ele copia a url certinho.

 

Como eu estou utilizando o editor de texto rico tinymce

 

exemplo

 

eu escolho o icone Insert/edit image e insiro a url no Source.

 

Até ai tudo blz tb pois a imagem aparece no editor só que em vez dela aparecer desta forma.

 

http://www.meudominio.com.br/images/uploads/id/nome_da_imagem.jpg

 

ela aparece assim

 

../../../images/uploads/id/nome_da_imagem.jpg

 

A estrutura de meu projeto esta assim:

 

ADMIN

painel > modulos > fotos > index.php

 

SITE

images > uploads > id > nome_da_imagem.jpg

post.php

 

A pasta images esta na mesma raiz da pasta painel

 

Apesar da imagem estar aparecendo, se eu salvar os dados agora no banco ele iria para o banco assim

../../../images/uploads/id/nome_da_imagem.jpg

Qual o problema disso ?

Na estrutura de pasta do SITE e não do ADMIN a imagem não iria aparecer pois o src estaria puxando uma estrutura que não existe ../../../images/uploads/id/nome_da_imagem.jpg onde no caso deveria ser apenas images/uploads/id/nome_da_imagem.jpg ou no caso o que seria o mais correto já que eu copiei a url usando o clipboard http://www.meudominio.com.br/images/uploads/id/nome_da_imagem.jpg

Achei que este problema só aconteceria pela fato de eu estar localhost, pois se eu inserir uma url de qualquer imagem de outros sites o mesmo iria funcionar perfeitamente, por utilizar uma url externa, porém ao fazer o teste a partir do servidor, ele se comportou da mesma forma.

 

../../../images/uploads/id/nome_da_imagem.jpg

 

Você ja se deparou com este tipo de problema ?

 

Ah! fiz um teste utilizando apenas o textarea, sem utilizar o tinymce digitando na unha a tag

<img src="http://www.meudominio.com.br/images/uploads/id/nome_da_imagem.jpg" />

Salvei na base de dados e verifiquei na pagina post.php que a imagem estava aparecendo perfeitamente.

 

Foi ai que percebi que no momento que eu clico no botão OK do Insert/edit image do tinymce ele converte a url

http://www.meudominio.com.br/images/uploads/id/nome_da_imagem.jpg

para

../../../images/uploads/id/nome_da_imagem.jpg

 

 

 

 

Mais uma vez obrigado pela ajuda!

 

 

 

RESOLVIDO:

Segue o link da documentação do TinyMCE, onde resolvi o meu problema de conversão de url.

Basta apenas acrescentar um relative_urls: false em vez de relative_urls: true que no caso é o valor default

 

https://www.tinymce.com/docs/configure/url-handling/#relative_urls

 

Eu poderia editar o post, mas achei melhor deixar do jeito que esta caso alguém esteja passando pelo mesmo problema e esteja procurando pelos mecanismos de busca.

 

Fica a criterio do moderador editar ou não este post.

 

vlw :P :D .