var stream = await Http.GetStreamAsync("sqlite.db"); // file in the wwwroot
var buffer = new byte[stream.Length];
using var ms = new MemoryStream(buffer, 0, buffer.Length);
await stream.CopyToAsync(ms);
string base64 = Convert.ToBase64String(ms.ToArray());
await JS!.InvokeVoidAsync("fn.writeToCache", base64);
下面是 JavaScript 函数的实现:
window.fn = {
writeToCache: async function (buffer) {
const cachePath = `/data/cache/sqlite.db`;
const cache = await caches.open('your-cache-name');
const resp = await cache.match(cachePath);
if (resp && resp.ok) {
return false;
}
const fileUrl = "data:application/octet-stream;base64," + buffer;
const res = await fetch(fileUrl);
const blob = await res.blob();
const headers = new Headers({
'content-length': blob.size
});
const response = new Response(blob, {
headers
});
await cache.put(cachePath, response);
console.log("Data cached.");
location.Reload(); // Necessary step to be able to see the cache
}
}
只是一些额外的注意事项:
/** Available only in secure contexts. */
declare var caches: CacheStorage; // <-- HTTPS only
declare var crossOriginIsolated: boolean;
declare var crypto: Crypto;
declare var indexedDB: IDBFactory;
// ...
1条答案
按热度按时间gojuced71#
这是可能的,但不是很可行,因为它会导致一些奇怪的行为/错误,现在你添加更多的数据/表根据我的卑微的实验。
首先,通过HTTP调用将文件作为流读取,并将其转换为base64字符串,如下所示:
下面是 JavaScript 函数的实现:
只是一些额外的注意事项:
*安全上下文:此功能仅在某些或所有支持的浏览器中的安全上下文(HTTPS)中可用。
*标题:缓存API不荣誉HTTP缓存头。
*键匹配键匹配算法取决于值中的VARY header。因此,匹配新键需要同时查看
Cache
对象中条目的键和值。因此,请确保按名称对缓存进行版本控制,并仅使用可以安全操作的脚本版本中的缓存。如何通过vanilla JavaScript 摆脱旧缓存:删除旧缓存