Unhandled http error while appending an html with script element


I have an application where the customers can load arbitrary HTML code which is then loaded into the DOM via jQuery.
A customer had a copy and paste error which linked to an non existing js file. This lead to an 404 but nevertheless jQuery pushes the return value (error HTML page) into a HTMLScriptElement text property. This leads to an exception:

Uncaught SyntaxError: Unexpected token <
at DOMEval (jquery-3.3.1.js:111)
at Function.globalEval (jquery-3.3.1.js:345)
at text script (jquery-3.3.1.js:9640)
at ajaxConvert (jquery-3.3.1.js:8784)
at done (jquery-3.3.1.js:9255)
at XMLHttpRequest.<anonymous> (jquery-3.3.1.js:9548)
at Object.send (jquery-3.3.1.js:9600)
at Function.ajax (jquery-3.3.1.js:9206)
at Function.jQuery._evalUrl (jquery-3.3.1.js:9367)
at domManip (jquery-3.3.1.js:5759)

Minimal test case

Put this HTML onto an webserver:

<!DOCTYPE html>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>
	function clickme() {
			var jBody = $(document.body);
			jBody.append('<script type="text/javascript" src="notexisting.js"><'+'/script>');
        <button onclick="clickme()">Click</button>

Author: Fantashit

1 thought on “Unhandled http error while appending an html with script element

  1. I wasn’t sure about what changes were necessary and had been exploring extensions to ajax converter and dataFilter arguments, but in the end came to a much simpler conclusion: rather than relying upon them, we should update jQuery._evalUrl to evaluate responses manually:

    return jQuery.ajax( {
    	url: url,
    	// Make this explicit, since user can override this through ajaxSetup (#11264)
    	type: "GET",
    	dataType: "text",
    	cache: true,
    	async: false,
    	global: false,
    	"throws": true,
    	// Only evaluate the response if it is successful (gh-4126)
    	success: function( text ) { jQuery.globalEval( text ); }
    } );

Comments are closed.