AtHeartEngineer/explorer
1
0
Fork 0
mirror of https://github.com/tlsnotary/explorer.git synced 2026-01-10 15:28:06 -05:00
Code Issues Packages Projects Releases Wiki Activity

feat: add image preview

Browse Source
This commit is contained in:
tsukino
2024-03-19 20:23:51 +08:00
parent 5479e04295
commit e20da65b19
3 changed files with 1250 additions and 137 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1346
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

2
package.json
View File

@@ -36,9 +36,11 @@
"express": "^4.18.2",
"express-fileupload": "^1.4.3",
"fast-deep-equal": "^3.1.3",
"html-to-image": "^1.11.11",
"isomorphic-fetch": "^3.0.0",
"multiformats": "^13.1.0",
"node-forge": "^1.3.1",
"node-html-to-image": "^4.0.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-redux": "^8.1.2",

39
server/index.tsx
View File

@@ -9,16 +9,14 @@ import { Provider } from 'react-redux';
import React from 'react';
import { renderToString } from 'react-dom/server';
import { StaticRouter } from 'react-router-dom/server';
import * as fs from 'fs';
import configureAppStore from '../web/store';
// @ts-ignore
import { verify } from '../rs/verifier/index.node';
import htmlToImage from 'node-html-to-image';
const app = express();
const port = 3000;
const indexHTML = fs.readFileSync(path.join(__dirname, '../ui', 'index.html'), 'utf-8');
app.use((req, res, next) => {
res.setHeader('Access-Control-Allow-Origin', '*');
res.setHeader('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content, Accept, Content-Type, Authorization');
@@ -61,7 +59,25 @@ app.get('/gateway/ipfs/:cid', async (req, res) => {
app.get('/ipfs/:cid', async (req, res) => {
const file = await getCID(req.params.cid);
const store = configureAppStore();
const jsonProof = JSON.parse(file);
const proof = await verify(file, await fetchPublicKeyFromNotary(jsonProof.notaryUrl));
proof.notaryUrl = jsonProof.notaryUrl;
const store = configureAppStore({
notaryKey: { key: '' },
proofUpload: {
proofs: [],
selectedProof: null,
},
proofs: {
ipfs: {
[req.params.cid]: {
raw: jsonProof,
proof,
}
}
}
});
const html = renderToString(
<Provider store={store}>
<StaticRouter location={req.url}>
@@ -70,24 +86,23 @@ app.get('/ipfs/:cid', async (req, res) => {
</Provider>
);
const jsonProof = JSON.parse(file);
const proof = await verify(file, await fetchPublicKeyFromNotary(jsonProof.notaryUrl));
const preloadedState = store.getState();
proof.notaryUrl = jsonProof.notaryUrl;
const img = await htmlToImage({
html: html,
});
// @ts-ignore
preloadedState.proofs.ipfs[req.params.cid] = {
raw: jsonProof,
proof,
};
const imgUrl= 'data:image/png;base64,' + img.toString('base64');
console.log(imgUrl);
res.send(`
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta property="og:image" content="${imgUrl}" />
<title>Popup</title>
<script>
window.__PRELOADED_STATE__ = ${JSON.stringify(preloadedState)};