10.12. CORS dan CSRF

CORS dan CSRF adalah dua proteksi sisi browser yang dibutuhkan kamera yang terbuka di internet bersama HTTPS dan login. Masing-masing membutuhkan beberapa baris untuk disiapkan. Bagian di bawah mendefinisikan istilah dan menunjukkan integrasi microdot.

10.12.1. Apa yang dilakukan CORS

Cross-Origin Resource Sharing (CORS) adalah mekanisme browser yang memungkinkan server memilih untuk mengizinkan origin tertentu lainnya membaca responsnya. Kebijakan same-origin default browser memblokir pembacaan itu: JavaScript di https://example.com tidak dapat membaca respons dari https://yard-cam.example.com, karena host yang berbeda dihitung sebagai origin yang berbeda. CORS adalah cara sisi server untuk memberikan pengecualian bagi rekan yang dipilih.

Jika dasbor disajikan dari kamera itu sendiri, setiap permintaan adalah same-origin dan CORS tidak melakukan apa-apa. Pengaturan ini penting ketika dasbor berada di tempat lain -- URL publik seperti https://app.example.com yang berbicara ke kamera di https://yard-cam.example.com:

from microdot.cors import CORS

cors = CORS(
    app,
    allowed_origins=['https://app.example.com'],
    allow_credentials=True,
    max_age=86400,
)

allowed_origins adalah daftar origin yang diizinkan untuk membaca respons kamera. Origin dasbor dan hanya origin dasbor -- bukan * -- sehingga situs pihak ketiga tidak dapat membaca respons kamera secara tidak sengaja.

allow_credentials=True memungkinkan permintaan cross-origin menyertakan cookie sesi, yang dibutuhkan dasbor untuk tetap masuk melewati batas origin.

max_age=86400 memberi tahu browser bahwa ia dapat menyimpan hasil preflight selama sehari. Browser mengirim permintaan OPTIONS tambahan sebelum panggilan cross-origin apa pun yang menggunakan metode selain GET/HEAD/POST atau mengirim header kustom; max_age memotong overhead tersebut menjadi satu preflight per hari per rute.

10.12.2. Apa yang dilakukan CSRF

Cross-Site Request Forgery (CSRF) adalah serangan di mana halaman berbahaya membuat browser pengguna mengirimkan permintaan yang terautentikasi ke server tepercaya. Meskipun CORS aktif, <form> tersembunyi di evil.com yang mem-POST ke https://yard-cam.example.com/config akan sampai ke kamera, dan browser akan melampirkan cookie sesi kamera -- cookie mengikuti host tujuan, bukan origin halaman yang membuat permintaan -- sehingga kamera dengan senang hati memproses POST seolah-olah itu adalah pemilik.

Proteksi CSRF menolak permintaan tersebut. microdot.csrf.CSRF menambahkan middleware yang memeriksa header Sec-Fetch-Site pada setiap permintaan yang mengubah status dan menolak apa pun yang tidak berlabel same-origin (atau berasal dari origin yang diizinkan oleh CORS):

from microdot.csrf import CSRF

CSRF(app, cors=cors)

Meneruskan instance cors memungkinkan middleware untuk menerima origin yang diizinkan dasbor -- kamera masih menerima POST dasbor meskipun bersifat cross-origin.

Sec-Fetch-Site disetel oleh browser modern secara otomatis; kamera tidak perlu melakukan apa pun di sisi klien. Untuk browser lama yang tidak mengirim header, daftar izin CORS adalah pemeriksaan cadangan.

10.12.3. Mengecualikan webhook

Jika kamera memerlukan endpoint webhook untuk menerima POST dari layanan cloud pihak ketiga -- callback dari penyedia arsip, misalnya -- tandai rute @csrf.exempt sehingga middleware membiarkannya lewat. Handler bertanggung jawab untuk memverifikasi permintaan dengan cara lain -- biasanya Hash-based Message Authentication Code (HMAC) atas payload, dihitung dengan rahasia yang dibagikan kamera dan pihak ketiga, yang membuktikan permintaan berasal dari seseorang yang mengetahui rahasianya. Kamera halaman belakang tidak memiliki salah satu dari itu, tetapi dekoratornya ada ketika Anda membutuhkannya.

10.12.4. Empat baris dasar

Setelah HTTPS aktif, tumpukan yang direkomendasikan untuk penerapan kamera yang menghadap internet adalah:

Session(app, secret_key=SECRET,
        cookie_options={'http_only': True, 'secure': True})
login = Login()
cors = CORS(app, allowed_origins=[...], allow_credentials=True)
CSRF(app, cors=cors)

Sesi dan login di awal bab, CORS dan CSRF di sini, HTTPS dari topik sebelumnya. Empat bagian bertumpuk di atas satu sama lain dan tidak mengganggu setiap rute.

Kamera sekarang aman untuk menghadap internet terbuka -- HTTPS, login, CSRF, CORS.