Copier dans le presse papier

Version imprimable

Bonjour,

J'ai fait un bouton qui execute au clic une fonction JS. Dans cette fonction je récupère l'url de la page, jusque là pas de problème, un alert me confirme que mon url est bien récupérée, le problème vient après, je ne sais pas comment enregistrer ce lien dans le presse papier de la machine.

J'ai essayé avec execCommand() sans succès.
Me servant des sessions de phpbb, ce dernier me refuse l'accès à $_SERVER, d'où la récupération de l'url en js d'ailleurs.

Donc, ayant mon url via JS, comment je peux faire pour que la copie s'enregistre dans le presse papier ?

Même si je ne pense pas qu'il y ai d'utilité, je vous mets le code JS, le plus gros fonctionne, je n'ai d'ailleurs pas "d'erreur" le if/else me retourne que c'est bien copié, alors que non :s
Code:

1 2 3 4 5 6 7 8 function copieUrl(id){ var lien = document.location.href+"&id="+id; if(document.execCommand('copy')){ alert("L'URL à bien été copiée dans le presse papier, faites un coller (ctrl + v) là où vous souhaitez la coller.\r\n\r\n"+lien); }else{ alert("Impossible de copier le lien automatiquement !\r\nSurligner le lien et faites CTRL + C pour le copier puis CTRL + V là où vous souhaitez le coller.\r\n\r\n"+lien); } }

16/10/2016, 08h34
eleydet

Bonjour,

Je crois que ce n'est pas possible. Par contre, on peut enregistrer des données dans un cookie.
16/10/2016, 10h30
danielhagnoul

Window.sessionStorage
16/10/2016, 12h30
Maxime50

Citation:

Envoyé par eleydet

Bonjour,

Je crois que ce n'est pas possible. Par contre, on peut enregistrer des données dans un cookie.

Le cookie n'est pas la solution, j'ai besoin que l'on puisse faire un coller depuis le menu contextuel ou via ctrl+v !

Citation:

Envoyé par danielhagnoul

Window.sessionStorage

Merci, mais c'est pas ce que je recherche, j'ai besoin que la copie reste en mémoire pour pouvoir partager le lien via email, etc.
Là d'après ce que j'ai compris c'est pas le cas

Citation:

"...Ouvrir une page dans un nouvel onglet ou une fenêtre entrainera l'initialisation d'une nouvelle session, qui diffère du comportement du cookie."

Il y a des sites qui ont ce genre de système, lors du clic sur un bouton, ça copie l'url dans le presse papier.
Après quelques recherches supplémentaire, c'est une combinaison de JS et Flash, mais la partie Flash ne me tente pas vraiment niveau sécurité. Flash n'a pas très bonne réputation ...

Je vais quand même essayer avec la combi JS/Flash et je vous redis.
16/10/2016, 14h31
ABCIWEB

On utilise plus flash aujourd'hui c'est déprécié et presque plus aucun navigateur ne le supporte par défaut.

Pour des besoins similaires je fais une requête ajax et j'enregistre le contenu copié dans une variable de session, qui est donc disponible depuis toutes les pages. Suffit de définir ensuite une combinaison de touches (pourquoi pas Ctrl+v mais tu peux utiliser une combinaison spécifique pour ne pas modifier le comportement par défaut de ce raccourci, ainsi le visiteur peut disposer de plusieurs tampons mémoire) qui sera interceptée en javascript et fera une seconde requête ajax pour récupérer et insérer le contenu à l'endroit du curseur ou dans un champ spécifique.

Citation:

Envoyé par Maxime50

Il y a des sites qui ont ce genre de système, lors du clic sur un bouton, ça copie l'url dans le presse papier.
Après quelques recherches supplémentaire, c'est une combinaison de JS et Flash, mais la partie Flash ne me tente pas vraiment niveau sécurité. Flash n'a pas très bonne réputation ...

Je ne sais pas comment ils font dans ces sites dont tu parles mais c'est possible de le faire avec la commande execCommand que tu as essayée au départ sans succès...
Citation:
Envoyé par Maxime50
J'ai essayé avec execCommand() sans succès.
...
Même si je ne pense pas qu'il y ai d'utilité, je vous met le code JS, le plus gros fonctionne, je n'ai d'ailleurs pas "d'erreur" le if/else me retourne que c'est bien copié, alors que non :s
Code:

1 2 3 4 5 6 7 8 function copieUrl(id){ var lien = document.location.href+"&id="+id; if(document.execCommand('copy')){ alert("L'URL à bien été copiée dans le presse papier, faites un coller (ctrl + v) là où vous souhaitez la coller.\r\n\r\n"+lien); }else{ alert("Impossible de copier le lien automatiquement !\r\nSurligner le lien et faites CTRL + C pour le copier puis CTRL + V là où vous souhaitez le coller.\r\n\r\n"+lien); } }
C'est normal que cela ne fonctionne pas puisque pour copier un texte il faut que celui-ci soit sélectionné donc à toi de mettre le texte quelque part dans le document puis de le sélectionner et alors lancer la fonction document.execCommand('copy')...

16/10/2016, 15h18
Beginner.

Citation:

Envoyé par Beginner.

C'est normal que cela ne fonctionne pas puisque pour copier un texte il faut que celui-ci soit sélectionné donc à toi de mettre le texte quelque part dans le document puis de le sélectionner et alors lancer la fonction document.execCommand('copy')...

Si on veut faire ça automatiquement on peut "fabriquer" une div, on met dedans le lien, on ajoute la div au document.body et on sélectionne le texte qui s'y trouve automatiquement (voir le code) puis enfin on supprime cette div et si on veut que cette div ne soit pas visible tout en restant "selectionable" on peut mettre son opacité à 0...

J'ai mis le code à tester ici : http://jsbin.com/zeqafeguto/edit?js,output mais il faut essayer sur une page car le lien copié est je pense celui d'une iframe, ce n'est pas celui qu'on voit dans le navigateur...

Et pour id, comme je ne sais pas ce que c'est j'ai mis "blablabla"...

J'étais en train de me battre avec select(); jusqu'à ce que je revienne regarder et que je vois votre code ^^.

Merci du coup de main, j'ai très peu modifié le code je vous le mets.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
function copieUrl(id){
	var lien  = document.location.href+"&id="+id,
	    span  = document.getElementById("lien"),
	    sel = window.getSelection(),
   	    rangeObj = document.createRange();
 
 
        span.innerHTML = lien;
	rangeObj.selectNodeContents(span);
	sel.removeAllRanges();
	sel.addRange(rangeObj);
 
	if(document.execCommand('copy')){
		alert("L'URL à bien été copiée dans le presse papier, faites un coller (ctrl + v) là où vous souhaitez la coller.\r\n\r\n"+lien);
	}else{
		alert("Impossible de copier le lien automatiquement !\r\nSurligner le lien et faites CTRL + C pour le copier puis CTRL + V là où vous souhaitez le coller.\r\n\r\n"+lien);
	}
}

16/10/2016, 15h59
Beginner.

Ca marche normalement, non ?

Citation:

Envoyé par Maxime50

Merci du coup de main, j'ai très peu modifier le code je vous le mets.

De rien... Mais dans ce code, la <span> doit être déjà présente dans le document, dans mon code je suis parti du principe qu'elle n'existait pas et qu'il fallait l'ajouter puis la supprimer pour que le document redevienne comme il était avant la copie...
16/10/2016, 16h02
Maxime50

Oui, en partie, l'id n'est pas transmis dans le presse papier, mais le reste oui, alors qu'il apparait bien dans le alert. Je cherche d'où ça peut venir, surtout que l'un comme l'autre utilisent la variable "lien" pour le copier/afficher.

Et oui mon span est déjà présent et gérer direct dans le fichier css.

Edit : en fait c'est ma faute ^^, j'avais mélanger la création des variables avec l'attribution du contenu (innerHTML) et collé des ";" et bien sùr sans mettre var au début :s.

Je teste encore.

Edit 2 : Voilou c'est tout corrigé, parfois c'est vraiment des petites erreur à la c** qui font perdre du temps ! Encore merci, ça marche impec ;)
16/10/2016, 16h09
Beginner.

Alors déjà pour commencer, remplacez les virgules par des points-virgules aux lignes 3,5 et 6...
16/10/2016, 16h10
Maxime50

Oui c'est fait, j'ai édité mon message précédent.
16/10/2016, 16h11
Beginner.

Ah ben nos messages se sont croisés... Oui donc remplacer les virgules et rajouter aussi le mot clé "var" (je l'avais mis pourtant).
16/10/2016, 16h15
Maxime50
Oui, c'est de ma faute, en modifiant le code pour récupérer mon span déjà existant j'ai déplacé les lignes de codes, du coup je me suis retrouvé avec les lignes mélangées.

En général j'initialise mes variables au début en faisant comme ça
Code:

1 2 3 4 var maVar1 = "valeur", maVar2 = "valeur", ....;
16/10/2016, 16h16
Beginner.

Ah ok je viens de lire le "edit 2"...

Ben tant mieux si ça marche, cela fait un fil de plus "résolu"...
16/10/2016, 16h17
Maxime50

Oui et souvent je suis étonné, parce que quand on connait pas ou qu'on arrive pas à faire ce qu'on veut, on part dans des trucs super compliqué dans sa tête alors qu'en faite c'est tout c** ^^.

Je passe en résolu.
16/10/2016, 16h27
Beginner.

Oui c'est vrai et probablement que je serais aussi parti dans quelque chose de compliqué mais il se trouve que récemment je travaillais sur cette fonction (execCommand) et aussi sur les range et selection...
16/10/2016, 17h33
Maxime50

J'ai quand même corrigé le code dans le message plus haut, sinon vous pouvez être certain que quelqu'un va se contenter de copier/coller sans lire le reste du sujet et venir dire que le code ne fonctionne pas !!! :mrgreen: