Using MediaViewer for Attachments in the Connect app. Problem with AuthProvider

Confluence Development Confluence Cloud
, , ,
1

Hello,
I want to add the ability to view attachments inside the iframe of my connect application in MediaViewer component from AtlasKit. According to the documentation, the MediaViewer should be given the mediaClientConfig, which includes the requirement of an AuthProvider that has the following properties

ClientBasedAuth {
    readonly clientId: string;
    readonly token: string;
    readonly baseUrl: string;
}

It looks like the baseUrl for attachments should be "https://api.media.atlassian.com ". If there is some simple way to get the clientId and token from the connect app? I can see which token and clientId is sent when opening attachments on the main page (not inside my iframe). And when substituting these parameters manually into my code, MediaViewer works, but how to get these parameters is not clear. I tried different combinations: I used the token returned by AP.context.get Token, and account-id, GET token and client Key, but always get “AuthenticationError”

Any help is welcome.

2

Unfortunately, the Atlassian media API is not publicly available (and as such, no documentation exists). You can use the media viewer, but only to show media that you host yourself. I’d also strongly recommend staying away from trying to find out how to emulate the Atlassian media API.

The only way we could get the MediaViewer to work was with an ExternalImageIdentifier:

          <MediaViewer
            mediaClientConfig={{ authProvider: async () => ({ clientId: '', token: '', baseUrl: '' }) }}
            selectedItem={identifier}
            dataSource={{ collectionName: '', list: [ identifier ] }}
            collectionName={''}
            onClose={onClose}
          />

whereas identifier is an object that implements the ExternalImageIdentifier interface:

export interface ExternalImageIdentifier {
    readonly mediaItemType: 'external-image';
    readonly dataURI: string;
    readonly name?: string;
}

See also A cautionary tale of working with AtlasKit editor, Media Client, the Atlassian Media API and how the only option to get it to work is not very GDPR-friendly

4 Likes
3

Thanks for your reply!