Tauri의 Content Security Policy

"capability는 다리를 지켜. CSP는 페이지 자체를 지키고 — 주입이 애초에 벌어지는 그 층을."

두 층, 각자의 일

capability는 웹뷰가 어떤 네이티브 권한에 닿을지를 정해. Content Security Policy는 한 층 위에서 일해. 웹뷰한테 어떤 스크립트랑 스타일이랑 이미지랑 연결이 애초에 페이지 안에 들어와도 되는지를 알려주지. 잘 짠 CSP는 고전적인 XSS 경로를 막아 — 공격자가 <script>나 인라인 onclick을 끼워 넣으면 브라우저가 기꺼이 실행해줄 텐데, 그걸 막는 거야. 층을 겹쳐 막는 거지. CSP가 주입 자체를 어렵게 만들고, capability가 그래도 뚫렸을 때 피해를 가둬.

csp: null은 프로토타이핑에서만

스캐폴드는 흔히 "csp": null을 넣어두는데, '정책 없음'이란 뜻이야. 이것저것 해보는 동안엔 편하지만 XSS 방어가 0이지. 내보내기 전에 app.security.csp에 진짜 CSP를 넣어. 도움이 되는 부분도 있어. Tauri가 함께 실은 스크립트랑 스타일의 해시나 nonce를 알아서 넣어주니까, 빡빡한 정책이 앱의 멀쩡한 코드까지 막는 일은 없어. 넌 정책을 선언하고, 네 에셋을 허용 목록에 유지하는 건 Tauri가 맡아.

빡빡하게 시작해서 필요한 것만 열어

앱이 뜨는 선에서 제일 빡빡한 정책 — default-src 'self' — 으로 시작하고, 실제로 쓰는 소스만 하나씩 더해. API 호스트는 connect-src 아래, 폰트 CDN은 font-src 아래, 로컬 파일을 이미지로 부른다면 Tauri asset 프로토콜을 img-src 아래. 느슨하게 만드는 디렉티브 하나하나가 문이야. 기능에 필요한 그것만 열고 그 이상은 안 돼. 빡빡한 CSP에 좁게 조인 capability, 그게 '안전한 Tauri 앱'의 구체적인 뜻이야.

Code

출발점 CSP (네 실제 소스에 맞춰 조이고 풀어)·json

// tauri.conf.json — null 대신 진짜 CSP.
// Tauri가 '네' 번들 스크립트의 nonce/해시를 자동 주입하니까,
// 'self' + 네 특정 소스면 충분해.
{
  "app": {
    "security": {
      "csp": {
        "default-src": "'self'",
        "img-src": "'self' asset: data:",
        "connect-src": "'self' https://api.example.com",
        "style-src": "'self' 'unsafe-inline'",
        "font-src": "'self'"
      }
    }
  }
}

Exercise

앱의 csp: null을 default-src 'self'로 시작하는 진짜 정책으로 바꿔. 앱을 돌리고, 깨지는 게 있으면 필요한 소스를 딱 집어 더해서 고쳐(API 호스트를 connect-src 아래 넣는다든지). 이 연습은 앱이 실제로 불러오는 바깥 리소스를 전부 세어보게 만들어서 정책을 가르쳐줘.

Hint

빡빡하게 시작하고 브라우저 콘솔을 읽어. 막힌 리소스마다 어떤 디렉티브에 어떤 소스를 더해야 하는지 정확히 알려줘. API 호출이 실패하면 connect-src, 이미지가 막히면 img-src. 와일드카드 말고 딱 그 호스트를 적어.