Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

.append() script string to iframe causes script execution in top window #4518

Closed
frontend-trends opened this issue Oct 17, 2019 · 2 comments · Fixed by #4601
Closed

.append() script string to iframe causes script execution in top window #4518

frontend-trends opened this issue Oct 17, 2019 · 2 comments · Fixed by #4601

Comments

@frontend-trends
Copy link

@frontend-trends frontend-trends commented Oct 17, 2019

index.html

<iframe id="frameID" width="200" height="200" srcdoc="<html><body></body></html>"></iframe>
  <script>
    var hello = 'hello';
    window.onload = function() {
      var script = "<script type=\"text\/javascript\" src=\"script.js\" async=\"async\"><\/script>";
      $('#frameID').contents().find('body').append(script);
    }
</script>

script.js

alert(hello)

I expect the script is executed in iframe body

@frontend-trends frontend-trends changed the title append script string to iframe causes script execution on root body using .append() .append() script string to iframe causes script execution in top window Oct 22, 2019
@aduggal007
Copy link

@aduggal007 aduggal007 commented Jan 17, 2020

Keep in mind the following things and your code would work

  1. Use src in place of srcdoc, because of lack of support among browsers for srcdoc
  2. If you need to modify the body, do so by modifying the src tag and not the contents()
  3. If you are referring to an external script make sure it's using https: and not file:// as it will be blocked due to CORS

The final working code is:

<iframe id="frameID" src="data:text/html;charset=utf-8,<html><body>hi</body></html>"></iframe>
<script>
$(document).ready(function() {
//could be replace by an external script like%3cscript src="link_of_the_script"%3E%3C/script%3E
var script = "%3Cscript%3Edocument.write(1);%3C/script%3E";
//get the contents of the src attribute
var srcAttribute = $("#frameID")[0].src;
//find index where you want to add the script
var beginningIndex = srcAttribute.indexOf("<body>");
//change the src attribute of iframe
$("#frameID")[0].src = [srcAttribute.slice(0,beginningIndex+6),script,srcAttribute.slice(beginningIndex+6)].join(''); });
</script>

@mgol mgol self-assigned this Jan 20, 2020
@mgol mgol added this to the 3.5.0 milestone Jan 20, 2020
mgol added a commit to mgol/jquery that referenced this issue Feb 3, 2020
…in globalEval

1. Support passing custom document to jQuery.globalEval; the script will be
   invoked in the context of this document.
2. Fire external scripts appended to iframe contents in that iframe context;
   this was already supported & tested for inline scripts but not for external
   ones.

Fixes jquerygh-4518
@mgol
Copy link
Member

@mgol mgol commented Feb 3, 2020

PR: #4601

mgol added a commit to mgol/jquery that referenced this issue Feb 3, 2020
…in globalEval

1. Support passing custom document to jQuery.globalEval; the script will be
   invoked in the context of this document.
2. Fire external scripts appended to iframe contents in that iframe context;
   this was already supported & tested for inline scripts but not for external
   ones.

Fixes jquerygh-4518
mgol added a commit to mgol/jquery that referenced this issue Feb 4, 2020
…in globalEval

1. Support passing custom document to jQuery.globalEval; the script will be
   invoked in the context of this document.
2. Fire external scripts appended to iframe contents in that iframe context;
   this was already supported & tested for inline scripts but not for external
   ones.

Fixes jquerygh-4518
mgol added a commit that referenced this issue Feb 10, 2020
1. Support passing custom document to jQuery.globalEval; the script will be
   invoked in the context of this document.
2. Fire external scripts appended to iframe contents in that iframe context;
   this was already supported & tested for inline scripts but not for external
   ones.

Fixes gh-4518
Closes gh-4601
mgol added a commit that referenced this issue Feb 10, 2020
1. Support passing custom document to jQuery.globalEval; the script will be
   invoked in the context of this document.
2. Fire external scripts appended to iframe contents in that iframe context;
   this was already supported & tested for inline scripts but not for external
   ones.

Fixes gh-4518
Closes gh-4601

(cherry picked from commit 4592595)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Development

Successfully merging a pull request may close this issue.

4 participants