> Uncaught TypeError: Document.write: Sink type mismatch violation blocked by CSP 直し方おしえろください

エラーの意味は「CSPの require-trusted-types-for 'script' によって、document.write への文字列代入がブロックされた」というものです。github+1

対応は大きく分けて「CSP側を緩める」か「コード側を直す」の2択になります。blog.jxck+1

まず確認すること

• 実際に出ているエラー全文（例: CSPTrustedTypesSinkViolation）

• レスポンスヘッダの Content-Security-Policy（ブラウザの開発者ツール → Network → 該当リクエスト → Headers → Response Headers）

  • require-trusted-types-for 'script' が入っているかを確認する。qiita+1

手っ取り早い回避（開発・検証用）

「Trusted Types いらない」「とにかく動かしたい」なら:

1. サーバー側で付けている CSP ヘッダから
   require-trusted-types-for 'script' を削除する。blog.jxck+1

2. もし meta タグで CSP を設定しているなら、その中から同じ指定を削除する。

ただしこれはセキュリティを弱めるので、本番環境では非推奨です。qiita+1

ちゃんと直すパターン（推奨）

Trusted Types を有効にしたまま直したい場合は、生の document.write をやめる必要があります。blog.jxck+1

よくある修正パターン:

• そもそも document.write 自体をやめて、以下のような通常の DOM 操作に置き換える

  • element.textContent = ...

  • element.insertAdjacentHTML(...) も Trusted Types の対象なので注意。qiita​

• どうしても HTML を差し込みたい場合は Trusted Types のポリシーを作る（上級者向け）
  例（イメージ）:

  js
  const policy = trustedTypes.createPolicy('appPolicy', {
    createHTML(input) {
      // ここでサニタイズ等を行う
      return input;
    },
  });
  
  document.write(policy.createHTML('<p>safe</p>'));
  

  このように TrustedHTML を返す関数を経由すれば、CSPの require-trusted-types-for 'script' を満たせます。qiita​

どこを触ればいいかわからない場合

• 自分でCSPを設定していないのにエラーが出る →
  フレームワーク / SaaS / 親ページ側でCSPが強制されている可能性があります。powerdaaps.hatenablog​
  その場合は:

  • そのサービスの設定画面やドキュメントで「Content Security Policy」「Trusted Types」関連の設定を探す。powerdaaps.hatenablog+1

  • そこで require-trusted-types-for 'script' をオフにするか、推奨される回避方法に従う。

あなたのコードを直すのを手伝う

document.write を使っている箇所のコード（と、CSPヘッダ or meta タグの中身）が分かれば、
「ここをこう書き換えればOK」という具体的な修正例を出せます。

• 関連する HTML（<meta http-equiv="Content-Security-Policy" ...> があればそこ）

• document.write を呼んでいる JavaScript

この2つを貼ってもらえれば、コピペで差し替えられる形で修正版を書きます。