interdire le copier coller (partiellement)

Version imprimable

Bonjour,

Existe-il un moyen pour empêcher un utilisateur de copier un tableau html ?

Actuellement j'ai une page qui affiche :
- des champs input (texte) qui permettent de faire une recherche et
- un tableau
Pour éviter le copier coller du tableau , j'ai mis ce code sur la page :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 function voleur(e) { return false; } // Ici la fonction pour désactiver. function bien() { return true; } document.onselectstart=new Function ("return false"); if (window.sidebar) { document.onmousedown=voleur; } // fin du script --> </script>
Ce code répondrait au besoin,si les utilisateurs utilisaient un pc, mais ils sont tous sous mac. Eh ? Avec un PC, on peut utiliser le clic droit de la souris et utiliser les champs texte de recherche. Pas sous Mac.

D'où ma question ...
Je souhaite uniquement interdire le copier coller du tableau(surtout le coller !).
Par avance merci

Tavar

20/05/2010, 10h26
vermine

Bonjour,

Ne suffirait-il pas alors de désactiver le Javascript dans le navigateur et de sauter vos protections ?
20/05/2010, 10h31
SpaceFrog

une desactivation du js permettrait en effet la copie du tableau...
si le but est d'empecher la recuperation sous forme de texte le seul moyen est de mettre une image ... et encore il existe des applis ocr ...
J'ai vu des sites qui collent des images transparentes au dessus du texte ou des div qui prennent le click, mais là encore il suffit de modifier le css de la page ou encore d'aller piocher dans le code source de la page ...

La seule vraie protection est de ne pas mettre le texte en ligne ^^
20/05/2010, 10h38
tavarlindar

Je suis d'accord avec vous, dans l'absolu c'est impossible d'interdire le copier coller, mais :
1) Javascript est obligatoire pour cette application intranet
2) les utilisateurs ne sont pas des informaticiens, même afficher le code source d'une page ne fait pas partie de leur compétences ...

Je souhaite juste mettre en place une solution qui fonctionne pour 99% des utilisateurs
20/05/2010, 11h58
SpaceFrog

si c'est sous IE exclusif:

Code:

<body onselectstart="return false;" >
20/05/2010, 12h15
tavarlindar

Normalement les utilisateurs utilisent firefox...
20/05/2010, 12h19
Bovino

Code:

<body oncopy="return false;" onpaste="return false;">
20/05/2010, 13h49
tavarlindar

J'allais dire "génial", mais cela ne fonctionne pas sous mac ...

Sur un pc avec IE, Chrome et firefox, le code fonctionne. On ne peut pas effectivement coller les données.
Par contre sous mac, on copie et colle les données comme on veut...:cry:
20/05/2010, 14h22
SpaceFrog

ben faudrait savoir ...
tu dis que les utilisateurs sont exclus ffx ...
20/05/2010, 14h27
tavarlindar

? ?? les utilisateurs naviguent habituellement sous firefox et utilise un mac.
20/05/2010, 16h38
vermine

Oui SpaceFrog, il y a un FF qui tourne sur Mac.
20/05/2010, 17h16
SpaceFrog

une solution plus universelle consisterait à mettre un div au dessus qui intercepte le click ...

Code:

onmousedown="return false;"

et avec cette fonction sa donne quoi

Code:

1
2
3
4
function voleur(ev){
(navigator.appName.substring(0,3)=="Mic") ? event.returnValue = false : ev.preventDefault();
}
document.onmousedown=voleur;

20/05/2010, 23h14
tavarlindar
Hum...

1) Petite précision concernant la solution de Bovino à savoir mettre

Code:

<body oncopy="return false;" onpaste="return false;">

:
il semblerait que ce code puisse fonctionner parfois sous mac. J'ai un utilisateur qui n'a pas pu copier les données, mais un autre lui n'a eu aucun soucis....????
Tous les deux sont sous mac, tous les deux utilisent FF ... très très étrange.

2) Concernant la proposition de SpaceFrog à savoir mettre dans une div

Code:

onmousedown="return false;"

, je viens de tester en rajoutant ce code à la définition du tableau que je souhaite protéger.

Code:

<TABLE onmousedown="return false;" BORDER='0' CELLSPACING=2 CELLPADDING=2>

Chez moi cela fonctionne. J'attends demain pour savoir s'il en est de même chez les utilisateurs. Je vous tiens informé.

3) Concernant la proposition de mekal à savoir utiliser la fonction
Code:

1 2 3 4 function voleur(ev){ (navigator.appName.substring(0,3)=="Mic") ? event.returnValue = false : ev.preventDefault(); } document.onmousedown=voleur;
Je dois avouer ne pas savoir comment l'implémenter. Donc pas pu testé.

Bien que ce sujet ne soit pas encore clos, je tiens dès à présent à vous remercier vivement pour votre aide.

Tavar
21/05/2010, 02h45
thelvin

Note quand même que personne ne va chercher à copier ton tableau à moins que cela ait un intérêt quelconque pour lui.

Et si les utilisateurs ont quelque chose à gagner à le faire, une mesure simpliste ne les en empêchera pas longtemps. Fondamentalement, leurs ordinateurs sont à leur service, pas au tien. (Et puis, au fond, si tu sais quel genre de machine et de navigateur ils utilisent, c'est que vous êtes partenaires. N'est-ce pas un peu bête d'empêcher un partenaire de travailler ?)

Bref, ce qui va se passer, soit c'est que l'un d'eux s'y connaît en fait assez bien en web, va enlever cette protection et montrer aux autres comment faire. Soit il y en a un qui connaît un bon informaticien, qui lui-même est un gourou des addons firefox. Cette personne lui fera un addon qui enlève les protections anti-clic/anti-select, et voyant que ça marche, l'utilisateur fera passer à ses collègues.

thelvin, bonjour,

Je suis encore une fois d'accord, mais ... il y a un MAIS.
pour répondre rapidement : à quoi bon mettre un cadenas sur une porte de cave ? On sait très bien qu'un voleur équipé parviendra à ses fins avec ou sans cadenas. Maintenant, pourquoi les gens le font, pourquoi les gens partent de chez eux en fermant la porte d'entrée .... Parce que cela est dissuasif, que cela demande de faire un effort, du matériel, etc. Ici c'est pareil.

Pour en revenir à la solution de SpaceFrog, cela ne fonctionne pas en fait. On peut si on sélectionne toute la page , copier comme on veut le tableau. (J'ai mis aussi le code dans un DIV).

Bref, je cherche une solution qui soit compatible avec mon premier code (voir ci-dessus). L'idée serait d'autoriser la sélection sur mes champs text (input) qui servent à faire une recherche. En fait, pour bien comprendre, j'ai en haut de mon tableau (fichier client :mrgreen:) une série de champs (text et select) qui permet de définir des critères de recherche. J'ai essayé plusieurs codes sans succès pour l'heure.

Voici un extrait :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 <FORM method="POST" ACTION='Contact.php'> <INPUT TYPE=HIDDEN NAME="action" VALUE="Recherche"> <CENTER><TABLE BORDER='0' CELLSPACING=2 CELLPADDING=2> <TR bgcolor="#CCCCCC" span style="color: #000000"><TH>Name<TH>Country<TH>email <? if (!isSet($_SESSION['mycrm'])) { echo'<TH>Sales';} ?> <TH>NS<TH>Cat<TH>Cycle<TH>Level<TH>action </TR> <TR bgcolor="white"><TD> <input type="text" name="nom_famille" value="<?=$_SESSION['nom_famille'];?>" size="15"> <TD><select name="payscontact"> <option value="critere_non_utilise"> </option> <? $listedespays = ExecRequete ("SELECT contact.pays, pays.pays_lib_anglais AS name_pays FROM contact LEFT JOIN pays ON contact.pays = pays.id_pays GROUP BY contact.pays, pays.pays_lib_anglais ORDER BY pays.pays_lib_anglais", $connexion); while ($pays = mysql_fetch_object($listedespays)) { if( ($_SESSION['payscontact']!='') AND $pays->pays==$_SESSION['payscontact']){$ct="selected";} print("<option ".$ct." value=".$pays->pays.">".$pays->name_pays."</option>"); unset($ct); } ?>
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 function voleur(e) { return false; } // Ici la fonction pour désactiver. function bien() { return true; } document.onselectstart=new Function ("return false"); if (window.sidebar) { document.onmousedown=voleur; } // fin du script --> </script>

21/05/2010, 10h23
Invité

le code que j'ai mis est directement exploitable tu n'a qu'a faire un copier coller

sinon cette ligne veut dire que sa concerne tout le document

Code:

document.onmousedown=voleur;

si tu veut que sa ne concerne que le tableau il serait preferable de retirer cette ligne et de la mettre dans le tableau

Code:

<table onmousedown='voleur()'>
21/05/2010, 10h40
SpaceFrog

Voici qui donne de bons resultats sur ffx ...

impossible de copier le tableau ... et l'alerte ne se declenche pas ..

Curieusement sous IE le texte ne semble pas obéir au zindex ...
si l'on clique ailleurs que sur du texte ça fonctionne, pas d'alert ..
Par contre si l'on clique sur le texte qui devrait pourtant être en z-index1 il agit si il était au dessus du z-index 100 ??????

Bonjour mekal,

Sauf mauvaise implémentation de ma part, cette fonction ne marche pas.

j'ai mis ce code dans ma page
Code:

1 2 3 4 5 6 7 8 9 10 <script language="javascript" type="text/javascript" >  </script>
et suivi ton conseil :
Code:

1 2 <TABLE onmousedown='voleur()' BORDER='0' CELLSPACING='2' CELLPADDING='2' >
cela empêche rien du tout ...

21/05/2010, 11h23
Invité

petit oubli il faut mettre event

Code:

<TABLE onmousedown='voleur(event)' BORDER='0' CELLSPACING='2' CELLPADDING='2' >

oups...

oublié de mettre le code dans le post pérécedent ...

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>copiez moi</title>
 
<script type="text/javascript">
function stopCopy(){
 
var ObjStop=document.getElementById('stop')
ObjStop.style.zIndex=9999;
alert(ObjStop.style.zIndex)
ObjStop.onclick=function(evt){
			  		evt=(evt)?evt:window.event;
			  		if (evt.stopPropagation) {evt.stopPropagation();}
					else{evt.cancelBubble = true;}
					}
		}
 
 
</script>
<style type="text/css">
 
 
 
tableau {z-index:1;
		  position:absolute;}
tr.td.div {position:relative;}		  
#stop {background:transparent;
		height:100%; 
		width:100%;
		position: absolute;
		top:0;
		left:0;}		  
 
#stop {z-index:9999 !important;}		
</style>
</head>
 
<body onload="stopCopy()" >
<div id="stop">&nbsp;</div>
<div id="tableau" style="background-color:red;top:0;left:0;" onclick="alert('coucou')">
<table border="1" width="100%" >
  <tr>
    <td ><div>copiez moi!</div></td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
  </tr>
  <tr>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
  </tr>
  <tr>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
  </tr>
  <tr>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
  </tr>
  </table>
  <div style="position:relative;background-color:lime;">test de texte dasn un div au lieu d'un td</div>
  </div>
</body>
</html>

IE gère vraiment le Zindex des TextNodes comme une quiche moisie

21/05/2010, 11h40
tavarlindar

Mekal,

Cela ne fonctionne pas ... si on ne peut pas sélectionner le tableau, il suffit de copier la page ou tout simplement mettre la souris ailleurs que sur le tableau et étendre la sélection.

SpaceFrog,

ta solution me parait compliquée...
21/05/2010, 11h46
SpaceFrog

ça c'est juste une question d'evenement ...
ce qui est étonnant c'est que justement les TextNode s'exemptent du zindex ...
les textNodes sont en zindex 1 et le div en 9999
21/05/2010, 11h57
Invité

il faudra alors l'etendre a tout le document et revenir a ma premiere proposition je ne voit pas d'autre solution.

peut etre avec la solution du div au dessus ?
21/05/2010, 12h02
tavarlindar

S'il est difficile d'interdire qu'une partie, peut-être est-il plus facile de tout interdire mais autoriser une partie. La solution que je recherche consisterait donc à interdire la copie sur toute la page, mais autoriser la sélection d'un champ input text afin que l'utilisateur puisse quand même taper un critère de recherche. Plus généralement interdire tout mais avoir la possibilité de déactiver l'interdiction sur certain champ.
21/05/2010, 13h28
tavarlindar
je pense avoir trouver la solution .

Je conserve le code qui "interdit" la copie de la page et je rajoute sur mes champ input le code suivant ;
Code:

1 2 <input id='nom_famille' type="text" name="nom_famille" value="<?=$_SESSION['nom_famille'];?>" size="10" onClick="document.getElementById('nom_famille').focus();">
ainsi quand je clique sur un champ, le curseur se positionne sur le champ !
à tester sous mac.

onmouseover soinon tu auras le meme souci de drag à coté

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>copiez moi</title>
 
</head>
 
<body >
<table border="1" width="100%" onmouseover="document.getElementById('fake').focus()">
  <tr>
    <td ><div>copiez moi!</div></td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
  </tr>
  <tr>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
  </tr>
  <tr>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
  </tr>
  <tr>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
  </tr>
  </table>
  <input type='text' id="fake" style="border:0;height:0;width:0; line-height:0;font-size:0"></div>
</body>
</html>

21/05/2010, 14h22
tavarlindar

? je ne comprends pas

Citation:

onmouseover sinon tu auras le même souci de drag à coté

aucun soucis détecté ....

ben si tu fais sur le onclick du tableau ...
si tu commences à drager en dehors du tableau .?..

comme ça j'arrive à copier :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>copiez moi</title>
 
</head>
 
<body >
<table border="1" width="100%" onclick="document.getElementById('fake').focus()">
  <tr>
    <td ><div>copiez moi!</div></td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
  </tr>
  <tr>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
  </tr>
  <tr>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
  </tr>
  <tr>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
    <td >copiez moi!</td>
  </tr>
  </table>
  <input type='text' id="fake" style="border:0;height:0;width:0; line-height:0;font-size:0" onfocus='this.blur()'></div>
</body>
</html>

toujours à cause du bug sous IE avec les textNodes qui echappent à l'heritage

pas sur le onmouseover

Chez moi pas de problème.

Rappel j'ai mis le code suivant sur les pages à protéger :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
<script language="javascript" type="text/javascript" >
<!-- Debut
 
function voleur(e)
{ return false; }
 
 
function bien()
{ return true; }
 
if (window.sidebar)
 
 {
  document.onmousedown=voleur;
  document.onclick=bien;
}
// fin du script -->
</script>

21/05/2010, 15h00
SpaceFrog

c'est encore plus sur en le doublant sur le onmouseup et onkeyup ...

quoi que un simple ctrl+A sur la page et hop on choppe tout :cry:
21/05/2010, 15h31
tavarlindar

exact un simple ctrl+A permet de copier ....

donc je fais quoi maintenant docteur ?
Interdire le ctrl+A ?
21/05/2010, 15h54
SpaceFrog

oui sur me body onkeydown capture la combinaison keycode et return false sur le crt+A

y'a aussi le click droit ou menu tout selectionner ...
21/05/2010, 16h01
tavarlindar

existe-il une autre méthode que d'utiliser js dans la balise body ? Tous mes pages sont construites à partir du même code et si je modifie la balise body, cela modifiera toutes mes pages . Je souhaite protéger juste quelques pages.

Par ailleurs comment fais-tu pour interdire le ctrl+a ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<html>
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Nouvelle page 2</title>
 
<script type='text/javascript'>
function remplaceCtrlTouche(e, toucheInterdite, fonction){
        var key;
        var CtrlDown;
 
        if(window.event) {
                key = window.event.keyCode;     //IE
                CtrlDown=(window.event.ctrlKey)?true:false;
        			}
        else  {
                key = e.which;     //firefox
                CtrlDown=(e.ctrlKey)?true:false;
                }
 
        if(CtrlDown) {        //La touche Ctrl à été enfoncée, verfication de combinaison
			//verification de casse
			if(toucheInterdite.toLowerCase() === String.fromCharCode(key).toLowerCase()){
					// ici lancement de la fonction de substitution
                 fonction()
                 // annulation de la fonction originale
                 return false;
                 }
           }
        return true;
}
 
function maRecherchePerso(){
alert('faut pas vouloir copier')
 
}
 
</script>
</head>
 
<body onkeydown="return this.onkeypress();" onkeypress="return remplaceCtrlTouche(event,'A', maRecherchePerso)">
 
</body>
 
</html>

21/05/2010, 17h16
tavarlindar

super, cela fonctionne ! j'aurais aimer comprendre la fonction, mais cela me prendrait des heures !
j'ai remarquer qu'un clic droit sur la souris et tout sélectionner fonctionne mais impossible de coller, donc .... on va dire que c'est bon

Une fois n'est pas coutume, encore tous mes vifs remerciement pour ton aide au combien précieuse Mr SpaceFrog

Bien à toi Tavar,