How to download attachment from Custom UI not the backend?

Forge Forge UI Kit and Custom UI
,
1

Hello, I’m new here. Recently I have been working on my app for Confluence with attachment RESTful APIs and basically I have made the first version work.

Although I can use the Get URI to download attachment:

// This sample uses Atlassian Forge
// https://developer.atlassian.com/platform/forge/
import api, { route } from "@forge/api";

const response = await api.asUser().requestConfluence(route`/wiki/rest/api/content/{id}/child/attachment/{attachmentId}/download`);

console.log(`Response: ${response.status} ${response.statusText}`);
console.log(await response.text());

then call it from Custom UI by @forge/bridge

My question is how to download attachment from Custom UI not from backend(resolver)

I can get the download URL from Get attachment by id

// This sample uses Atlassian Forge
// https://developer.atlassian.com/platform/forge/
import api, { route } from "@forge/api";

const response = await api.asUser().requestConfluence(route`/wiki/api/v2/attachments/{id}`, {
  headers: {
    'Accept': 'application/json'
  }
});

console.log(`Response: ${response.status} ${response.statusText}`);
console.log(await response.json());

and there’s a downloadLink

{"id":"<string>","status":"current","title":"<string>","createdAt":"<string>","pageId":"<string>","blogPostId":"<string>","customContentId":"<string>","mediaType":"<string>","mediaTypeDescription":"<string>","comment":"<string>","fileId":"<string>","fileSize":28,"webuiLink":"<string>","downloadLink":"<string>","version":{"createdAt":"<string>","message":"<string>","number":19,"minorEdit":true,"authorId":"<string>"},"labels":{"results":[{"id":"<string>","name":"<string>","prefix":"<string>"}],"meta":{"hasMore":true,"cursor":"<string>"},"_links":{"self":"<string>"}},"properties":{"results":[{"id":"<string>","key":"<string>","version":{}}],"meta":{"hasMore":true,"cursor":"<string>"},"_links":{"self":"<string>"}},"operations":{"results":[{"operation":"<string>","targetType":"<string>"}],"meta":{"hasMore":true,"cursor":"<string>"},"_links":{"self":"<string>"}},"versions":{"results":[{"createdAt":"<string>","message":"<string>","number":19,"minorEdit":true,"authorId":"<string>"}],"meta":{"hasMore":true,"cursor":"<string>"},"_links":{"self":"<string>"}},"_links":{"base":"<string>"}}

When I call it from Custom UI, using fetch it trigger CORS even I add * in my manifest.yml

permissions:
external:
  fetch:
    client:
      - '*'

So how to download attachment from Custom UI not backend, is it possible to make it?

2

The @forge/api package is used exclusively inside your backend resolver functions. The correct package to use in the frontend is @forge/bridge (link).

In your example, it would look like:

import { requestConfluence } from '@forge/bridge';

const response = await requestConfluence(`/wiki/api/v2/attachments/${id}`);
1 Like
3

yes I know what you mean, I didn’t write the sample code of @forge/bridge. It’s not the core, my question is how to download attachment from UI not the resolver, do you know how to do it?