🧩 Plasmo Developers•2w ago

Uncaught (in promise) Error: QUOTA_BYTES_PER_ITEM quota exceeded

Hi all, I am trying to allow users to be able to upload their own HTML templates, but I am repeatedly getting this error. Troubleshooting done: - Added storage and unlimitedStorage permissions in manifest.json - Verified in dev instance that both were listed in the minified file - Tried to compress the file contents during upload - Attempted HTML files of all sizes, including extremely small files Function that gets the error:

const handleUploadTemplate = async () => {
    if (file) {
      const reader = new FileReader();
      reader.onload = async (event) => {
        const fileContent = event.target.result as string;
        const templateId = `template_${Date.now()}`;
        const compressedChunks = compressContent(fileContent, templateId);
  
        // Store each chunk under its unique key
        for (const [key, chunk] of Object.entries(compressedChunks)) {
          await storage.set(key, chunk);
        }
  
        const templateMetadata = {
          id: templateId,
          name: fileName || "Unnamed Template",
          chunkKeys: Object.keys(compressedChunks),
          uploadedAt: new Date().toISOString(),
          isActive: true,
        };
  
        await storage.set(templateId, JSON.stringify(templateMetadata));
        setTemplates((prev) => [...prev, templateMetadata]);
        setFile(null);
        setFileName(null);
      };
      reader.readAsText(file);
    }
  };

const handleUploadTemplate = async () => {
    if (file) {
      const reader = new FileReader();
      reader.onload = async (event) => {
        const fileContent = event.target.result as string;
        const templateId = `template_${Date.now()}`;
        const compressedChunks = compressContent(fileContent, templateId);
  
        // Store each chunk under its unique key
        for (const [key, chunk] of Object.entries(compressedChunks)) {
          await storage.set(key, chunk);
        }
  
        const templateMetadata = {
          id: templateId,
          name: fileName || "Unnamed Template",
          chunkKeys: Object.keys(compressedChunks),
          uploadedAt: new Date().toISOString(),
          isActive: true,
        };
  
        await storage.set(templateId, JSON.stringify(templateMetadata));
        setTemplates((prev) => [...prev, templateMetadata]);
        setFile(null);
        setFileName(null);
      };
      reader.readAsText(file);
    }
  };

Compress function:

const compressContent = (content: string, templateId: string): { [key: string]: string } => {
    const compressed = pako.deflate(content, { to: 'string' });
    const chunkSize = 4000; // Ensure each chunk is well under 8192 bytes
    const chunks: { [key: string]: string } = {};
    
    for (let i = 0; i < compressed.length; i += chunkSize) {
      const chunkKey = `${templateId}_chunk_${i / chunkSize}`;
      chunks[chunkKey] = compressed.slice(i, i + chunkSize);
    }
    
    return chunks;
  };

const compressContent = (content: string, templateId: string): { [key: string]: string } => {
    const compressed = pako.deflate(content, { to: 'string' });
    const chunkSize = 4000; // Ensure each chunk is well under 8192 bytes
    const chunks: { [key: string]: string } = {};
    
    for (let i = 0; i < compressed.length; i += chunkSize) {
      const chunkKey = `${templateId}_chunk_${i / chunkSize}`;
      chunks[chunkKey] = compressed.slice(i, i + chunkSize);
    }
    
    return chunks;
  };

1 Reply

Arcane•2w ago

@Thomato has reached level 2. GG!

Gaming

Programming

Uncaught (in promise) Error: QUOTA_BYTES_PER_ITEM quota exceeded