Accès fichier js et CSP

Version imprimable

Bonjour a tous,

J'essaie de faire une app en electron js, mais je suis bloqué pour accéder a mon fichier javascript à cause de CSP.

voici le message d'erreur :

Citation:

Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution. Note that hashes do not apply to event handlers, style attributes and javascript: navigations unless the 'unsafe-hashes' keyword is present.

et voici mon
Code:

1 2 3 4 5 6 <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'"> [...] <div> <label><input type="checkbox" name="check" value="1" onclick="onlyOne(this)">Default parameters</label> <label><input type="checkbox" name="check" value="2" onclick="onlyOne(this)">Change parameters</label> </div>
mon js :
Code:

1 2 3 4 5 6 function onlyOne(checkbox) { var checkboxes = document.getElementsByName('check') checkboxes.forEach((item) => { if (item !== checkbox) item.checked = false }) }
Je n'arrive pas a autoriser la lecture de mon fichier js sans retirer ma balise Content Security Policy et donc perdre en sécurité.

Merci d'avance pour votre aide.

21/07/2021, 17h26
SpaceFrog

Tu ne nous montres pas comment tu appelles le fichier js ...

jette un oeil là dessus
https://content-security-policy.com/script-src/
21/07/2021, 17h49
mac789

j'ai déjà essayé plusieurs solutions via ce site mais ç’a n'a pas marché

chemin du fichier = "../js/recon.js"
22/07/2021, 08h27
SpaceFrog

En théorie:

Citation:


<script src="/js/some-file.js"></script>

dans la pratique, tu ne nous montres pas l'intégralité du code de mise en oeuvre ...

Un peu plus de lecture sur le sujet
https://developer.mozilla.org/fr/docs/Web/HTTP/CSP
22/07/2021, 10h34
Dave Hiock

\ô/
il me semble qu'un événement déclaré inline, comme

Code:

<label><input type="checkbox" name="check" value="1" onclick="onlyOne(this)">

n'est pas pris en compte , il faut passer par des addEventListener.

Je pense avoir trouvé la bonne solution grâce a nonce :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
    <link rel="stylesheet" href="../css/index.css" type="text/css">
    <link rel="stylesheet" href="../css/recon.css" type="text/css">
    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'nonce-rCkDzsvsdcsd+0fr8ylGr' 'self' ">
    <title>Allin</title>
  </head>
  <body>
    <header>
    <div>
      <label><input type="checkbox" id="check1" value="1">Default parameters</label>
      <label><input type="checkbox" id="check2" value="2" >Change parameters</label>
      <input type="text" class="css-input" placeholder="   Enter domain name"/>
    </div>
  </body>
  <script nonce="rCkDzsvsdcsd+0fr8ylGr" src="../js/recon.js"></script>
</html>

J'aimerais juste savoir si c'est bon niveau sécurité pour vous ? comme çà je pourrais mettre en résolu

22/07/2021, 13h25
SpaceFrog

Heu il est facile de recopier le code et d'intégrer une balise script pas code en lui attribuant ce même code non ?

Ok je suis retourné sur ce que j'avais au départ comme meta balise mais j'utilise plus ma fonction directement dans mon html mais uniquement une balise script qui charge mon fichier js qui marche avec un event listener.
Ligne 9 et 19

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
    <link rel="stylesheet" href="../css/index.css" type="text/css">
    <link rel="stylesheet" href="../css/recon.css" type="text/css">
    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'"> <!-- ICI -->
    <title>Allin</title>
  </head>
  <body>
    <div>
      <label><input type="checkbox" id="check1" value="1">Default parameters</label>
      <label><input type="checkbox" id="check2" value="2" >Change parameters</label>
      <input type="text" class="css-input" placeholder="   Enter domain name"/>
    </div>
  </body>
  <script src="../js/recon.js"></script> <!-- et ICI-->
</html>

Merci beaucoup pour votre aide !