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가 네 에셋을 allowlist에 유지해.

엄격하게 시작, 필요한 것만 열어

앱을 로드하는 제일 빡빡한 정책 — default-src 'self' — 으로 시작하고, 실제로 쓰는 소스만 딱 추가해: connect-src 아래 API 호스트, font-src 아래 폰트 CDN, 로컬 파일을 이미지로 로드하면 img-src 아래 Tauri asset 프로토콜. 느슨하게 하는 모든 디렉티브가 문이야. 기능이 필요한 특정 것만 열고 그 이상은 안 돼. 엄격한 CSP + scope된 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'로 시작하는 진짜 정책으로 바꿔. 앱을 돌리고 깨지는 건 필요한 특정 소스를 더해서 고쳐(예: connect-src 아래 API 호스트). 이 연습은 앱이 실제로 로드하는 모든 외부 리소스를 셈하게 해서 정책을 가르쳐.

Hint

엄격하게 시작하고 브라우저 콘솔을 읽어: 막힌 리소스마다 어떤 디렉티브/소스를 더할지 정확히 알려줘. API 호출 실패면 connect-src, 막힌 이미지면 img-src. 와일드카드 말고 특정 호스트를 더해.