remove csp and assetProtocol, escape problem in production that don't appear in dev

Cargo.lock

@@ -1981,12 +1981,6 @@ dependencies = [
  "pin-project-lite",
 ]
 
-[[package]]
-name = "http-range"
-version = "0.1.5"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "21dec9db110f5f872ed9699c3ecf50cf16f423502706ba5c72462e28d3157573"
-
 [[package]]
 name = "httparse"
 version = "1.10.1"
@@ -4843,7 +4837,6 @@ dependencies = [
  "gtk",
  "heck 0.5.0",
  "http",
- "http-range",
  "jni",
  "libc",
  "log",

src-react/src/App.css

@@ -50,7 +50,7 @@ html.dark .glossaries {
     word-break: keep-all;
   }
 
-  img[src$=".svg"] {
+  img[src$=".svg"], img[src^="data:image/svg"] {
     filter: invert(1) hue-rotate(180deg);
   }
 

src-react/src/components/Glossary.tsx

@@ -1,13 +1,12 @@
-import { createElement as h } from "react";
+import { createElement as h, useEffect, useState } from "react";
+import { BaseDirectory, readFile } from "@tauri-apps/plugin-fs";
 
 export default function Glossary({
   glossary,
-  yomitanURL,
   maxLength,
   onTermClicked,
 }: {
   glossary: any;
-  yomitanURL: string;
   maxLength?: number;
   onTermClicked: (t: string) => void;
 }) {
@@ -31,17 +30,14 @@ export default function Glossary({
 
   // GlossaryImage
   if ("type" in glossary && glossary.type === "image") {
-    return <GlossaryImage img={glossary} yomitanURL={yomitanURL} />;
+    return <GlossaryImage img={glossary} />;
   }
 
   // GlossaryStructuredContent
   if ("type" in glossary && glossary.type === "structured-content") {
     const sc = glossary;
     return (
-      <StructuredContent
-        node={sc.content}
-        {...{ yomitanURL, maxLength, onTermClicked }}
-      />
+      <StructuredContent node={sc.content} {...{ maxLength, onTermClicked }} />
     );
   }
 
@@ -54,11 +50,32 @@ export default function Glossary({
   return null;
 }
 
-function GlossaryImage({ img, yomitanURL }: { img: any; yomitanURL: string }) {
+function GlossaryImage({ img }: { img: any }) {
+  const [src, set_src] = useState(img.path);
+
+  useEffect(() => {
+    readFile("yomitan/" + img.path, {
+      baseDir: BaseDirectory.AppData,
+    }).then((b) => {
+      const r = new FileReader();
+      r.onload = () => {
+        const dataSrc = r.result as string;
+        const ext = img.path.split(".").pop();
+        set_src(
+          dataSrc.replace(
+            "data:application/octet-stream",
+            "data:image/" + (ext === "svg" ? "svg+xml" : ext),
+          ),
+        );
+      };
+      r.readAsDataURL(new File([b], img.path));
+    });
+  });
+
   return (
     <img
       className="glossary-image"
-      src={`${yomitanURL || ""}/${img.path}`}
+      src={src}
       title={img.title}
       alt={img.alt}
       style={{
@@ -72,12 +89,10 @@ function GlossaryImage({ img, yomitanURL }: { img: any; yomitanURL: string }) {
 
 function StructuredContent({
   node,
-  yomitanURL,
   maxLength,
   onTermClicked,
 }: {
   node: any;
-  yomitanURL: string;
   maxLength?: number;
   onTermClicked: (t: string) => void;
 }): any {
@@ -102,7 +117,7 @@ function StructuredContent({
           <StructuredContent
             key={i}
             node={n}
-            {...{ yomitanURL, maxLength, onTermClicked }}
+            {...{ maxLength, onTermClicked }}
           />
         ))}
       </>
@@ -119,7 +134,7 @@ function StructuredContent({
 
   // Image
   if (tag === "img") {
-    return <GlossaryImage img={node} yomitanURL={yomitanURL} />;
+    return <GlossaryImage img={node} />;
   }
 
   // Link
@@ -144,10 +159,7 @@ function StructuredContent({
         }}
       >
         {content ? (
-          <StructuredContent
-            node={content}
-            {...{ yomitanURL, maxLength, onTermClicked }}
-          />
+          <StructuredContent node={content} {...{ maxLength, onTermClicked }} />
         ) : null}
       </a>
     );
@@ -161,7 +173,6 @@ function StructuredContent({
     { style: block.style, title: block.title, open: block.open },
     StructuredContent({
       node: block.content,
-      yomitanURL,
       maxLength,
       onTermClicked,
     }),

src-react/src/pages/SearchPage.tsx

@@ -18,8 +18,7 @@ import {
   Stack,
   Switch,
 } from "@chakra-ui/react";
-import { convertFileSrc, invoke } from "@tauri-apps/api/core";
-import { appDataDir, join } from "@tauri-apps/api/path";
+import { invoke } from "@tauri-apps/api/core";
 import { readText } from "@tauri-apps/plugin-clipboard-manager";
 
 import Glossary from "../components/Glossary";
@@ -55,13 +54,6 @@ function SearchPage() {
   const [furigana, set_furigana] = useState("");
   const [isAutoKana, set_isAutoKana] = useState(true);
   const [isScrollEnd, set_isScrollEnd] = useState(false);
-  const [yomitanURL, set_yomitanURL] = useState("");
-
-  useEffect(() => {
-    (async () => {
-      set_yomitanURL(convertFileSrc(await join(await appDataDir(), "yomitan")));
-    })();
-  });
 
   const nSearch = useRef(0);
   const searchboxRef = useRef<HTMLInputElement | null>(null);
@@ -420,11 +412,7 @@ function SearchPage() {
                       }}
                     >
                       {JSON.parse(glossary_json).map((g: any, i: number) => (
-                        <Glossary
-                          key={i}
-                          glossary={g}
-                          {...{ yomitanURL, onTermClicked }}
-                        />
+                        <Glossary key={i} glossary={g} {...{ onTermClicked }} />
                       ))}
                     </div>
                   </Card.Body>

src-tauri/Cargo.toml

@@ -18,7 +18,7 @@ crate-type = ["staticlib", "cdylib", "rlib"]
 tauri-build = { version = "2", features = [] }
 
 [dependencies]
-tauri = { version = "2", features = ["protocol-asset"] }
+tauri = { version = "2", features = [] }
 tauri-plugin-opener = "2"
 cjdic2-core = { path = "../src-core" }
 tauri-plugin-http = "2"

src-tauri/capabilities/default.json

@@ -16,6 +16,10 @@
       ]
     },
     "fs:default",
+    {
+      "identifier": "fs:allow-appdata-read",
+      "allow": [{ "path": "$APPDATA/yomitan/**" }]
+    },
     "clipboard-manager:allow-read-text"
   ]
 }

src-tauri/tauri.conf.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://schema.tauri.app/config/2",
   "productName": "cjdic2",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "identifier": "cc.polv.cjdic2",
   "build": {
     "beforeDevCommand": "pnpm dev",
@@ -19,11 +19,7 @@
       }
     ],
     "security": {
-      "csp": "default-src 'self' ipc: http://ipc.localhost; img-src 'self' asset: http://asset.localhost",
-      "assetProtocol": {
-        "enable": true,
-        "scope": ["$APPDATA/yomitan/**"]
-      }
+      "csp":  null
     }
   },
   "bundle": {