IFrame or remote JS file

Question

I have a complex page that can be customized and needs to be embedded on the sites of some clients. For each client, it should look the same, but the parameters may be slightly different. The page also contains a custom object that uses the plugin in the browser.

I had 2 ideas for this:

• Using iFrame - so I just insert my page and pass the parameters to the Query String.
• Using a remote JS file - for example, SDK for Facebook and other Work. Passing parameters in JS code. As far as I understand, I can just put some “parent” div on the page and the remote JS file, which should fill the parent div with the necessary elements.

Which should i use? What are the cons / pros of each?

Thanks!

Answer 1

Take a look at this article , which details how to achieve the goal.

Pros of IFrame:

If the owner of the mashup page is really related to security, malicious scripts running in widgets, then the IFRAME approach is preferable because script widgets will have limited access to the main page and, therefore, can not do much harm to the page on which it is embedded.

In addition, this approach is preferable if the widget owner wants to control the layout and style of his widget. Since IFRAME is essentially a separate web page, CSS mashups scripts cannot harm the widget.

Minuses:

it is slow, resource-intensive [in the browser] and does not give the owner of the mashup page the ability to style widgets the way he wants.

Answer 2

I had a similar problem a while ago. You have three choices, depending on how secure and flexible your plugin will be.

IFrame

pros

• safe enough - you can submit data that should be viewed only to a specific user and allow the transfer of confidential data to your service. The page that includes your plugin will not have access to it.
• which includes your iframe, will not be able to modify its contents to confuse the user.

vs

• slow
• limited connection between your plugin and page (can be resolved by message message / porthole between windows, but this is not ideal)
• the page can still cheat users in treachery, they see your plugin while they have their own copy or click
• if you include any assets from a third party server, the lost bit of your security
• limited to a rectangular box

script

pros

• extremely flexible
• easy to implement many callbacks to respond to events on the page
• fast
• can integrate with the page interface in different ways and points.

vs

• in principle, you can put it in any way on the page that includes it. You have no control over what users will see at the end.

redirect through your service and then back

pros

• most secure solution

vs

• harder to integrate
• may not interact with other elements of the website that uses the plugin (because when users see your plugin, they no longer see the source site).