บันทึกประจำสัปดาห์: Datasette Lite, s3-credentials, shot-scraper, datasette-edit-templates และอื่นๆ

แม้จะมีการ รบกวนจาก AI ฉันก็สามารถทำโครงการต่างๆ ได้คืบหน้าในสัปดาห์นี้ ซึ่งรวมถึงการเปิดตัว s3-credentials และ shot-scraper ใหม่ ปลั๊กอิน datasette-edit-templates ใหม่และการปรับปรุงเล็กน้อยแต่เรียบร้อยสำหรับ Datasette Lite

รองรับ GitHub ที่ดีกว่าสำหรับ Datasette Lite

Datasette Lite เป็น Datasette ที่ทำงานใน WebAssembly เดิมทีตั้งใจไว้เป็นการสาธิตเทคโนโลยีที่ยอดเยี่ยม มันกลายเป็นองค์ประกอบสำคัญของระบบนิเวศ Datasette ที่กว้างขึ้นอย่างรวดเร็ว – ในสัปดาห์นี้ ฉันเห็นว่า mySociety กำลังใช้มันเพื่อช่วยผู้คนในการสำรวจ WhatDo TheyKnow Authorities Dataset ของพวกเขา

สิ่งที่น่าสนใจอย่างหนึ่งเกี่ยวกับ Datasette Lite คือคุณสามารถป้อน URL ไปยังไฟล์ CSV, ไฟล์ฐานข้อมูล SQLite และแม้แต่สคริปต์เริ่มต้นของ SQL และมันจะดึงข้อมูลเหล่านั้นเข้าสู่เบราว์เซอร์ของคุณและให้บริการภายใน Datasette ฉันเขียนเพิ่มเติมเกี่ยวกับความสามารถนี้ในการ เข้าร่วมไฟล์ CSV ในเบราว์เซอร์ของคุณโดยใช้ Datasette Lite

มีสิ่งเดียวที่จับได้: เนื่องจาก URL เหล่านั้นถูกดึงโดย JavaScript ที่ทำงานในเบราว์เซอร์ของคุณ พวกเขาจึงต้องให้บริการจากโฮสต์ที่ตั้งค่าส่วนหัว Access-Control-Allow-Origin: * ( ดู MDN ) นี่ไม่ใช่เรื่องง่ายที่จะอธิบายให้คนอื่นฟัง!

ข่าวดีก็คือ GitHub ทำให้ทุกไฟล์สาธารณะ (และทุก Gist) ที่โฮสต์บน GitHub พร้อมใช้งานเป็นโฮสต์แบบคงที่พร้อมส่วนหัวเวทย์มนตร์นั้น

ข่าวร้ายคือคุณต้องรู้วิธีสร้าง URL นั้น! ลิงก์ “ดิบ” ของ GitHub เปลี่ยนเส้นทางไปยัง URL นั้น แต่การเรียก JavaScript fetch() ไม่สามารถติดตามการเปลี่ยนเส้นทางได้หากไม่มีส่วนหัวนั้น – และการเปลี่ยนเส้นทางของ GitHub ไปที่ไม่มี

ดังนั้นคุณจำเป็นต้องรู้ว่าหากคุณต้องการโหลดไฟล์ฐานข้อมูล SQLite จากหน้านี้บน GitHub:

https://github.com/lerocha/chinook-database/blob/master/ChinookDatabase/DataSources/Chinook_Sqlite.sqlite

ก่อนอื่นคุณต้องเขียน URL นั้นใหม่เป็นรายการต่อไปนี้ ซึ่งให้บริการด้วยส่วนหัว CORS ที่ถูกต้อง:

https://raw.githubusercontent.com/lerocha/chinook-database/master/ChinookDatabase/DataSources/Chinook_Sqlite.sqlite

การขอให้มนุษย์ทำอย่างนั้นด้วยมือนั้นไม่สมเหตุสมผล ดังนั้นฉันจึงเพิ่มรหัส!

 const githubUrl = / ^ https: \/ \/ ​​github.com \/ ( . * ) \/ ( . * ) \/ blob \/ ( . * ) ( \? raw=true ) ? $ / ;  
  
ฟังก์ชัน fixUrl ( url ) {  
  การ จับ คู่ const = githubUrl exec ( url ) ;  
  ถ้า ( ตรงกัน ) {  
    ส่งคืน `https://raw.githubusercontent.com/ ${ ตรงกัน [ 1 ] } / ${ ตรงกัน [ 2 ] } / ${ ตรงกัน [ 3 ] } ` ;  
  }  
  ส่งคืน url ;  
}

สนุกกัน: GitHub Copilot เติมข้อความอัตโนมัติที่คำสั่ง return ให้ฉัน เดาสตริง URL ที่ฉันต้องการอย่างถูกต้องตามนิพจน์ทั่วไปที่ฉันกำหนดไว้หลายบรรทัดก่อนหน้านี้

ตอนนี้ทุกครั้งที่คุณป้อน URL ของ Datasette Lite หากเป็นหน้า GitHub หน้านั้นจะเขียนใหม่โดยอัตโนมัติไปยังโดเมนที่เปิดใช้งาน CORS ที่เทียบเท่าในโดเมน raw.githubusercontent.com

ตัวอย่างบางส่วน:

datasette-edit-templates

ฉันเริ่มทำงานกับปลั๊กอินนี้เมื่อสองสามปีที่แล้ว แต่ไม่ได้ทำงาน ในที่สุดในสัปดาห์นี้ ฉันก็ ปิดฉบับแรก และจัดส่ง อัลฟ่ารุ่นแรกออก ไป

มันค่อนข้างสนุก ในการเปิดตัวครั้งแรก จะสร้างตาราง _templates_ ในฐานข้อมูลของคุณ จากนั้นจะอนุญาตให้ผู้ใช้ root ท (เรียกใช้ datasette data.db --root และคลิกลิงก์เพื่อลงชื่อเข้าใช้ในฐานะรูท) เพื่อแก้ไขชุดเทมเพลต Jinja เริ่มต้นของ Datasette โดยเขียนการเปลี่ยนแปลงลงในตารางใหม่นั้น

ชุดข้อมูลใช้เทมเพลตเหล่านั้นทันที มันเปลี่ยน Datasette ทั้งหมดให้เป็นอินเทอร์เฟซสำหรับแก้ไขตัวเอง

นี่คือตัวอย่างภาพเคลื่อนไหวที่แสดงการทำงานของปลั๊กอิน:

ภาพหน้าจอเคลื่อนไหว ตอนนี้เมนูแอป Datasette มีรายการแก้ไขเทมเพลต ซึ่งไปที่หน้าที่แสดงรายการเทมเพลตทั้งหมด หากคุณแก้ไขเทมเพลต _footer.html เพื่อเพิ่มเครื่องหมายอัศเจรีย์ในหน้าถัดไป ส่วนท้ายของชุดข้อมูลจะแสดงการเปลี่ยนแปลงนั้น

การใช้งานในปัจจุบันค่อนข้างแย่ แต่ฉันได้ยื่น ปัญหา ใน Datasette core เพื่อช่วยชี้แจงบางส่วน

s3-credentials get-objects และ put-objects

ฉันสร้าง ข้อมูลรับรอง s3 เพื่อแก้ปัญหาความหงุดหงิดอันดับหนึ่งของฉันกับ AWS S3: ระดับความซับซ้อนที่น่าประหลาดใจที่เกี่ยวข้องกับการออกหนังสือรับรอง IAM ที่สามารถเข้าถึงบัคเก็ต S3 เฉพาะได้เท่านั้น ฉันแนะนำมันใน s3-credentials: เครื่องมือสำหรับสร้าง credentials สำหรับ S3 buckets

เมื่อคุณสร้างข้อมูลรับรองแล้ว คุณต้องสามารถทำสิ่งต่างๆ กับข้อมูลดังกล่าวได้ ฉันพบว่าเครื่องมือ AWS CLI เริ่มต้นค่อนข้างใช้งานไม่ได้ ดังนั้น s3-credentials จึงมี คำสั่งอื่นๆ เพิ่มขึ้นอย่างต่อเนื่องและเมื่อฉันรู้สึกว่าจำเป็นต้องใช้คำสั่งเหล่านั้น

เวอร์ชันล่าสุด 0.14 เพิ่มอีกสองรายการ: get-objects และ put-objects

สิ่งเหล่านี้ช่วยให้คุณทำสิ่งนี้ได้:

 s3-credentials get-objects my-bucket -p "*.txt" -p "static/*.css"

สิ่งนี้จะดาวน์โหลดทุกคีย์ใน my-bucket ด้วยชื่อที่ตรงกับรูปแบบเหล่านั้น

 s3-credentials put-objects my-bucket one.txt ../other-directory

สิ่งนี้จะอัปโหลด one.txt และโฟลเดอร์ other-directory ทั้งหมดที่มีเนื้อหาทั้งหมด

เช่นเดียวกับโปรเจ็กต์ส่วนใหญ่ของฉัน GitHub ออกเธรดสำหรับแต่ละรายการรวมถึงบัญชีแบบละเอียดว่าฉันสรุปการออกแบบของพวกเขาอย่างไร – #68 สำหรับ put-objects และ #78 สำหรับ get-objects

shot-scraper –log-requests

shot-scraper เป็นเครื่องมือของฉันในการทำให้ภาพหน้าจอเป็นแบบอัตโนมัติ ซึ่ง สร้างขึ้นจาก Playwright

ฟีเจอร์ล่าสุดได้รับแรงบันดาลใจจาก Datasette Lite

ฉันมีความทะเยอทะยานอย่างต่อเนื่องที่จะให้ Datasette Lite ทำงาน แบบออฟไลน์ทั้งหมด โดยใช้ Service Workers

ขั้นตอนแรกคือการทำให้มันทำงาน โดยไม่ต้องโหลดทรัพยากรภายนอก – ขณะนี้มันชน PyPI และ CDN แยกกันหลายครั้งเพื่อดาวน์โหลดวงล้อทุกครั้งที่คุณโหลดแอปพลิเคชัน

ในการทำเช่นนั้น ฉันต้องการรายการทรัพย์สินทั้งหมดที่ดึงมาได้อย่างน่าเชื่อถือ

จะสะดวกไหม ถ้าฉันสามารถเรียกใช้คำสั่งและรับรายการทรัพยากรเหล่านั้นได้

คำสั่งต่อไปนี้ทำอย่างนั้น:

 shot-scraper https://lite.datasette.io/ \ --wait-for 'document.querySelector("h2")' \ --log-requests requests.log

นี่’ --wait-for จำเป็นเพื่อให้แน่ใจว่า shot-scraper จะไม่หยุดจนกว่าแอปพลิเคชันจะโหลดจนเต็ม – ตรวจพบโดยรอให้องค์ประกอบ <h2> ถูกเพิ่มลงในหน้า

--log-requests bit เป็น คุณลักษณะใหม่ ใน shot-scraper 0.15 : ออกจากระบบไฟล์ JSON ที่คั่นด้วยการขึ้นบรรทัดใหม่พร้อมรายละเอียดของทรัพยากรทั้งหมดที่ดึงมาระหว่างการทำงาน ไฟล์นั้นเริ่มดังนี้:

 {"method": "GET", "url": "https://lite.datasette.io/", "size": 10516, "timing": {...}} {"method": "GET", "url": "https://plausible.io/js/script.manual.js", "size": 1005, "timing": {...}} {"method": "GET", "url": "https://latest.datasette.io/-/static/app.css?cead5a", "size": 16230, "timing": {...}} {"method": "GET", "url": "https://lite.datasette.io/webworker.js", "size": 4875, "timing": {...}} {"method": "GET", "url": "https://cdn.jsdelivr.net/pyodide/v0.20.0/full/pyodide.js", "size": null, "timing": {...}}

สิ่งนี้ค่อนข้างมีประโยชน์อยู่แล้ว… แต่จะมีประโยชน์มากกว่านี้ไหมหากฉันสามารถสำรวจข้อมูลนั้นใน Datasette ได้

นั่นคือสิ่งที่สูตรนี้ทำ:

 shot-scraper https://lite.datasette.io/ \ --wait-for 'document.querySelector("h2")' \ --log-requests - | \ sqlite-utils insert /tmp/datasette-lite.db log - --flatten --nl

มันกำลังวาง JSON ที่คั่นด้วยบรรทัดใหม่ไปยัง sqlite-utils insert จากนั้นแทรกโดยใช้ตัวเลือก --flatten เพื่อเปลี่ยนออบเจ็กต์ timing ที่ซ้อนกันนั้นเป็นชุดคอลัมน์แบบแบน

ฉันตัดสินใจแชร์โดยเปลี่ยนให้เป็น SQL dump และเผยแพร่ไปยัง Gist นี้ ฉันทำอย่างนั้นโดยใช้คำสั่ง sqlite-utils memory เพื่อแปลงเป็น SQL dump ดังนี้:

 shot-scraper https://lite.datasette.io/ \ --wait-for 'document.querySelector("h2")' \ --log-requests - | \ sqlite-utils memory stdin:nl --flatten --dump > dump.sql

stdin:nl หมายถึง “อ่านจากอินพุตมาตรฐานและถือว่าเป็น JSON ที่คั่นด้วยการขึ้นบรรทัดใหม่” จากนั้นฉันเรียกใช้คำสั่ง select * และใช้ --dump เพื่อส่งออกที่ dump.sql ซึ่งฉันวางลงใน Gist ใหม่

ตอนนี้ฉันสามารถ เปิดผลลัพธ์ใน Datasette Lite ได้แล้ว !

ชุดข้อมูลพายุทราย

Sandstorm คือ “แพลตฟอร์มโอเพ่นซอร์สสำหรับเว็บแอปที่โฮสต์ตัวเอง” คุณสามารถคิดว่ามันเป็น UI ที่ใช้งานง่ายบนแพลตฟอร์มคอนเทนเนอร์ที่เหมือน Docker – เมื่อคุณติดตั้งบนเซิร์ฟเวอร์แล้ว คุณสามารถใช้เพื่อจัดการและติดตั้งแอปพลิเคชันที่รวมไว้สำหรับมันได้

Jacob Weisz ทำอย่างนั้นสำหรับ Datasette ผลลัพธ์คือ ชุดข้อมูลใน Sandstorm App Market

รายชื่อ Datasette บน Sandstorm App Market พร้อมปุ่ม DEMO ที่โดดเด่น

คุณสามารถดูวิธีการทำงานใน ocdtrekkie/datasette-sandstorm repo ฉันช่วยด้วยการสร้าง ปลั๊กอิน datasette-sandstorm-support ขนาดเล็กเพื่อแสดงว่าการอนุญาตและการรับรองความถูกต้องสามารถทำงานกับ ส่วนหัว HTTP ที่กำหนดเอง ของ Sandstorm ได้อย่างไร

วางจำหน่ายสัปดาห์นี้

  • s3-credentials : 0.14 – ( 15 releases total ) – 2022-09-15
    เครื่องมือสำหรับสร้างข้อมูลรับรองสำหรับการเข้าถึงบัคเก็ต S3
  • shot-scraper : 0.16 – ( 21 releases total ) – 2022-09-15
    ยูทิลิตี้บรรทัดคำสั่งสำหรับการจับภาพหน้าจออัตโนมัติของเว็บไซต์
  • datasette-edit-templates : 0.1a0 – 2022-09-14
    ปลั๊กอินที่อนุญาตให้แก้ไขเทมเพลต Datasette ภายใน Datasette
  • datasette-sandstorm-support : 0.1 – 2022-09-14
    การตรวจสอบสิทธิ์และการอนุญาตสำหรับชุดข้อมูลบน Sandstorm
  • datasette-upload-dbs : 0.1.2 – ( ทั้งหมด 3 รุ่น ) – 2022-09-09
    อัปโหลดไฟล์ฐานข้อมูล SQLite ไปยัง Datasette
  • datasette-upload-csvs : 0.8.2 – ( 13 รุ่นทั้งหมด ) – 2022-09-08
    ปลั๊กอินชุดข้อมูลสำหรับการอัปโหลดไฟล์ CSV และแปลงเป็นตารางฐานข้อมูล

TIL สัปดาห์นี้

ใส่ความเห็น

อีเมลของคุณจะไม่แสดงให้คนอื่นเห็น