diff --git a/src-tauri/Cargo.lock b/src-tauri/Cargo.lock
index cd723bb..f4bea7f 100644
--- a/src-tauri/Cargo.lock
+++ b/src-tauri/Cargo.lock
@@ -341,6 +341,7 @@ dependencies = [
  "tauri-build",
  "thiserror",
  "tokio",
+ "urlencoding",
  "uuid 1.3.0",
  "walkdir",
 ]
@@ -3252,6 +3253,12 @@ dependencies = [
  "serde",
 ]
 
+[[package]]
+name = "urlencoding"
+version = "2.1.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "e8db7427f936968176eaa7cdf81b7f98b980b18495ec28f1b5791ac3bfe3eea9"
+
 [[package]]
 name = "utf-8"
 version = "0.7.6"
diff --git a/src-tauri/Cargo.toml b/src-tauri/Cargo.toml
index 159ce39..0e49752 100644
--- a/src-tauri/Cargo.toml
+++ b/src-tauri/Cargo.toml
@@ -14,7 +14,7 @@ tauri-build = { version = "1.2", features = [] }
 
 [dependencies]
 once_cell = "1.17.0"
-tauri = { version = "1.2", features = ["dialog-open", "fs-exists", "fs-read-dir", "fs-read-file", "protocol-asset", "shell-open"] }
+tauri = { version = "1.2", features = ["dialog-open", "fs-exists", "fs-read-dir", "fs-read-file", "protocol-all", "shell-open"] }
 serde = { version = "1.0", features = ["derive"] }
 serde_json = "1.0"
 chrono = { version = "0.4.23", features = ["serde"] }
@@ -27,6 +27,7 @@ image = "0.24.5"
 uuid = "1.3.0"
 mountpoints = "0.2.1"
 md-5 = "0.10.5"
+urlencoding = "2.1.2"
 
 [features]
 # this feature is used for production builds or when `devPath` points to the filesystem
diff --git a/src-tauri/src/main.rs b/src-tauri/src/main.rs
index e3e284a..2c8d224 100644
--- a/src-tauri/src/main.rs
+++ b/src-tauri/src/main.rs
@@ -2,13 +2,16 @@
 #![cfg_attr(not(debug_assertions), windows_subsystem = "windows")]
 
 mod commands;
+mod protocol;
 mod utils;
 
 use commands::AppHold;
+use protocol::comic_protocol;
 use tauri::Manager;
 
 fn main() {
     tauri::Builder::default()
+        .register_uri_scheme_protocol("comic", comic_protocol)
         .invoke_handler(tauri::generate_handler![
             commands::prelude::scan_directory,
             commands::prelude::show_drives,
diff --git a/src-tauri/src/protocol.rs b/src-tauri/src/protocol.rs
new file mode 100644
index 0000000..7b1d4cc
--- /dev/null
+++ b/src-tauri/src/protocol.rs
@@ -0,0 +1,43 @@
+use std::{error::Error, io::Cursor, path::Path};
+
+use tauri::{
+    http::{Request, Response, ResponseBuilder},
+    AppHandle, Runtime,
+};
+use urlencoding::decode;
+
+pub fn comic_protocol<R: Runtime>(
+    _app_handler: &AppHandle<R>,
+    request: &Request,
+) -> Result<Response, Box<dyn Error>> {
+    let response_builder = ResponseBuilder::new();
+    let path = request
+        .uri()
+        .strip_prefix("comic://localhost/")
+        .map(|u| decode(u).unwrap())
+        .unwrap();
+    println!("[debug]request: {}", path);
+    if path.len() == 0 {
+        return response_builder
+            .mimetype("text/plain")
+            .status(404)
+            .body(Vec::new());
+    }
+
+    let path = Path::new(path.as_ref());
+    if !path.exists() {
+        return response_builder
+            .mimetype("text/plain")
+            .status(404)
+            .body(Vec::new());
+    }
+
+    let content = image::io::Reader::open(path)?.decode()?;
+    let mut bytes: Vec<u8> = Vec::new();
+    content.write_to(&mut Cursor::new(&mut bytes), image::ImageOutputFormat::Png)?;
+
+    response_builder
+        .mimetype("image/png")
+        .status(200)
+        .body(bytes)
+}
diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json
index 6f9ccae..41da729 100644
--- a/src-tauri/tauri.conf.json
+++ b/src-tauri/tauri.conf.json
@@ -29,11 +29,7 @@
         "writeFile": false
       },
       "protocol": {
-        "all": false,
-        "asset": true,
-        "assetScope": [
-          "*"
-        ]
+        "all": true
       },
       "shell": {
         "all": false,
@@ -66,7 +62,7 @@
       }
     },
     "security": {
-      "csp": "default-src 'self'; img-src 'self' asset: https://asset.localhost"
+      "csp": null
     },
     "updater": {
       "active": false
diff --git a/src/states/files.ts b/src/states/files.ts
index 6c8e3d7..00cd804 100644
--- a/src/states/files.ts
+++ b/src/states/files.ts
@@ -24,7 +24,8 @@ export const useFileListStore = createStoreHook<FileListState & FileListActions>
   updateFiles(files) {
     set(df => {
       df.files = addIndex<Omit<FileItem, 'sort'>, FileItem>(map)(
-        (item, index) => mergeLeft({ sort: index * 10, path: convertFileSrc(item.path) }, item),
+        (item, index) =>
+          mergeLeft({ sort: index * 10, path: convertFileSrc(item.path, 'comic') }, item),
         files
       );
       df.actives = [];