2c:null 2d:["$","title",null,{"children":"QR Code, pass sanitaire et vie privée | Thomas Parisot | Observable"}] 32:[] 30:{"id":"5565242626eecc33","slug":"qr-code-pass-sanitaire","title":"QR Code, pass sanitaire et vie privée","thumbnail":"ec37d35ab9198aa255f534fff467ece623815101dd0537d5772926f69163f77e","access_level":"public","create_time":"$D2021-07-14T14:24:30.657Z","update_time":"$D2021-08-12T18:23:10.160Z","view_time":null,"first_public_time":"$D2021-07-14T15:27:00.194Z","has_unpublished_edits":null,"fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"2e47ffb87e7621ba","login":"thom4","name":"Thomas Parisot","avatar_url":"https://avatars-next.observableusercontent.com/20af6aecdac86e856fff9682815248802780c6d963ad6a7e70fe16aa6b8be2c3","tier":"starter_2024","bio":"I design web software, facilitate team work and bake sourdough bread • I believe in autonomy and kindness • @bbcrd alumnus"},"version":793,"publish_version":793,"role":null,"authored":false,"authors":[{"type":"individual","id":"b5360110032f691c","login":"thom4","name":"Thomas Parisot","avatar_url":"https://avatars-next.observableusercontent.com/20af6aecdac86e856fff9682815248802780c6d963ad6a7e70fe16aa6b8be2c3","tier":null,"bio":"I design web software, facilitate team work and bake sourdough bread • I believe in autonomy and kindness • @bbcrd alumnus"}],"members":[{"type":"individual","id":"b5360110032f691c","login":"thom4","name":"Thomas Parisot","avatar_url":"https://avatars-next.observableusercontent.com/20af6aecdac86e856fff9682815248802780c6d963ad6a7e70fe16aa6b8be2c3","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":3,"collection":null,"type":"notebook","body":{"titling":"auto","title":"QR Code, pass sanitaire et vie privée","cells":[{"id":0,"value":"# QR Code, pass sanitaire et vie privée\n\nUtilise ton appareil photo de smartphone sur chacun des codes pour expérimenter la lecture de leur contenu, sans application spécifique.\n\nLe premier exemple est interactif — le QR code s'adapte à la saisie utilisateur.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"## 1. Encoder des données en image","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"viewof bcid = Radio(visual_formats, { label: 'Type de code', value: 'qrcode' })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"viewof code_value = Textarea({ label: \"Texte libre, à encoder en image\", value: \"Example\", placeholder: \"\", help: \"Blaah\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":56,"value":"{\n const context = DOM.context2d(200, 200)\n\n code_value && qr.toCanvas(context.canvas, {\n bcid,\n text: code_value,\n // scale: 2,\n height: 300,\n width: 300,\n includetext: true\n })\n\n yield context.canvas\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":302,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":146,"value":"## 2. QR Code de TousAntiCovid","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":183,"value":"{\n const context = DOM.context2d(200, 200)\n\n qr.toCanvas(context.canvas, {\n bcid,\n text: tous_anti_covid_data,\n // scale: 2,\n height: 300,\n width: 300,\n includetext: true\n })\n\n yield context.canvas\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":288,"value":"### Données servant à constituer l'image","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":509,"value":"html`

${ tous_anti_covid_data }

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":279,"value":"### Vérification de l'authenticité du code","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":242,"value":"tous_anti_covid_public_key = \"-----BEGIN PUBLIC KEY-----MFkwEwYHKoZIzj0CAQYIKoZIzj0DAQcDQgAEqY8NfM1igIiTvsTUNuedGDSh1uAB1w8cTNzNnZ4v4in3JAUU6N3AypjQx0QMnMSShJoPvac/w5L02grgf4TCPA==-----END PUBLIC KEY-----\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":251,"value":"vac.tryVerifySignature(tous_anti_covid_public_key) ? html`Ce QR Code a été émis par une authorité de santé.` : html`Ce QR Code n'a pas été émis par une autorité de santé.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":271,"value":"### Données contenues dans le code","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":187,"value":"{\n const t = new Table(Object.entries(vac), { maxWidth: 320 })\n return html`

${ t.toString() }

`\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":308,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":151,"value":"## 3. QR Code du pass sanitaire européen\n\nSon processus de création [est documenté publiquement](https://github.com/ehn-dcc-development/hcert-spec/blob/main/README.md).\n[Cet article m'a aidé à comprendre comment décoder le code](https://dev.to/lmillucci/javascript-how-to-decode-the-greenpass-qr-code-3dh0).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":702,"value":"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":351,"value":"{\n const context = DOM.context2d(200, 200)\n\n qr.toCanvas(context.canvas, {\n bcid,\n text: ehc_data,\n scale: 2,\n height: 400,\n width: 400,\n includetext: true\n })\n\n yield context.canvas\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":334,"value":"### Données servant à constituer l'image","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":545,"value":"html`

${ ehc_data }

${t.toString()}

`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":134,"value":"---\n\n## Annexes","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":109,"value":"visual_formats = new Map([ ['QR Code', 'qrcode'], ['DataMatrix', 'datamatrix'] ])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":157,"value":"tous_anti_covid_data = 'DC04FR0000011E6D1E6DL101FRL0THEOULE SUR MER\\u001dL1JEAN PAUL\\u001dL231051962L3COVID-19\\u001dL4J07BX03\\u001dL5COMIRNATY PFIZER/BIONTECH\\u001dL6COMIRNATY PFIZER/BIONTECH\\u001dL71L82L901032021LACO\\u001f32T2SI2RUMPDLBHAFSBDF2CUE7GI4NR5WC3NSBEU6AZ7QZJZCPMCTXTVIDZAKEYO7237SQ2ZPOCMZKG7U3Q2LIMPPVJMA7TQAAKC5DY'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":335,"value":"ehc_data = 'HC1:NCFOXN%TS3DH3ZSUZK+.V0ETD%65NL-AH-R6IOO6+IUKRG*I.I5BROCWAAT4V22F/8X*G3M9JUPY0BX/KR96R/S09T./0LWTKD33236J3TA3M*4VV2 73-E3GG396B-43O058YIB73A*G3W19UEBY5:PI0EGSP4*2DN43U*0CEBQ/GXQFY73CIBC:G 7376BXBJBAJ UNFMJCRN0H3PQN*E33H3OA70M3FMJIJN523.K5QZ4A+2XEN QT QTHC31M3+E32R44$28A9H0D3ZCL4JMYAZ+S-A5$XKX6T2YC 35H/ITX8GL2-LH/CJTK96L6SR9MU9RFGJA6Q3QR$P2OIC0JVLA8J3ET3:H3A+2+33U SAAUOT3TPTO4UBZIC0JKQTL*QDKBO.AI9BVYTOCFOPS4IJCOT0$89NT2V457U8+9W2KQ-7LF9-DF07U$B97JJ1D7WKP/HLIJLRKF1MFHJP7NVDEBU1J*Z222E.GJF67Z JA6B.38O4BH*HB0EGLE2%V -3O+J3.PI2G:M1SSP2Y3D38-G9C+Q3OT/.J1CDLKOYUV5C3W1A:75S4LB:6REPKM3ZYO4+QDNDLT2*ESLIH'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":240,"value":"vac = new fhc.Vaccination(tous_anti_covid_data)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":499,"value":"ehc_decoded_data = {\n const [, unpreffixed_data] = ehc_data.split(\"HC1:\");\n const decoded_data = base45.decode(unpreffixed_data);\n const uncompressed_data = zlib.inflate(decoded_data);\n const [headers1, headers2, cbor_data, signature] = cbor.decodeFirstSync(\n uncompressed_data\n ).value;\n const decrypted_data = cbor.decodeFirstSync(cbor_data).get(-260).get(1);\n\n return decrypted_data;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":792,"value":"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":296,"value":"### Programmes tiers, utilisés pour la démonstration","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2,"value":"import {Button, Radio, Select, Text, Textarea, html} from '@observablehq/inputs'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"qr = require('bwip-js')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":159,"value":"fhc = require('https://bundle.run/france-ehealth-certificates@1.0.4')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":207,"value":"Table = require('https://bundle.run/table-layout@2.1.0')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":719,"value":"flatten = import('https://cdn.skypack.dev/safe-flat@2.0.2?min')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":362,"value":"base45 = require('https://bundle.run/base45@3.0.0')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":378,"value":"cbor = require('https://bundle.run/cbor-web@8.0.1')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":395,"value":"zlib = import('https://unpkg.com/pako@2.0.3/dist/pako.esm.mjs?module')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":516,"value":"### Styles de présentation","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":519,"value":"","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":694,"value":"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1"}} 31:"$30:body"