security: keep mobile share content private (Closes #903)

frontend/dashboard.js

@@ -4089,6 +4089,24 @@
       taskOverlayHistory.open('new');
       return;
     }
+    if (!sharedImageHandled && sharedImageMarker === 'bundle') {
+      sharedImageHandled = true;
+      if (createIssueAttachmentController.state()) {
+        qs('#create-issue-attachment-status').textContent = 'Remove the current screenshot before adding the shared screenshots.';
+      } else {
+        await sharedImageCapture.consume({
+          marker:sharedImageMarker,
+          store:unfiledAttachmentStore,
+          restore:value=>createIssueAttachmentController.restore(value),
+          restoreContent:content=>{
+            sharedLaunchState = issueCapture.stageSharedContent(content);
+            sharedLaunchHandled = true;
+          },
+          status:message=>{ qs('#create-issue-attachment-status').textContent = message; },
+        });
+      }
+      clearSharedLaunchUrl();
+    }
     const captureDraft = issueCapture.loadDraft();
     issueTemplatePicker.reset(captureDraft);
     const initialRepositories = (lastContextSnapshot?.repos || []).map(repository => repository.full_name).filter(Boolean);

frontend/manifest.webmanifest

@@ -36,7 +36,7 @@
     }
   ],
   "share_target": {
-    "action": "./",
+    "action": "./share-target",
     "method": "POST",
     "enctype": "multipart/form-data",
     "params": {

frontend/service-worker.js

@@ -1,7 +1,7 @@
 const BASE = new URL('./', self.location.href).pathname;
 importScripts(BASE + 'static/private-data-registry.js');
 importScripts(BASE + 'static/background-issue-sync.js');
-const CACHE = 'stackchain-dashboard-shell-v105';
+const CACHE = 'stackchain-dashboard-shell-v106';
 const OFFLINE_LEASE_URL = new URL(BASE + '__offline-session-lease', self.location.origin).href;
 const OUTAGE_STATUSES = new Set([500, 502, 503, 504]);
 const NAVIGATION_TIMEOUT_MS = self.__STACKCHAIN_NAVIGATION_TIMEOUT_MS || 4000;
@@ -113,6 +113,7 @@ const OPTIONAL_FEATURES = [
 const SHARED_IMAGE_ID = 'shared-image';
 const SHARED_IMAGE_TYPES = new Set(['image/png', 'image/jpeg', 'image/webp']);
 const MAX_SHARED_IMAGE_BYTES = 12 * 1024 * 1024;
+const SHARE_TARGET_PATH = BASE + 'share-target';
 const sharedAttachmentStore = self.__STACKCHAIN_SHARED_ATTACHMENT_STORE || createUnfiledAttachmentStore();
 
 function boundedShareField(form, name, limit) {
@@ -120,45 +121,46 @@ function boundedShareField(form, name, limit) {
   return typeof value === 'string' ? value.trim().slice(0, limit) : '';
 }
 
-async function acceptSharedContent(request) {
-  const form = await request.formData();
-  const images = form.getAll('image').filter(value => typeof value !== 'string' && value?.size > 0);
-  let marker = '';
-  await sharedAttachmentStore.delete(SHARED_IMAGE_ID).catch(() => {});
-  if (images.length > 5) marker = 'multiple';
-  else if (images.length > 0) {
-    const supported = images.every(image =>
-      SHARED_IMAGE_TYPES.has(String(image.type || '')) && image.size <= MAX_SHARED_IMAGE_BYTES
-    );
-    if (!supported) {
-      marker = 'unsupported';
-    } else if (images.length === 1) {
-      const image = images[0];
-      await sharedAttachmentStore.put(SHARED_IMAGE_ID, {
-        filename:String(image.name || 'shared-screenshot').slice(0, 255),
-        contentType:String(image.type), blob:image,
-      });
-      marker = 'image';
-    } else {
-      await sharedAttachmentStore.put(SHARED_IMAGE_ID, {
-        attachments:images.map(image => ({
-          filename:String(image.name || 'shared-screenshot').slice(0, 255),
-          contentType:String(image.type), blob:image,
-        })),
-      });
-      marker = 'images';
-    }
-  }
+function sharedContentRedirect(marker) {
   const target = new URL(BASE, self.location.origin);
   target.searchParams.set('launch', 'new');
   if (marker) target.searchParams.set('shared', marker);
-  for (const [name, limit] of [['title', 255], ['text', 10000], ['url', 2048]]) {
-    const value = boundedShareField(form, name, limit);
-    if (value) target.searchParams.set(name, value);
-  }
   return new Response(null, {status:303, headers:{Location:target.pathname + target.search}});
 }
 
+async function acceptSharedContent(request) {
+  if (request.headers.get('Sec-Fetch-Site') === 'cross-site') {
+    return new Response('Cross-site share submissions are not accepted.', {
+      status:403,
+      headers:{'Content-Type':'text/plain; charset=utf-8','Cache-Control':'no-store'},
+    });
+  }
+  const form = await request.formData();
+  const images = form.getAll('image').filter(value => typeof value !== 'string' && value?.size > 0);
+  const content = {
+    title:boundedShareField(form, 'title', 255),
+    text:boundedShareField(form, 'text', 10000),
+    url:boundedShareField(form, 'url', 2048),
+  };
+  if (images.length > 5) return sharedContentRedirect('multiple');
+  const supported = images.every(image =>
+    SHARED_IMAGE_TYPES.has(String(image.type || '')) && image.size <= MAX_SHARED_IMAGE_BYTES
+  );
+  const totalBytes = images.reduce((total, image) => total + image.size, 0);
+  if (!supported || totalBytes > MAX_SHARED_IMAGE_BYTES) return sharedContentRedirect('unsupported');
+  if (!images.length && !Object.values(content).some(Boolean)) return sharedContentRedirect('unsupported');
+  const attachments = images.map(image => ({
+    filename:String(image.name || 'shared-screenshot').slice(0, 255),
+    contentType:String(image.type), blob:image,
+  }));
+  try {
+    await sharedAttachmentStore.put(SHARED_IMAGE_ID, {...content, attachments});
+  } catch (_error) {
+    return sharedContentRedirect('unavailable');
+  }
+  return sharedContentRedirect('bundle');
+}
+
 async function fetchNavigation(request) {
   const controller = new AbortController();
   let timeout;
@@ -563,7 +565,7 @@ self.addEventListener('fetch', event => {
   const requestUrl = new URL(request.url);
   if (
     request.method === 'POST' && request.mode === 'navigate'
-    && requestUrl.origin === self.location.origin && requestUrl.pathname === BASE
+    && requestUrl.origin === self.location.origin && requestUrl.pathname === SHARE_TARGET_PATH
   ) {
     event.respondWith(acceptSharedContent(request));
     return;

frontend/shared-image-capture.js

@@ -8,14 +8,35 @@
   const RECORD_ID = 'shared-image';
   const TYPES = new Set(['image/png', 'image/jpeg', 'image/webp']);
 
-  async function consume({marker, store, restore, status = () => {}}) {
+  async function consume({marker, store, restore, restoreContent = () => {}, status = () => {}}) {
     if (!marker) return false;
+    const value = await store?.get(RECORD_ID);
+    const attachments = Array.isArray(value?.attachments) ? value.attachments : null;
+    if (marker === 'bundle') {
+      const content = {
+        title:typeof value?.title === 'string' ? value.title.slice(0, 255) : '',
+        text:typeof value?.text === 'string' ? value.text.slice(0, 10000) : '',
+        url:typeof value?.url === 'string' ? value.url.slice(0, 2048) : '',
+      };
+      const invalidAttachments = !attachments || attachments.length > 5 || attachments.some(attachment =>
+        !attachment?.blob || !attachment.filename || !TYPES.has(String(attachment.contentType || '')));
+      if (invalidAttachments || (!attachments.length && !Object.values(content).some(Boolean))) {
+        status('The shared content is unavailable. Share it again.');
+        return false;
+      }
+      restoreContent(content);
+      if (attachments.length) restore(attachments);
+      await store.delete(RECORD_ID);
+      const noun = attachments.length === 1 ? 'screenshot' : attachments.length > 1 ? 'screenshots' : 'content';
+      status(attachments.length
+        ? 'Shared content and ' + (attachments.length > 1 ? attachments.length + ' ' : '') + noun + ' ready to file with this issue.'
+        : 'Shared content ready to file with this issue.');
+      return true;
+    }
     if (!['image', 'images'].includes(marker)) {
       status('Share one PNG, JPEG, or WebP screenshot.');
       return false;
     }
-    const value = await store?.get(RECORD_ID);
-    const attachments = Array.isArray(value?.attachments) ? value.attachments : null;
     if (marker === 'images') {
       if (!attachments?.length || attachments.length > 5 || attachments.some(attachment =>
         !attachment?.blob || !attachment.filename || !TYPES.has(String(attachment.contentType || '')))) {