How can I get the content of the file specified as the ‘src’ of a tag?

by

tl;dr script tags are not subject to CORS and same-origin-policy and therefore javascript/DOM cannot offer access to the text content of the resource loaded via a <script> tag, or it would break same-origin-policy.

long version:
Most of the other answers (and the accepted answer) indicate correctly that the “correct” way to get the text content of a javascript file inserted via a <script> loaded into the page, is using an XMLHttpRequest to perform another seperate additional request for the resource indicated in the scripts src property, something which the short javascript code below will demonstrate. I however found that the other answers did not address the point why to get the javascript files text content, which is that allowing to access content of the file included via the <script src=[url]></script> would break the CORS policies, e.g. modern browsers prevent the XHR of resources that do not provide the Access-Control-Allow-Origin header, hence browsers do not allow any other way than those subject to CORS, to get the content.

With the following code (as mentioned in the other questions “use XHR/AJAX”) it is possible to do another request for all not inline script tags in the document.

function printScriptTextContent(script)
{
  var xhr = new XMLHttpRequest();
  xhr.open("GET",script.src)
  xhr.onreadystatechange = function () {
    if(xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
      console.log("the script text content is",xhr.responseText);
    }
  };
  xhr.send();
}
Array.prototype.slice.call(document.querySelectorAll("script[src]")).forEach(printScriptTextContent);

and so I will not repeat that, but instead would like to add via this answer upon the aspect why itthat

More Related Contents:

  1. What does the ++ sign mean in programming code? [duplicate]
  2. Uncaught ReferenceError: $ is not defined?
  3. Can scrapy be used to scrape dynamic content from websites that are using AJAX?
  4. Is there a case insensitive jQuery :contains selector?
  5. How to add hours to a Date object?
  6. Are +0 and -0 the same?
  7. In JavaScript, why is “0” equal to false, but when tested by ‘if’ it is not false by itself?
  8. Regex to replace multiple spaces with a single space
  9. How to detect Ctrl+V, Ctrl+C using JavaScript?
  10. How to get progress from XMLHttpRequest
  11. How do you add CSS with Javascript?
  12. Jquery load() only working in firefox?
  13. get client time zone from browser [duplicate]
  14. How to duplicate object properties in another object? [duplicate]
  15. Facebook how to check if user has liked page and show content?
  16. execute function after complete page load [duplicate]
  17. Calling method using JavaScript prototype
  18. Best way to obfuscate an e-mail address on a website?
  19. How to get the HTML for a DOM element in javascript
  20. In React, what’s the difference between onChange and onInput?
  21. Using Bootstrap Modal window as PartialView
  22. HTML5 Drag and Drop anywhere on the screen
  23. How to mock localStorage in JavaScript unit tests?
  24. How to use npm module in DENO?
  25. VSCode Linter ES6 ES7 Babel linter
  26. HTML5 canvas drawImage with at an angle
  27. Override default behaviour for link (‘a’) objects in Javascript
  28. How to get selected value of a dropdown menu in ReactJS
  29. Why my $.ajax showing “preflight is invalid redirect error”?
  30. What is the difference between these Backbone/Underscore .bind() methods?

Leave a Comment