12
1 There is a better way OCTO Part of Accenture © 2020 - All rights reserved Content Security Policy with React WebApp Meetup OWASP 10 Septembre 2020
1
Ther
e is
a b
ette
r wa
y
OCTO Part of Accenture © 2020 - All rights reserved
Content Security Policywith React WebApp
Meetup OWASP10 Septembre 2020
Ther
e is
a b
ette
r wa
y
2
01
02
OCTO Part of Accenture © 2020 - All rights reserved
Content Security Policy
React
Ther
e is
a b
ette
r wa
y
3
OCTO Part of Accenture © 2020 - All rights reserved
Content Security Policy
01
Ther
e is
a b
ette
r wa
y
4
OCTO Part of Accenture © 2020 - All rights reserved
Content Security Policy
OBJECTIF:La Content Security Policy est une entête HTTP permettant de définir les interactions entre les ressources d’une page web.
default-src 'self';
script-src 'self' https://www.jsdelivr.com/;
img-src 'self' https://tinypng.com;
https://www.example.com
Ther
e is
a b
ette
r wa
y
5
OCTO Part of Accenture © 2020 - All rights reserved
Unsafe inline
<script>
// JavaScript Code
</script>
https://www.example.com/index.html
script-src 'unsafe-inline';
Content Security Policy
Le JavaScript Inline est largement exploité par
les attaques XSS.
Il ne faut pas autoriser unsafe-inline
Ther
e is
a b
ette
r wa
y
6
OCTO Part of Accenture © 2020 - All rights reserved
React
02
Ther
e is
a b
ette
r wa
y
7
OCTO Part of Accenture © 2020 - All rights reserved
React
OBJECTIF:React est un framework Javascript pour construire des Single Page Application.
๏ Scaffold
npx create-react-app my-app
๏ Build
npm run build
๏ Serve
npx serve -s build
8
Ther
e is
a b
ette
r wa
y
OCTO Part of Accenture © 2020 - All rights reserved
… et voila du Inline JavaScript !
Ther
e is
a b
ette
r wa
y
9
OCTO Part of Accenture © 2020 - All rights reserved
INLINE_RUNTIME_CHUNK=false react-scripts build
React without Inline Javascript
10
Ther
e is
a b
ette
r wa
y
OCTO Part of Accenture © 2020 - All rights reserved
Le JS inline à disparu !!!
Ther
e is
a b
ette
r wa
y
11
OCTO Part of Accenture © 2020 - All rights reserved
Basic Content Security Policy
<meta http-equiv="Content-Security-Policy" content=" connect-src 'self'; default-src 'none'; img-src 'self'; manifest-src 'self'; script-src-elem 'self'; style-src-elem 'self'; ">
React
Ther
e is
a b
ette
r wa
y
12
Police :Century Gothic
⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤
OCTO Part of Accenture © 2020 - All rights reserved
