190 lines
81 KiB
HTML
190 lines
81 KiB
HTML
|
<!DOCTYPE html><html lang="en-IE"><head><title>CAPTCHA</title><meta property="og:title" content="CAPTCHA"><meta name="author" content="Laurent Fainsin, Clément Broutin"><meta property="article:author" content="Laurent Fainsin, Clément Broutin"><meta charset="UTF-8"><meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0"><meta name="apple-mobile-web-app-capable" content="yes"><meta http-equiv="X-UA-Compatible" content="ie=edge"><meta property="og:type" content="website"><meta name="twitter:card" content="summary"><style>@media screen{body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button{-webkit-tap-highlight-color:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:0;color:inherit;cursor:pointer;font-size:inherit;opacity:.8;outline:none;padding:0;transition:opacity .2s linear}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button:disabled,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button:disabled,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button:disabled{cursor:not-allowed;opacity:.15!important}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button:hover,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button:hover,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button:hover{opacity:1}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button:hover:active,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button:hover:active,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button:hover:active{opacity:.6}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button:hover:not(:disabled),body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button:hover:not(:disabled),body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button:hover:not(:disabled){transition:none}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=prev],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=prev],body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button.bespoke-marp-presenter-info-page-prev{background:transparent url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSI1IiBkPSJNNjggOTAgMjggNTBsNDAtNDAiLz48L3N2Zz4=") no-repeat 50%;background-size:contain;overflow:hidden;text-indent:100%;white-space:nowrap}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=next],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=next],body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button.bespoke-marp-presenter-info-page-next{background:transparent url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSI1IiBkPSJtMzIgOTAgNDAtNDAtNDAtNDAiLz48L3N2Zz4=") no-repeat 50%;background-size:contain;overflow:hidden;text-indent:100%;white-space:nowrap}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=fullscreen],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=fullscreen]{backgroun
|
||
|
|
/*!
|
||
|
|
* Marp default theme.
|
||
|
|
*
|
||
|
|
* @theme default
|
||
|
|
* @author Yuki Hattori
|
||
|
|
*
|
||
|
|
* @auto-scaling true
|
||
|
|
* @size 16:9 1280px 720px
|
||
|
|
* @size 4:3 960px 720px
|
||
|
|
*/div#p>svg>foreignObject>section{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;word-wrap:break-word;background-color:#fff;color:#24292f;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;font-size:16px;line-height:1.5;margin:0}div#p>svg>foreignObject>section{--marpit-root-font-size:16px}div#p>svg>foreignObject>section .octicon{fill:currentColor;display:inline-block;vertical-align:text-bottom}div#p>svg>foreignObject>section h1:hover .anchor .octicon-link:before,div#p>svg>foreignObject>section h2:hover .anchor .octicon-link:before,div#p>svg>foreignObject>section h3:hover .anchor .octicon-link:before,div#p>svg>foreignObject>section h4:hover .anchor .octicon-link:before,div#p>svg>foreignObject>section h5:hover .anchor .octicon-link:before,div#p>svg>foreignObject>section h6:hover .anchor .octicon-link:before{background-color:currentColor;content:" ";display:inline-block;height:16px;-webkit-mask-image:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" aria-hidden="true"><path fill-rule="evenodd" d="M7.775 3.275a.75.75 0 0 0 1.06 1.06l1.25-1.25a2 2 0 1 1 2.83 2.83l-2.5 2.5a2 2 0 0 1-2.83 0 .75.75 0 0 0-1.06 1.06 3.5 3.5 0 0 0 4.95 0l2.5-2.5a3.5 3.5 0 0 0-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 0 1 0-2.83l2.5-2.5a2 2 0 0 1 2.83 0 .75.75 0 0 0 1.06-1.06 3.5 3.5 0 0 0-4.95 0l-2.5 2.5a3.5 3.5 0 0 0 4.95 4.95l1.25-1.25a.75.75 0 0 0-1.06-1.06l-1.25 1.25a2 2 0 0 1-2.83 0z"/></svg>');mask-image:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" aria-hidden="true"><path fill-rule="evenodd" d="M7.775 3.275a.75.75 0 0 0 1.06 1.06l1.25-1.25a2 2 0 1 1 2.83 2.83l-2.5 2.5a2 2 0 0 1-2.83 0 .75.75 0 0 0-1.06 1.06 3.5 3.5 0 0 0 4.95 0l2.5-2.5a3.5 3.5 0 0 0-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 0 1 0-2.83l2.5-2.5a2 2 0 0 1 2.83 0 .75.75 0 0 0 1.06-1.06 3.5 3.5 0 0 0-4.95 0l-2.5 2.5a3.5 3.5 0 0 0 4.95 4.95l1.25-1.25a.75.75 0 0 0-1.06-1.06l-1.25 1.25a2 2 0 0 1-2.83 0z"/></svg>');width:16px}div#p>svg>foreignObject>section details,div#p>svg>foreignObject>section figcaption,div#p>svg>foreignObject>section figure{display:block}div#p>svg>foreignObject>section summary{display:list-item}div#p>svg>foreignObject>section a{background-color:transparent;color:#0969da;text-decoration:none}div#p>svg>foreignObject>section a:active,div#p>svg>foreignObject>section a:hover{outline-width:0}div#p>svg>foreignObject>section abbr[title]{border-bottom:none;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}div#p>svg>foreignObject>section b,div#p>svg>foreignObject>section strong{font-weight:600}div#p>svg>foreignObject>section dfn{font-style:italic}div#p>svg>foreignObject>section h1{border-bottom:1px solid #d8dee4;font-size:2em;font-weight:600;margin:.67em 0;padding-bottom:.3em}div#p>svg>foreignObject>section mark{background-color:#ff0;color:#24292f}div#p>svg>foreignObject>section small{font-size:90%}div#p>svg>foreignObject>section sub,div#p>svg>foreignObject>section sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}div#p>svg>foreignObject>section sub{bottom:-.25em}div#p>svg>foreignObject>section sup{top:-.5em}div#p>svg>foreignObject>section img{background-color:#fff;border-style:none;box-sizing:content-box;max-width:100%}div#p>svg>foreignObject>section code,div#p>svg>foreignObject>section kbd,div#p>svg>foreignObject>section pre,div#p>svg>foreignObject>section samp{font-family:monospace,monospace;font-size:1em}div#p>svg>foreignObject>section figure{margin:1em 40px}div#p>svg>foreignObject>section hr{background:transparent;background-color:#d0d7de;border:0;box-sizing:content-box;height:.25em;margin:24px 0;overflow:hidden;padding:0}div#p>svg>foreignObject>section [type=reset],div#p>svg>foreignObject>section [type=submit],div#p>svg>foreignObject>section html [type=button]{-webkit-appearance:button}div#p>svg>foreignObject>section [type=button]::-moz-focus-inner,div#p>svg>foreignObject>section [type=reset]::-moz-focus-inner,div#p>svg>foreignObject>section [type=submi
|
||
|
|
/* content:""; */display:table}div#p>svg>foreignObject>section:after{clear:both}div#p>svg>foreignObject>section>:first-child{margin-top:0!important}div#p>svg>foreignObject>section>:last-child{margin-bottom:0!important}div#p>svg>foreignObject>section a:not([href]){color:inherit;text-decoration:none}div#p>svg>foreignObject>section .absent{color:#cf222e}div#p>svg>foreignObject>section .anchor{float:left;line-height:1;margin-left:-20px;padding-right:4px}div#p>svg>foreignObject>section .anchor:focus{outline:none}div#p>svg>foreignObject>section blockquote,div#p>svg>foreignObject>section details,div#p>svg>foreignObject>section dl,div#p>svg>foreignObject>section ol,div#p>svg>foreignObject>section p,div#p>svg>foreignObject>section pre,div#p>svg>foreignObject>section table,div#p>svg>foreignObject>section ul{margin-bottom:16px;margin-top:0}div#p>svg>foreignObject>section blockquote>:first-child{margin-top:0}div#p>svg>foreignObject>section blockquote>:last-child{margin-bottom:0}div#p>svg>foreignObject>section sup>a:before{content:"["}div#p>svg>foreignObject>section sup>a:after{content:"]"}div#p>svg>foreignObject>section h1 .octicon-link,div#p>svg>foreignObject>section h2 .octicon-link,div#p>svg>foreignObject>section h3 .octicon-link,div#p>svg>foreignObject>section h4 .octicon-link,div#p>svg>foreignObject>section h5 .octicon-link,div#p>svg>foreignObject>section h6 .octicon-link{color:#24292f;vertical-align:middle;visibility:hidden}div#p>svg>foreignObject>section h1:hover .anchor,div#p>svg>foreignObject>section h2:hover .anchor,div#p>svg>foreignObject>section h3:hover .anchor,div#p>svg>foreignObject>section h4:hover .anchor,div#p>svg>foreignObject>section h5:hover .anchor,div#p>svg>foreignObject>section h6:hover .anchor{text-decoration:none}div#p>svg>foreignObject>section h1:hover .anchor .octicon-link,div#p>svg>foreignObject>section h2:hover .anchor .octicon-link,div#p>svg>foreignObject>section h3:hover .anchor .octicon-link,div#p>svg>foreignObject>section h4:hover .anchor .octicon-link,div#p>svg>foreignObject>section h5:hover .anchor .octicon-link,div#p>svg>foreignObject>section h6:hover .anchor .octicon-link{visibility:visible}div#p>svg>foreignObject>section h1 code,div#p>svg>foreignObject>section h1 tt,div#p>svg>foreignObject>section h2 code,div#p>svg>foreignObject>section h2 tt,div#p>svg>foreignObject>section h3 code,div#p>svg>foreignObject>section h3 tt,div#p>svg>foreignObject>section h4 code,div#p>svg>foreignObject>section h4 tt,div#p>svg>foreignObject>section h5 code,div#p>svg>foreignObject>section h5 tt,div#p>svg>foreignObject>section h6 code,div#p>svg>foreignObject>section h6 tt{font-size:inherit;padding:0 .2em}div#p>svg>foreignObject>section ol.no-list,div#p>svg>foreignObject>section ul.no-list{list-style-type:none;padding:0}div#p>svg>foreignObject>section ol[type="1"]{list-style-type:decimal}div#p>svg>foreignObject>section ol[type=a]{list-style-type:lower-alpha}div#p>svg>foreignObject>section ol[type=i]{list-style-type:lower-roman}div#p>svg>foreignObject>section div>ol:not([type]){list-style-type:decimal}div#p>svg>foreignObject>section ol ol,div#p>svg>foreignObject>section ol ul,div#p>svg>foreignObject>section ul ol,div#p>svg>foreignObject>section ul ul{margin-bottom:0;margin-top:0}div#p>svg>foreignObject>section li>p{margin-top:16px}div#p>svg>foreignObject>section li+li{margin-top:.25em}div#p>svg>foreignObject>section dl{padding:0}div#p>svg>foreignObject>section dl dt{font-size:1em;font-style:italic;font-weight:600;margin-top:16px;padding:0}div#p>svg>foreignObject>section dl dd{margin-bottom:16px;padding:0 16px}div#p>svg>foreignObject>section table th{font-weight:600}div#p>svg>foreignObject>section table td,div#p>svg>foreignObject>section table th{border:1px solid #d0d7de;padding:6px 13px}div#p>svg>foreignObject>section table tr{background-color:#fff;border-top:1px solid #d8dee4}div#p>svg>foreignObject>section table tr:nth-child(2n){background-color:#f6f8fa}div#p>svg>foreignObject>section table img{background-color:transparent}div#p>svg>foreignObject>section img[align=right]{padding-left:20px}div#p>svg>foreignObject>se
|
||
|
|
<p><video src="background.mp4" autoplay loop></video></p>
|
||
|
|
<h1>CAPTCHAs</h1>
|
||
|
|
</section>
|
||
|
|
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="2" data-marpit-fragments="3">
|
||
|
|
<header>
|
||
|
|
<h1>What is a CAPTCHA ?</h1>
|
||
|
|
</header>
|
||
|
|
<p>Definition:</p>
|
||
|
|
<ul>
|
||
|
|
<li data-marpit-fragment="1"><strong>C</strong>ompletely <strong>A</strong>utomated <strong>P</strong>ublic <a href="https://en.wikipedia.org/wiki/Alan_Turing"><strong>T</strong>uring</a> test to tell <strong>C</strong>omputers and <strong>H</strong>umans <strong>A</strong>part</li>
|
||
|
|
<li data-marpit-fragment="2">commonly, a third party software installed on the web pages</li>
|
||
|
|
<li data-marpit-fragment="3">/kæp.tʃə/</li>
|
||
|
|
</ul>
|
||
|
|
<hidden>
|
||
|
|
A bit of history:
|
||
|
|
<ul>
|
||
|
|
<li>Introduced in 1997 by <a href="https://fr.wikipedia.org/wiki/AltaVista">AltaVista</a></li>
|
||
|
|
<li>Term was coined in 2003 by <a href="https://en.wikipedia.org/wiki/Luis_von_Ahn">Luis von Ahn</a>, <a href="https://en.wikipedia.org/wiki/Manuel_Blum">Manuel Blum</a>, <a href="https://www-users.cse.umn.edu/~hoppernj/">Nicholas J. Hopper</a>, and <a href="https://www.microsoft.com/en-us/research/people/jcl/">John Langford</a>.</li>
|
||
|
|
<li>Based on a <a href="https://en.wikipedia.org/wiki/Reverse_Turing_test">Reverse Turing test</a></li>
|
||
|
|
<li>Created from open problems in AI.<br />
|
||
|
|
</hidden></li>
|
||
|
|
</ul>
|
||
|
|
</section>
|
||
|
|
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="3" data-marpit-fragments="4">
|
||
|
|
<header>
|
||
|
|
<h1>What is a CAPTCHA ?</h1>
|
||
|
|
</header>
|
||
|
|
<p>Definition:</p>
|
||
|
|
<ul>
|
||
|
|
<li><strong>C</strong>ompletely <strong>A</strong>utomated <strong>P</strong>ublic <a href="https://en.wikipedia.org/wiki/Alan_Turing"><strong>T</strong>uring</a> test to tell <strong>C</strong>omputers and <strong>H</strong>umans <strong>A</strong>part.</li>
|
||
|
|
<li>commonly, a third party software installed on the web pages.</li>
|
||
|
|
<li>/kæp.tʃə/</li>
|
||
|
|
</ul>
|
||
|
|
<p>A bit of history:</p>
|
||
|
|
<ul>
|
||
|
|
<li data-marpit-fragment="1">Introduced in 1997 by <a href="https://fr.wikipedia.org/wiki/AltaVista">AltaVista</a>.</li>
|
||
|
|
<li data-marpit-fragment="2">Term was coined in 2003 by <a href="https://en.wikipedia.org/wiki/Luis_von_Ahn">Luis von Ahn</a>, <a href="https://en.wikipedia.org/wiki/Manuel_Blum">Manuel Blum</a>, <a href="https://www-users.cse.umn.edu/~hoppernj/">Nicholas J. Hopper</a> and <a href="https://en.wikipedia.org/wiki/John_Langford_(computer_scientist)">John Langford</a>.</li>
|
||
|
|
<li data-marpit-fragment="3">Based on a <a href="https://en.wikipedia.org/wiki/Reverse_Turing_test">Reverse Turing test</a>.</li>
|
||
|
|
<li data-marpit-fragment="4">Created from <a href="https://ai-forum.com/opinion/unsolved-problems-in-ai/">open problems in AI</a>.</li>
|
||
|
|
</ul>
|
||
|
|
</section>
|
||
|
|
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="4" data-marpit-fragments="7">
|
||
|
|
<header>
|
||
|
|
<h1>What are CAPTCHAs for ?</h1>
|
||
|
|
</header>
|
||
|
|
<h2>They filter out the real humans !</h2>
|
||
|
|
<p>What is a non real human ?</p>
|
||
|
|
<ul>
|
||
|
|
<li data-marpit-fragment="1"><a href="https://en.wikipedia.org/wiki/Internet_bot">Bots</a> <img class="emoji" draggable="false" alt="🤖" src="https://twemoji.maxcdn.com/2/svg/1f916.svg" data-marp-twemoji=""/></li>
|
||
|
|
<li data-marpit-fragment="2"><a href="https://en.wikipedia.org/wiki/Web_crawler">Crawlers</a> <img class="emoji" draggable="false" alt="🕷️" src="https://twemoji.maxcdn.com/2/svg/1f577.svg" data-marp-twemoji=""/></li>
|
||
|
|
<li data-marpit-fragment="3"><a href="https://en.wikipedia.org/wiki/Web_scraping">Scrappers</a> <img class="emoji" draggable="false" alt="🐀" src="https://twemoji.maxcdn.com/2/svg/1f400.svg" data-marp-twemoji=""/></li>
|
||
|
|
<li data-marpit-fragment="4">Dogs <img class="emoji" draggable="false" alt="🐕" src="https://twemoji.maxcdn.com/2/svg/1f415.svg" data-marp-twemoji=""/> / Cats <img class="emoji" draggable="false" alt="🐈" src="https://twemoji.maxcdn.com/2/svg/1f408.svg" data-marp-twemoji=""/></li>
|
||
|
|
<li data-marpit-fragment="5"><a href="https://en.wikipedia.org/wiki/Spamming">Spammers</a> <img class="emoji" draggable="false" alt="📨" src="https://twemoji.maxcdn.com/2/svg/1f4e8.svg" data-marp-twemoji=""/></li>
|
||
|
|
<li data-marpit-fragment="6"><a href="https://en.wikipedia.org/wiki/Hacker">Hackers</a> <img class="emoji" draggable="false" alt="🏴☠️" src="https://twemoji.maxcdn.com/2/svg/1f3f4-200d-2620-fe0f.svg" data-marp-twemoji=""/></li>
|
||
|
|
<li data-marpit-fragment="7">Clément ? <img class="emoji" draggable="false" alt="👨🦰" src="https://twemoji.maxcdn.com/2/svg/1f468-200d-1f9b0.svg" data-marp-twemoji=""/></li>
|
||
|
|
</ul>
|
||
|
|
</section>
|
||
|
|
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="5">
|
||
|
|
<header>
|
||
|
|
<h1>Why are CAPTCHAs needed ?</h1>
|
||
|
|
</header>
|
||
|
|
<p><img src="https://www.imperva.com/blog/wp-content/uploads/sites/9/2021/04/Bad-Bod-Report-Fig-1-1024x466.png.webp" alt="" /></p>
|
||
|
|
<p>Source: <a href="https://www.imperva.com/blog/bad-bot-report-2021-the-pandemic-of-the-internet/">Imperva</a></p>
|
||
|
|
</section>
|
||
|
|
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="6">
|
||
|
|
<header>
|
||
|
|
<h1>some CAPTCHA examples</h1>
|
||
|
|
</header>
|
||
|
|
<iframe
|
||
|
|
id=recaptcha_iframe
|
||
|
|
src="https://democaptcha.com/demo-form-eng/recaptcha-2.html"
|
||
|
|
scrolling="no"
|
||
|
|
frameborder="0"
|
||
|
|
height="100%"
|
||
|
|
width="100%"
|
||
|
|
></iframe>
|
||
|
|
</section>
|
||
|
|
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="7">
|
||
|
|
<header>
|
||
|
|
<h1>some CAPTCHA examples</h1>
|
||
|
|
</header>
|
||
|
|
<iframe
|
||
|
|
id=recaptcha_iframe
|
||
|
|
src="https://democaptcha.com/demo-form-eng/hcaptcha.html"
|
||
|
|
frameborder="0"
|
||
|
|
height="100%"
|
||
|
|
width="100%"
|
||
|
|
></iframe>
|
||
|
|
</section>
|
||
|
|
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="8">
|
||
|
|
<header>
|
||
|
|
<h1>some CAPTCHA examples</h1>
|
||
|
|
</header>
|
||
|
|
<iframe
|
||
|
|
id=recaptcha_iframe
|
||
|
|
src="https://democaptcha.com/demo-form-eng/math-image.html"
|
||
|
|
frameborder="0"
|
||
|
|
height="100%"
|
||
|
|
width="100%"
|
||
|
|
></iframe>
|
||
|
|
</section>
|
||
|
|
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="9">
|
||
|
|
<header>
|
||
|
|
<h1>some CAPTCHA examples</h1>
|
||
|
|
</header>
|
||
|
|
<iframe
|
||
|
|
id=recaptcha_iframe
|
||
|
|
src="https://democaptcha.com/demo-form-eng/image.html"
|
||
|
|
frameborder="0"
|
||
|
|
height="100%"
|
||
|
|
width="100%"
|
||
|
|
></iframe>
|
||
|
|
</section>
|
||
|
|
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section data-marpit-advanced-background="background"><div data-marpit-advanced-background-container="true" data-marpit-advanced-background-direction="horizontal"><figure style="background-image:url("https://www.ionos.fr/digitalguide/fileadmin/DigitalGuide/Screenshots/EN-Captcha-Spamschutz-9.png");background-size:90%;"></figure></div></section></foreignObject><foreignObject width="1280" height="720"><section id="10" data-marpit-advanced-background="content">
|
||
|
|
<header>
|
||
|
|
<h1>some exotic CAPTCHA examples</h1>
|
||
|
|
</header>
|
||
|
|
</section>
|
||
|
|
</foreignObject><foreignObject width="1280" height="720" data-marpit-advanced-background="pseudo"><section style="" data-marpit-advanced-background="pseudo"></section></foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section data-marpit-advanced-background="background"><div data-marpit-advanced-background-container="true" data-marpit-advanced-background-direction="horizontal"><figure style="background-image:url("https://www.ionos.fr/digitalguide/fileadmin/DigitalGuide/Screenshots/EN-Captcha-Spamschutz-10.png");background-size:44%;"></figure></div></section></foreignObject><foreignObject width="1280" height="720"><section id="11" data-marpit-advanced-background="content">
|
||
|
|
<header>
|
||
|
|
<h1>some exotic CAPTCHA examples</h1>
|
||
|
|
</header>
|
||
|
|
</section>
|
||
|
|
</foreignObject><foreignObject width="1280" height="720" data-marpit-advanced-background="pseudo"><section style="" data-marpit-advanced-background="pseudo"></section></foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section data-marpit-advanced-background="background"><div data-marpit-advanced-background-container="true" data-marpit-advanced-background-direction="horizontal"><figure style="background-image:url("https://www.ionos.fr/digitalguide/fileadmin/DigitalGuide/Screenshots/EN-Captcha-Spamschutz-11.png");background-size:70%;"></figure></div></section></foreignObject><foreignObject width="1280" height="720"><section id="12" data-marpit-advanced-background="content">
|
||
|
|
<header>
|
||
|
|
<h1>some exotic CAPTCHA examples</h1>
|
||
|
|
</header>
|
||
|
|
</section>
|
||
|
|
</foreignObject><foreignObject width="1280" height="720" data-marpit-advanced-background="pseudo"><section style="" data-marpit-advanced-background="pseudo"></section></foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section data-marpit-advanced-background="background"><div data-marpit-advanced-background-container="true" data-marpit-advanced-background-direction="horizontal"><figure style="background-image:url("https://www.ionos.fr/digitalguide/fileadmin/DigitalGuide/Screenshots/EN-Captcha-Spamschutz-1.png");background-size:100%;"></figure></div></section></foreignObject><foreignObject width="1280" height="720"><section id="13" data-marpit-advanced-background="content">
|
||
|
|
<header>
|
||
|
|
<h1>some exotic CAPTCHA examples</h1>
|
||
|
|
</header>
|
||
|
|
</section>
|
||
|
|
</foreignObject><foreignObject width="1280" height="720" data-marpit-advanced-background="pseudo"><section style="" data-marpit-advanced-background="pseudo"></section></foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="14" data-marpit-fragments="5">
|
||
|
|
<header>
|
||
|
|
<h1>Possible attacks on CAPTCHAs ?</h1>
|
||
|
|
</header>
|
||
|
|
<p>Quite difficult and costly:</p>
|
||
|
|
<ul>
|
||
|
|
<li data-marpit-fragment="1"><a href="https://www.netacea.com/blog/what-are-captcha-farms/">Human Farms</a></li>
|
||
|
|
<li data-marpit-fragment="2"><a href="https://github.com/ultrafunkamsterdam/undetected-chromedriver">Flying under the radars</a></li>
|
||
|
|
<li data-marpit-fragment="3">Praying <img class="emoji" draggable="false" alt="🙏" src="https://twemoji.maxcdn.com/2/svg/1f64f.svg" data-marp-twemoji=""/> ?</li>
|
||
|
|
<li data-marpit-fragment="4"><a href="https://github.com/dessant/buster">It's an arms race</a></li>
|
||
|
|
<li data-marpit-fragment="5">Man In The Middle Attack</li>
|
||
|
|
</ul>
|
||
|
|
</section>
|
||
|
|
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="15" data-marpit-fragments="5">
|
||
|
|
<header>
|
||
|
|
<h1>Alternatives to CAPTCHAs ?</h1>
|
||
|
|
</header>
|
||
|
|
<p>Not much:</p>
|
||
|
|
<ul>
|
||
|
|
<li data-marpit-fragment="1"><a href="https://en.wikipedia.org/wiki/Honeypot_(computing)">Honeypot</a></li>
|
||
|
|
<li data-marpit-fragment="2"><a href="https://en.wikipedia.org/wiki/Multi-factor_authentication">SMS/email verification</a></li>
|
||
|
|
<li data-marpit-fragment="3"><a href="https://en.wikipedia.org/wiki/Central_Authentication_Service">Centralized sign-on</a></li>
|
||
|
|
<li data-marpit-fragment="4">Forced human interaction</li>
|
||
|
|
<li data-marpit-fragment="5">Motion-tracking</li>
|
||
|
|
</ul>
|
||
|
|
</section>
|
||
|
|
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="16" data-marpit-fragments="3">
|
||
|
|
<header>
|
||
|
|
<h1>Drawbacks ?</h1>
|
||
|
|
</header>
|
||
|
|
<ul>
|
||
|
|
<li data-marpit-fragment="1">Annoying</li>
|
||
|
|
<li data-marpit-fragment="2">Accessibility</li>
|
||
|
|
<li data-marpit-fragment="3">Privacy</li>
|
||
|
|
</ul>
|
||
|
|
</section>
|
||
|
|
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="17">
|
||
|
|
<script src="https://cdn.jsdelivr.net/npm/party-js@latest/bundle/party.min.js"></script>
|
||
|
|
<div class="yay" style="margin:0 auto;" onmousedown="party.confetti(this)">
|
||
|
|
🎉 Thank you for your attention 🎉
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<script>!function(){"use strict";const t="marpitSVGPolyfill:setZoomFactor,",e=Symbol();let r,o;function n(n){const i="object"==typeof n&&n.target||document,a="object"==typeof n?n.zoom:n;window[e]||(Object.defineProperty(window,e,{configurable:!0,value:!0}),window.addEventListener("message",(({data:e,origin:r})=>{if(r===window.origin)try{if(e&&"string"==typeof e&&e.startsWith(t)){const[,t]=e.split(","),r=Number.parseFloat(t);Number.isNaN(r)||(o=r)}}catch(t){console.error(t)}})));let l=!1;Array.from(i.querySelectorAll("svg[data-marpit-svg]"),(t=>{var e,n,i,s;t.style.transform||(t.style.transform="translateZ(0)");const c=a||o||t.currentScale||1;r!==c&&(r=c,l=c);const d=t.getBoundingClientRect(),{length:u}=t.children;for(let r=0;r<u;r+=1){const o=t.children[r],a=o.getScreenCTM();if(a){const t=null!==(n=null===(e=o.x)||void 0===e?void 0:e.baseVal.value)&&void 0!==n?n:0,r=null!==(s=null===(i=o.y)||void 0===i?void 0:i.baseVal.value)&&void 0!==s?s:0,l=o.firstElementChild,{style:u}=l;u.transformOrigin||(u.transformOrigin=`${-t}px ${-r}px`),u.transform=`scale(${c}) matrix(${a.a}, ${a.b}, ${a.c}, ${a.d}, ${a.e-d.left}, ${a.f-d.top}) translateZ(0.0001px)`}}})),!1!==l&&Array.from(i.querySelectorAll("iframe"),(({contentWindow:e})=>{null==e||e.postMessage(`${t}${l}`,"null"===window.origin?"*":window.origin)}))}r=1,o=void 0;const i=(t,e,r)=>{if(t.getAttribute(e)!==r)return t.setAttribute(e,r),!0};function a({once:t=!1,target:e=document}={}){const r="Apple Computer, Inc."===navigator.vendor?[n]:[];let o=!t;const a=()=>{for(const t of r)t({target:e});!function(t=document){Array.from(t.querySelectorAll('svg[data-marp-fitting="svg"]'),(t=>{var e;const r=t.firstChild,o=r.firstChild,{scrollWidth:n,scrollHeight:a}=o;let l,s=1;if(t.hasAttribute("data-marp-fitting-code")&&(l=null===(e=t.parentElement)||void 0===e?void 0:e.parentElement),t.hasAttribute("data-marp-fitting-math")&&(l=t.parentElement),l){const t=getComputedStyle(l),e=Math.ceil(l.clientWidth-parseFloat(t.paddingLeft||"0")-parseFloat(t.paddingRight||"0"));e&&(s=e)}const c=Math.max(n,s),d=Math.max(a,1),u=`0 0 ${c} ${d}`;i(r,"width",`${c}`),i(r,"height",`${d}`),i(t,"preserveAspectRatio",getComputedStyle(t).getPropertyValue("--preserve-aspect-ratio")||"xMinYMin meet"),i(t,"viewBox",u)&&t.classList.toggle("__reflow__")}))}(e),o&&window.requestAnimationFrame(a)};return a(),()=>{o=!1}}const l=Symbol(),s=document.currentScript;((t=document)=>{if("undefined"==typeof window)throw new Error("Marp Core's browser script is valid only in browser context.");if(t[l])return t[l];const e=a({target:t}),r=()=>{e(),delete t[l]};Object.defineProperty(t,l,{configurable:!0,value:r})})(s?s.getRootNode():document)}();
|
||
|
|
</script></foreignObject></svg></div><div class="bespoke-marp-note" data-index="0" tabindex="0"><p>Welcome dear fellow humans to our scientific presentation on CAPTCHAs</p><p>Dire plein de trucs bonus en cliquant en live sur les liens (en bleu) des slides</p><p>On en faisant le con sur les tests des captchas</p><p>Faire planer le doute tout du long si clément est réelement un humain</p></div><div class="bespoke-marp-note" data-index="1" tabindex="0"><p>So first of all, what is a captcha ?</p><p>By definition, CAPTCHAs are a completely automated...</p><p>So they are simply a tool for categorizing humans and non-humans</p><p>Turing was a brilliant famous mathematician of the last century, he is well known to be at founder of modern computers (turing machine...)</p><p>CAPTCHAs nowadays mostly present in your web browser (pretty much only place where you encounter them).</p><p>They a are what's called 3rd party software, meaning that they 99% of the time not dev by owner of site but by other organisation. This is due to the requirements that such a tool has. We'll talk a bit more about that in few seconds !</p><p>And they are pronounced /kæp.tʃə/.</p></div><div class="bespoke-marp-note" data-index="2" tabindex="0"><p>Let's see where captchas come from</p><p>Introduced by AltaVista, a web engine company when they wanted to prevent unwanted addition by nefarious users to their search engine. Because at the time, if you wanted your website to be referenced in a search engine, so that it could be found easily, you add to manually add them to their system.</p><p>At the time, this preventive system was unnamed. the term captcha was coined by four mathematicians / computer scientists in 2003, namely Luis...</p><p>It's based on a reverse turing test ! first of all a turing test is method for determining whether a computer is capable of human-like thinking. So reverse turing test is a method for testing wether or not something is a human or not.</p><p>They concieved so that they are practically impossible for current computers to decipher, but they must be easy enough for real humans to do.</p></div><div class="bespoke-marp-note" data-index="3" tabindex="0"><p>So captcha filter out non humans, this include</p><p>bots, a software application that runs automated tasks (scripts), usually with the intent to emulate human activity. They are fairly easy to code, and generally astonishly cheap. precisely who we want to restrict.</p><p>crawlers, an internet bot that browses the World Wide Web for the purpose of web indexing. They are most of the time used by search engines to better their search results, they mostly look at the metadata of pages (title, date, author, thumbnail, description, language, icons...), but they can also by used for more nefarious reasons, combined with scrappers for example.</p><p>scrappers, the automated extraction of data on websites via bots and crawlers, not just metadata anymore they are designed to gather a lot more data, phone numbers, emails, passwords (?), addresses, any precious info. They are generally badly viewed since they generally cause a lot of traffic on sites.</p><p>Dogs/cat KEKW</p><p>spammers, you don't want your contact form to be unprotected, or you'll soon receive email for special pills..</p><p>hackers, they actually are humans, but they generally use all the tools from above (except cat/dog) and you want to at least slow them down.</p><p>clément ? 😳</p></div><div class="bespoke-marp-note" data-index="4" tabindex="0"><p>Why all the trouble, are bots really that common ? yes</p><p>a study from Imperva in 2020, estimate human traffic to only be about 60%, some other studies are even more aggressive (less than 45% sometimes).</p><p>good bots, search engines, monitoring bots, commercials crawlers, feed fetchers...</p><p>bad bots, every tools that we saw before, hackers, state spies...</p><p>You may understand why one may want to protect some areas of his website</p></div><div class="bespoke-marp-note" data-index="5" tabindex="0"><p>In a way this type of challenge is relatively easy for
|
||
|
|
!function(){"use strict";const e=document.body,t=(...e)=>history.replaceState(...e),n="presenter",r="next",o=["",n,r],a="data-bespoke-marp-",i=(e,{protocol:t,host:n,pathname:r,hash:o}=location)=>{const a=e.toString();return`${t}//${n}${r}${a?"?":""}${a}${o}`},s=()=>e.dataset.bespokeView,l=e=>new URLSearchParams(location.search).get(e),c=(e,n={})=>{var r;const o={location,setter:t,...n},a=new URLSearchParams(o.location.search);for(const t of Object.keys(e)){const n=e[t];"string"==typeof n?a.set(t,n):a.delete(t)}try{o.setter({...null!==(r=window.history.state)&&void 0!==r?r:{}},"",i(a,o.location))}catch(e){console.error(e)}},d=(()=>{const e="bespoke-marp";try{return localStorage.setItem(e,e),localStorage.removeItem(e),!0}catch(e){return!1}})(),f=e=>{try{return localStorage.getItem(e)}catch(e){return null}},u=(e,t)=>{try{return localStorage.setItem(e,t),!0}catch(e){return!1}},m=e=>{try{return localStorage.removeItem(e),!0}catch(e){return!1}},g=(e,t)=>{const n="aria-hidden";t?e.setAttribute(n,"true"):e.removeAttribute(n)},p=e=>{e.parent.classList.add("bespoke-marp-parent"),e.slides.forEach((e=>e.classList.add("bespoke-marp-slide"))),e.on("activate",(t=>{const n="bespoke-marp-active",r=t.slide,o=r.classList,a=!o.contains(n);if(e.slides.forEach((e=>{e.classList.remove(n),g(e,!0)})),o.add(n),g(r,!1),a){const e=`${n}-ready`;o.add(e),document.body.clientHeight,o.remove(e)}}))},v=e=>{let t=0,n=0;Object.defineProperty(e,"fragments",{enumerable:!0,value:e.slides.map((e=>[null,...e.querySelectorAll("[data-marpit-fragment]")]))});const r=r=>void 0!==e.fragments[t][n+r],o=(r,o)=>{t=r,n=o,e.fragments.forEach(((e,t)=>{e.forEach(((e,n)=>{if(null==e)return;const i=t<r||t===r&&n<=o;e.setAttribute(`${a}fragment`,(i?"":"in")+"active");const s=`${a}current-fragment`;t===r&&n===o?e.setAttribute(s,"current"):e.removeAttribute(s)}))})),e.fragmentIndex=o;const i={slide:e.slides[r],index:r,fragments:e.fragments[r],fragmentIndex:o};e.fire("fragment",i)};e.on("next",(({fragment:a=!0})=>{if(a){if(r(1))return o(t,n+1),!1;const a=t+1;e.fragments[a]&&o(a,0)}else{const r=e.fragments[t].length;if(n+1<r)return o(t,r-1),!1;const a=e.fragments[t+1];a&&o(t+1,a.length-1)}})),e.on("prev",(({fragment:a=!0})=>{if(r(-1)&&a)return o(t,n-1),!1;const i=t-1;e.fragments[i]&&o(i,e.fragments[i].length-1)})),e.on("slide",(({index:t,fragment:n})=>{let r=0;if(void 0!==n){const o=e.fragments[t];if(o){const{length:e}=o;r=-1===n?e-1:Math.min(Math.max(n,0),e-1)}}o(t,r)})),o(0,0)},h=document,y=()=>!(!h.fullscreenEnabled&&!h.webkitFullscreenEnabled),x=()=>!(!h.fullscreenElement&&!h.webkitFullscreenElement),w=e=>{e.fullscreen=()=>{y()&&(async()=>{return x()?null===(e=h.exitFullscreen||h.webkitExitFullscreen)||void 0===e?void 0:e.call(h):((e=h.body)=>{var t;return null===(t=e.requestFullscreen||e.webkitRequestFullscreen)||void 0===t?void 0:t.call(e)})();var e})()},document.addEventListener("keydown",(t=>{"f"!==t.key&&"F11"!==t.key||t.altKey||t.ctrlKey||t.metaKey||!y()||(e.fullscreen(),t.preventDefault())}))},b="bespoke-marp-inactive",k=(e=2e3)=>({parent:t,fire:n})=>{const r=t.classList,o=e=>n(`marp-${e?"":"in"}active`);let a;const i=()=>{a&&clearTimeout(a),a=setTimeout((()=>{r.add(b),o()}),e),r.contains(b)&&(r.remove(b),o(!0))};for(const e of["mousedown","mousemove","touchend"])document.addEventListener(e,i);setTimeout(i,0)},E=["AUDIO","BUTTON","INPUT","SELECT","TEXTAREA","VIDEO"],L=e=>{e.parent.addEventListener("keydown",(e=>{if(!e.target)return;const t=e.target;(E.includes(t.nodeName)||"true"===t.contentEditable)&&e.stopPropagation()}))},$=e=>{window.addEventListener("load",(()=>{for(const t of e.slides){const e=t.querySelector("[data-marp-fitting]")?"":"hideable";t.setAttribute(`${a}load`,e)}}))},P=({interval:e=250}={})=>t=>{document.addEventListener("keydown",(e=>{if(" "===e.key&&e.shiftKey)t.prev();else if("ArrowLeft"===e.key||"ArrowUp"===e.key||"PageUp"===e.key)t.prev({fragment:!e.shiftKey});else if(" "!==e.key||e.shiftKey)if("ArrowRight"===e.key||"ArrowDown"===e.key||"PageDown"===e.key)t.next({fragment:!e.shiftKey});else if("End"===e.key)t.slide(t.slides.length-1,{fragment:-
|