feat: add mac import option and help text
This commit is contained in:
parent
a951ac8e16
commit
6b871f0861
15
src/components/Key/MacCommandKey.tsx
Normal file
15
src/components/Key/MacCommandKey.tsx
Normal file
@ -0,0 +1,15 @@
|
||||
import { Icon, Kbd } from '@chakra-ui/react';
|
||||
import { BsCommand } from 'react-icons/bs';
|
||||
|
||||
export function MacCommandKey() {
|
||||
return (
|
||||
<ruby>
|
||||
<Kbd>
|
||||
<Icon as={BsCommand} />
|
||||
</Kbd>
|
||||
<rp> (</rp>
|
||||
<rt>command</rt>
|
||||
<rp>)</rp>
|
||||
</ruby>
|
||||
);
|
||||
}
|
15
src/components/Key/ShiftKey.tsx
Normal file
15
src/components/Key/ShiftKey.tsx
Normal file
@ -0,0 +1,15 @@
|
||||
import { Icon, Kbd } from '@chakra-ui/react';
|
||||
import { BsShift } from 'react-icons/bs';
|
||||
|
||||
export function ShiftKey() {
|
||||
return (
|
||||
<ruby>
|
||||
<Kbd>
|
||||
<Icon as={BsShift} />
|
||||
</Kbd>
|
||||
<rp> (</rp>
|
||||
<rt>shift</rt>
|
||||
<rp>)</rp>
|
||||
</ruby>
|
||||
);
|
||||
}
|
@ -20,13 +20,21 @@ import { qmc2ImportKeys } from '../../settingsSlice';
|
||||
import { useAppDispatch } from '~/hooks';
|
||||
import { DatabaseKeyExtractor } from '~/util/DatabaseKeyExtractor';
|
||||
|
||||
import { QMCv2AndroidInstructions } from './QMCv2AndroidInstructions';
|
||||
import { InstructionsAndroid } from './InstructionsAndroid';
|
||||
import { MMKVParser } from '~/util/MMKVParser';
|
||||
import { getFileName } from '~/util/pathHelper';
|
||||
import { InstructionsMac } from './InstructionsMac';
|
||||
|
||||
export interface ImportFileModalProps {
|
||||
show: boolean;
|
||||
onClose: () => void;
|
||||
}
|
||||
|
||||
interface KeyEntry {
|
||||
name: string;
|
||||
key: string;
|
||||
}
|
||||
|
||||
export function ImportFileModal({ onClose, show }: ImportFileModalProps) {
|
||||
const dispatch = useAppDispatch();
|
||||
const toast = useToast();
|
||||
@ -35,22 +43,31 @@ export function ImportFileModal({ onClose, show }: ImportFileModalProps) {
|
||||
const file = files[0];
|
||||
const fileBuffer = await file.arrayBuffer();
|
||||
|
||||
let qmc2Keys: null | KeyEntry[] = null;
|
||||
|
||||
if (/[_.]db$/i.test(file.name)) {
|
||||
const extractor = await DatabaseKeyExtractor.getInstance();
|
||||
const qmc2Keys = extractor.extractQmAndroidDbKeys(fileBuffer);
|
||||
if (qmc2Keys) {
|
||||
dispatch(qmc2ImportKeys(qmc2Keys));
|
||||
onClose();
|
||||
toast({
|
||||
title: `导入成功 (${qmc2Keys.length})`,
|
||||
description: '记得保存更改来应用。',
|
||||
isClosable: true,
|
||||
duration: 5000,
|
||||
status: 'success',
|
||||
});
|
||||
qmc2Keys = extractor.extractQmAndroidDbKeys(fileBuffer);
|
||||
if (!qmc2Keys) {
|
||||
alert(`不是支持的 SQLite 数据库文件。\n表名:${qmc2Keys}`);
|
||||
return;
|
||||
}
|
||||
alert(`不是支持的 SQLite 数据库文件。\n表名:${qmc2Keys}`);
|
||||
} else if (/MMKVStreamEncryptId/i.test(file.name)) {
|
||||
const fileBuffer = await file.arrayBuffer();
|
||||
const map = MMKVParser.toStringMap(new DataView(fileBuffer));
|
||||
qmc2Keys = Array.from(map.entries(), ([name, key]) => ({ name: getFileName(name), key }));
|
||||
}
|
||||
|
||||
if (qmc2Keys) {
|
||||
dispatch(qmc2ImportKeys(qmc2Keys));
|
||||
onClose();
|
||||
toast({
|
||||
title: `导入成功 (${qmc2Keys.length})`,
|
||||
description: '记得保存更改来应用。',
|
||||
isClosable: true,
|
||||
duration: 5000,
|
||||
status: 'success',
|
||||
});
|
||||
} else {
|
||||
alert(`不支持的文件:${file.name}`);
|
||||
}
|
||||
@ -74,14 +91,14 @@ export function ImportFileModal({ onClose, show }: ImportFileModalProps) {
|
||||
<Flex as={Tabs} variant="enclosed" flexDir="column" mt={4} flex={1} minH={0}>
|
||||
<TabList>
|
||||
<Tab>安卓客户端</Tab>
|
||||
{/* <Tab>Two</Tab> */}
|
||||
<Tab>Mac 客户端</Tab>
|
||||
</TabList>
|
||||
<TabPanels flex={1} overflow="auto">
|
||||
<TabPanel>
|
||||
<QMCv2AndroidInstructions />
|
||||
<InstructionsAndroid />
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<p>two!</p>
|
||||
<InstructionsMac />
|
||||
</TabPanel>
|
||||
</TabPanels>
|
||||
</Flex>
|
||||
|
@ -5,6 +5,7 @@ import {
|
||||
AccordionItem,
|
||||
AccordionPanel,
|
||||
Box,
|
||||
Code,
|
||||
Heading,
|
||||
Link,
|
||||
ListItem,
|
||||
@ -19,7 +20,7 @@ import hljsStyleGitHub from 'react-syntax-highlighter/dist/esm/styles/hljs/githu
|
||||
import PowerShellAdbDumpCommand from './adb_dump.ps1?raw';
|
||||
import ShellAdbDumpCommand from './adb_dump.sh?raw';
|
||||
|
||||
export function QMCv2AndroidInstructions() {
|
||||
export function InstructionsAndroid() {
|
||||
return (
|
||||
<>
|
||||
<Text>
|
||||
@ -43,11 +44,25 @@ export function QMCv2AndroidInstructions() {
|
||||
<AccordionPanel pb={4}>
|
||||
<OrderedList>
|
||||
<ListItem>
|
||||
使用具有 <code>root</code> 权限的文件浏览器,访问 <code>/data/data/com.tencent.qqmusic/databases/</code>
|
||||
{' 目录,将文件 '}
|
||||
<code>player_process_db</code> 复制到正常模式下用户可访问的目录(如下载目录)。
|
||||
<Text>
|
||||
启动具有 <Code>root</Code> 特权的文件浏览器
|
||||
</Text>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Text>
|
||||
访问 <Code>/data/data/com.tencent.qqmusic/databases/</Code> 目录。
|
||||
</Text>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Text>
|
||||
将文件 <Code>player_process_db</Code> 复制到浏览器可访问的目录。
|
||||
<br />
|
||||
(例如下载目录)
|
||||
</Text>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Text>提交该数据库文件。</Text>
|
||||
</ListItem>
|
||||
<ListItem>提交该数据库文件。</ListItem>
|
||||
</OrderedList>
|
||||
</AccordionPanel>
|
||||
</AccordionItem>
|
||||
@ -64,24 +79,33 @@ export function QMCv2AndroidInstructions() {
|
||||
<AccordionPanel pb={4}>
|
||||
<OrderedList>
|
||||
<ListItem>
|
||||
确保 <code>adb</code> 命令可用。
|
||||
<br />
|
||||
💡 如果没有,可以
|
||||
<Link href="https://scoop.sh/#/apps?q=adb" isExternal>
|
||||
使用 Scoop 安装 <ExternalLinkIcon />
|
||||
</Link>
|
||||
。
|
||||
<Text>
|
||||
确保 <code>adb</code> 命令可用。
|
||||
</Text>
|
||||
<Text>
|
||||
💡 如果没有,可以
|
||||
<Link href="https://scoop.sh/#/apps?q=adb" isExternal>
|
||||
使用 Scoop 安装 <ExternalLinkIcon />
|
||||
</Link>
|
||||
。
|
||||
</Text>
|
||||
</ListItem>
|
||||
<ListItem>启动终端并进入 PowerShell 7 环境。</ListItem>
|
||||
<ListItem>将安卓设备连接到电脑,并允许调试。</ListItem>
|
||||
<ListItem>
|
||||
粘贴执行下述代码。若设备提示「超级用户请求」请允许:
|
||||
<Text>启动终端并进入 PowerShell 7 环境。</Text>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Text>将安卓设备连接到电脑,并允许调试。</Text>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Text>粘贴执行下述代码。若设备提示「超级用户请求」请允许:</Text>
|
||||
<SyntaxHighlighter language="ps1" style={hljsStyleGitHub}>
|
||||
{PowerShellAdbDumpCommand}
|
||||
</SyntaxHighlighter>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
提交当前目录下的 <code>player_process_db</code> 文件。
|
||||
<Text>
|
||||
提交当前目录下的 <Code>player_process_db</Code> 文件。
|
||||
</Text>
|
||||
</ListItem>
|
||||
</OrderedList>
|
||||
</AccordionPanel>
|
||||
@ -98,15 +122,19 @@ export function QMCv2AndroidInstructions() {
|
||||
</Heading>
|
||||
<AccordionPanel pb={4}>
|
||||
<OrderedList>
|
||||
<ListItem>将安卓设备连接到电脑,并允许调试。</ListItem>
|
||||
<ListItem>
|
||||
粘贴执行下述代码。若设备提示「超级用户请求」请允许:
|
||||
<Text>将安卓设备连接到电脑,并允许调试。</Text>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Text>粘贴执行下述代码。若设备提示「超级用户请求」请允许:</Text>
|
||||
<SyntaxHighlighter language="bash" style={hljsStyleGitHub}>
|
||||
{ShellAdbDumpCommand}
|
||||
</SyntaxHighlighter>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
提交当前目录下的 <code>player_process_db</code> 文件。
|
||||
<Text>
|
||||
提交当前目录下的 <Code>player_process_db</Code> 文件。
|
||||
</Text>
|
||||
</ListItem>
|
||||
</OrderedList>
|
||||
</AccordionPanel>
|
50
src/features/settings/panels/QMCv2/InstructionsMac.tsx
Normal file
50
src/features/settings/panels/QMCv2/InstructionsMac.tsx
Normal file
@ -0,0 +1,50 @@
|
||||
import { Heading, Text, Code, Kbd, OrderedList, ListItem } from '@chakra-ui/react';
|
||||
import { MacCommandKey } from '~/components/Key/MacCommandKey';
|
||||
import { ShiftKey } from '~/components/Key/ShiftKey';
|
||||
|
||||
export function InstructionsMac() {
|
||||
return (
|
||||
<>
|
||||
<Text>Mac 客户端使用 mmkv 数据库储存密钥。</Text>
|
||||
<Text>该密钥文件通常存储在下述路径:</Text>
|
||||
<Text as="pre" whiteSpace="pre-wrap" wordBreak="break-word" lang="en">
|
||||
<Code>
|
||||
~/Library/Containers/com.tencent.QQMusicMac/Data/Library/Application
|
||||
Support/QQMusicMac/mmkv/MMKVStreamEncryptId
|
||||
</Code>
|
||||
</Text>
|
||||
|
||||
<Heading as="h3" size="md" mt="4">
|
||||
导入密钥
|
||||
</Heading>
|
||||
<OrderedList>
|
||||
<ListItem>
|
||||
<Text>
|
||||
选中并复制上述的 <Code>MMKVStreamEncryptId</Code> 文件路径
|
||||
</Text>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Text>点击上方的「文件选择区域」,打开「文件选择框」</Text>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Text>
|
||||
按下「
|
||||
<ShiftKey />
|
||||
{' + '}
|
||||
<MacCommandKey />
|
||||
{' + '}
|
||||
<Kbd>{'G'}</Kbd>」组合键打开「路径输入框」
|
||||
</Text>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Text>
|
||||
粘贴之前复制的 <Code>MMKVStreamEncryptId</Code> 文件路径
|
||||
</Text>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Text>按下「回车键」确认。</Text>
|
||||
</ListItem>
|
||||
</OrderedList>
|
||||
</>
|
||||
);
|
||||
}
|
10
src/theme.ts
10
src/theme.ts
@ -20,16 +20,6 @@ export const theme = extendTheme({
|
||||
},
|
||||
},
|
||||
Tabs: tabsTheme,
|
||||
Heading: {
|
||||
baseStyle: {
|
||||
userSelect: 'none',
|
||||
},
|
||||
},
|
||||
Text: {
|
||||
baseStyle: {
|
||||
userSelect: 'none',
|
||||
},
|
||||
},
|
||||
Link: {
|
||||
baseStyle: {
|
||||
color: 'blue.600',
|
||||
|
@ -1,3 +1,4 @@
|
||||
import { getFileName } from './pathHelper';
|
||||
import { SQLDatabase, SQLStatic, loadSQL } from './sqlite';
|
||||
|
||||
export interface QMAndroidKeyEntry {
|
||||
@ -34,7 +35,7 @@ export class DatabaseKeyExtractor {
|
||||
const keys = db.exec('select file_path, ekey from `audio_file_ekey_table`')[0].values;
|
||||
return keys.map(([path, key]) => ({
|
||||
// strip dir name
|
||||
name: String(path).replace(/.+\//, ''),
|
||||
name: getFileName(String(path)),
|
||||
key: String(key),
|
||||
}));
|
||||
} finally {
|
||||
|
95
src/util/MMKVParser.ts
Normal file
95
src/util/MMKVParser.ts
Normal file
@ -0,0 +1,95 @@
|
||||
const textDecoder = new TextDecoder('utf-8', { ignoreBOM: true });
|
||||
|
||||
export class MMKVParser {
|
||||
private offset = 8;
|
||||
private length: number;
|
||||
|
||||
constructor(private view: DataView) {
|
||||
const payloadLength = view.getUint32(0, true);
|
||||
this.length = 4 + payloadLength;
|
||||
}
|
||||
|
||||
toString() {
|
||||
const offset = this.offset.toString(16).padStart(8, '0');
|
||||
const length = this.length.toString(16).padStart(8, '0');
|
||||
return `<MMKVParser offset=0x${offset} len=0x${length}>`;
|
||||
}
|
||||
|
||||
get eof() {
|
||||
return this.offset >= this.length;
|
||||
}
|
||||
|
||||
peek() {
|
||||
return this.view.getUint8(this.offset);
|
||||
}
|
||||
|
||||
public readByte() {
|
||||
return this.view.getUint8(this.offset++);
|
||||
}
|
||||
|
||||
public readBigInt() {
|
||||
let value = 0n;
|
||||
let shift = 0n;
|
||||
|
||||
let b: number;
|
||||
do {
|
||||
b = this.readByte();
|
||||
value |= BigInt(b & 0x7f) << shift;
|
||||
shift += 7n;
|
||||
} while ((b & 0x80) !== 0);
|
||||
|
||||
return value;
|
||||
}
|
||||
|
||||
public readInt() {
|
||||
const value = this.readBigInt();
|
||||
|
||||
if (value > Number.MAX_SAFE_INTEGER) {
|
||||
throw new Error('Runtime Error: BigInt too large to cast as number');
|
||||
}
|
||||
|
||||
return Number(value);
|
||||
}
|
||||
|
||||
public readBytes(n: number) {
|
||||
const offset = this.offset;
|
||||
const end = offset + n;
|
||||
this.offset = end;
|
||||
return new Uint8Array(this.view.buffer.slice(offset, end));
|
||||
}
|
||||
|
||||
public readString() {
|
||||
// String [
|
||||
// len: int,
|
||||
// data: byte[int], # utf-8
|
||||
// ]
|
||||
const strByteLen = this.readInt();
|
||||
const data = this.readBytes(strByteLen);
|
||||
return textDecoder.decode(data).normalize();
|
||||
}
|
||||
|
||||
public readVariantString() {
|
||||
// Container [
|
||||
// len: int,
|
||||
// data: variant
|
||||
// ]
|
||||
const containerLen = this.readInt();
|
||||
const newOffset = this.offset + containerLen;
|
||||
const result = this.readString();
|
||||
if (newOffset !== this.offset) {
|
||||
throw new Error('readVariantString failed: offset does not match');
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
public static toStringMap(view: DataView): Map<string, string> {
|
||||
const mmkv = new MMKVParser(view);
|
||||
const result = new Map<string, string>();
|
||||
while (!mmkv.eof) {
|
||||
const key = mmkv.readString();
|
||||
const value = mmkv.readVariantString();
|
||||
result.set(key, value);
|
||||
}
|
||||
return result;
|
||||
}
|
||||
}
|
13
src/util/__tests__/pathHelper.test.ts
Normal file
13
src/util/__tests__/pathHelper.test.ts
Normal file
@ -0,0 +1,13 @@
|
||||
import { getFileName } from '../pathHelper';
|
||||
|
||||
test('handle linux path', () => {
|
||||
expect(getFileName('/path/to/file.bin')).toEqual('file.bin');
|
||||
});
|
||||
|
||||
test('handle win32 path', () => {
|
||||
expect(getFileName('C:\\system32\\file.bin')).toEqual('file.bin');
|
||||
});
|
||||
|
||||
test('handle file name only as well', () => {
|
||||
expect(getFileName('file.bin')).toEqual('file.bin');
|
||||
});
|
3
src/util/pathHelper.ts
Normal file
3
src/util/pathHelper.ts
Normal file
@ -0,0 +1,3 @@
|
||||
export function getFileName(path: string) {
|
||||
return path.replace(/.*[\\/]/, '');
|
||||
}
|
Loading…
Reference in New Issue
Block a user