"Allow list" in Miro? To get around CORS policy

  • 16 February 2021
  • 3 replies
  • 302 views

Attempting to implement a Web-plugin that imports/uses data published on a webserver.

This works OK if the webserver is the same as where the Web-plugin is published.

But when data is published on different server the browser CORS protection prevents accessing the data.

I’m not a web hacker, but if I understand it correctly to allow this the Server needs to modify the CORS policy by adding the data source location to the “Allow list”. Am I correct in this ?

Would it be possible to add such listing in the plugin setup or installation?

This would allow for a range of quite interesting features:

  • Importing and synchronizing JIRA issues without JIRA Integration (our corp. policy does not allow such external access to an internal server)
  • Charts and diagrams updated from live data
  • Images and other content integrated into Miro

Or is there some other solution?

BR

/Per


3 replies

Userlevel 4
Badge

Hello Per,

 

Sorry for the late reply. If I understand correctly, you are asking if we could allow requests from the browser to our REST API. Is that correct? If so, this is not possible at the moment. It is a request that comes up frequently, but there are still some changes that we need to make to make that happen. For more context, please refer to this post:
https://community.miro.com/developer-platform-and-apis-57/cors-error-when-accessing-miro-api-from-web-plugin-3256

 

Hopefully we will be able to allow this in the not-so-distant future. We are aware that it would let developers build many more integrations with less complexity.

If I misunderstood your question, please let me know.

Kind regards.

 

Daniela

No I'm not accessing the Miro Rest API!

In a webapp I attempt to access data from a server.

Example:

fetching a file:

        const response = await fetch(url, {
method: 'GET',
});

The content of the published file is used to modify the content of a Miro page 

                const shapes = (
await miro.board.widgets.get({
type: 'card',
})
).filter((shape) => !!shape.metadata[appId]);
const shape = shapes.find((shape) => shape.metadata[appId].key === issue.key);
if (shape) {
...

If the url is the same server as where the code is published it works!

If the file is published on another server the CORS policy prevents use of the file content.

To clarify:

I have implemented this using both internal and external github/gitlab pages.

If the “datafile” resides on the same server as where the Web-plugin is published the access to the data works fine, but if they reside on different the CORS protection prevents access to it.

I believe that the server where the Web-plugin is published is Allow-listed by Miro, but not other servers.

If there was an option to add other external sources it would be possible to create a whole range of scripts/gadgets that could automatically update views, graphs or images. Today information in Miro is dead and outdated, not updated, becoming obsoleted.

Reply