以下是一个简化版本地电子书阅读器(支持 .txt 文件)
,用 Electron + HTML + JavaScript 构建,适合学习和拓展。
🧱 项目结构
simple-ebook-reader/
├── main.js // Electron 主进程
├── package.json // 项目信息
├── preload.js // 安全预加载脚本
├── index.html // 主页面
├── renderer.js // 前端逻辑
📦 1. package.json
{
"name": "simple-ebook-reader",
"version": "1.0.0",
"main": "main.js",
"scripts": {
"start": "electron ."
},
"devDependencies": {
"electron": "^29.0.0"
}
}
运行:
npm install
npm run start
🚀 2. main.js
const { app, BrowserWindow, dialog, ipcMain } = require('electron');
const path = require('path');
const fs = require('fs');
function createWindow() {
const win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
preload: path.join(__dirname, 'preload.js')
}
});
win.loadFile('index.html');
}
ipcMain.handle('open-file', async () => {
const result = await dialog.showOpenDialog({
filters: [{ name: 'Text Files', extensions: ['txt'] }],
properties: ['openFile']
});
if (result.canceled || result.filePaths.length === 0) return '';
const filePath = result.filePaths[0];
return fs.readFileSync(filePath, 'utf-8');
});
app.whenReady().then(createWindow);
🔒 3. preload.js
js复制编辑const { contextBridge, ipcRenderer } = require('electron');
contextBridge.exposeInMainWorld('readerAPI', {
openFile: () => ipcRenderer.invoke('open-file')
});
🖼️ 4. index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>简易电子书阅读器</title>
<style>
body { font-family: sans-serif; margin: 20px; }
#content { white-space: pre-wrap; margin-top: 20px; line-height: 1.6; }
button { padding: 10px 20px; font-size: 16px; }
</style>
</head>
<body>
<h1>📖 简易电子书阅读器</h1>
<button onclick="loadBook()">打开 TXT 文件</button>
<div id="content">请打开一本书开始阅读...</div>
<script src="renderer.js"></script>
</body>
</html>
🧠 5. renderer.js
async function loadBook() {
const content = await window.readerAPI.openFile();
if (content) {
document.getElementById('content').innerText = content;
}
}
✅ 功能总结:
功能 | 支持情况 |
---|---|
本地 TXT 文件读取 | ✅ |
简单界面阅读 | ✅ |
安全进程隔离 | ✅ 使用 preload.js |
🛠️ 可扩展功能建议:
- 📑 支持 .epub(用 epub.js)
- 📖 阅读进度保存
- 🌙 黑夜模式
- 📚 多书架管理
- 🔍 搜索/字体调节
最后
以上就是热心网友最近收集整理的关于让AI写一个简化版的“本地电子书阅读器”学习用的全部内容,更多相关让AI写一个简化版内容请搜索靠谱客的其他文章。
本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
发表评论 取消回复