search

oracle-samples / cerner-smart-embeddable-lib

npm project for developers to use in their SMART web app to be embeddable in Cerner’s MPage Workflow
Apache License 2.0
22 stars 31 forks source link

Embedding an application outside of Cerner in an iframe #23

Closed tbalasavage closed 3 years ago

tbalasavage commented 4 years ago

I contribute to an application that uses this library. We're experiencing an issue where it appears that the hidden attribute that we've added to the html tag as per the documentation prevents the application from rendering outside of a Cerner iframe; the screen is white until you remove the hidden attribute from the DOM. Do you have a suggestion as to how this can be avoided?

kolkheang commented 4 years ago

Hi @ps-tb,

Adding the hidden attribute to the html document is our recommendation to prevent Clickjacking since X-Frame-Options header is disabled. If you know the site URL that will embed (using iframe) your application, you could add that site's URL into the ACL list in the library and re-generate the JavaScript assets.

kolkheang commented 4 years ago

The JavaScript code will remove the hidden attribute from the DOM if the page isn't being rendered inside of a frame.

Another option (not ideal) is to host a different endpoint for your application? Or, dynamically detect in the code whether to load and use this library or not.

tbalasavage commented 4 years ago

@kolkheang Thanks for the response. In response to the suggestions:

  1. If we were to do this, we'd have to fork the library and keep it updated with your library changes. Is that correct?
  2. I don't think that a different endpoint is likely the solution that we can confidently maintain.
  3. I'd need to research if/how to accomplish this but we've discussed the idea at least as well.

Is there anything that your library can do to help in this situation? This seems like it may be an increasingly common scenario for applications in multiple environments.

kolkheang commented 4 years ago

Hi @ps-tb,

  1. Yes, if you already bundle the JavaScript assets in your project, you'd add the additional URLs into the ACL list.
  2. Yes, agreed that it's going to be a lot of work in term of deployment, and maintenance of multiple endpoints.
  3. Sounds good. I think this option might be the best option if you can figure that out.

There isn't anything in the library today to conditionally enforce this rule. Since we recommend removing the X-Frame-Options header in favor of this library, without this library, the page is open to Clickjacking.

I can log a ticket to investigate if there is anything we can do to help with the scenario that you've described.

tbalasavage commented 4 years ago

@kolkheang Thanks for the info and help

tbalasavage commented 4 years ago

@kolkheang If we were to conditionally load the library, I'd like to remove the hidden attribute from the HTML so that it's not present outside of Cerner. When we first started to use the library and didn't include the hidden attribute, I believe that I saw console log messages that stated that the library has added the hidden attribute because it wasn't present. Is that behavior correct? Can I exclude it and it will be added for me?

shriniketsarkar commented 3 years ago

@ps-tb Sorry about the delay in responding here. Yup you saw correct, based on the code here : https://github.com/cerner/xfc/blob/master/src/provider/provider.js#L6-L15 the hidden attribute will be added if its absent from the page document.

The behavior is as expected because since the X-Frame-Options are disabled, the smart app will need to be protected from clickjacking for which the SMART app will need to consume this library which ensures prevention against clickjacking by hiding the page until authorized using XFC framework.

If you dont manually add the hidden attribute then it will get added automatically if this JS library is added on the page.

As @kolkheang mentioned above you should be able to conditionally include this library on each of your pages by identifying if the application is running in Cerner's EHR i.e Powerchart. Ref : https://fhir.cerner.com/smart/#embedded-browser-control there is a section for : Embedded in Powerchart?

tbalasavage commented 3 years ago

@shriniketsarkar Thanks for the info. We've taken this idea and are conditionally adding it if we launch within Cerner. That seemed to be the most reasonable solution for us and we're actively testing it out now. We had some help from Cerner and now have a Powerchart test instance that we can use for this purpose, which as been extremely helpful.

kolkheang commented 3 years ago

@tbalasavage please share any high level design approach that you've taken (if you can) on this in case others are wanting to do the same.

You may want to have another check / allow list (of authorized party using known hosts/URLs?) in case in the future, we have an additional places to embed the the app (example: outside of PowerChart).