Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #28601 > unrolled thread

Can AJAX request a .js file?

Back to article view | Back to comp.lang.javascript

Contents

  Can AJAX request a .js file? Jay Braun <lyngwyst@gmail.com> - 2015-09-02 14:47 -0700
    Re: Can AJAX request a .js file? "Christoph M. Becker" <cmbecker69@arcor.de> - 2015-09-03 00:11 +0200
      Re: Can AJAX request a .js file? Jay Braun <lyngwyst@gmail.com> - 2015-09-02 15:15 -0700
        Re: Can AJAX request a .js file? "Christoph M. Becker" <cmbecker69@arcor.de> - 2015-09-03 00:46 +0200
          Re: Can AJAX request a .js file? Jay Braun <lyngwyst@gmail.com> - 2015-09-03 12:50 -0700
            Re: Can AJAX request a .js file? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2015-09-04 00:14 +0200
            Re: Can AJAX request a .js file? "Christoph M. Becker" <cmbecker69@arcor.de> - 2015-09-04 00:44 +0200
              Re: Can AJAX request a .js file? Jay Braun <lyngwyst@gmail.com> - 2015-09-03 18:52 -0700
                Re: Can AJAX request a .js file? Hans-Georg Michna <hans-georgNoEmailPlease@michna.com> - 2015-09-04 18:28 +0200
                  Re: Can AJAX request a .js file? Jay Braun <lyngwyst@gmail.com> - 2015-09-04 15:47 -0700
                    Re: Can AJAX request a .js file? Stefan Weiss <krewecherl@gmail.com> - 2015-09-05 03:12 +0200
                      Re: Can AJAX request a .js file? Jay Braun <lyngwyst@gmail.com> - 2015-09-05 20:09 -0700

#28601 — Can AJAX request a .js file?

Can I use XMLHttpRequest to request a .js file, e.g.:

request.open('GET', latest.js);

I idea is to have the "latest" in a series of regularly generated .js files pulled to my client, and processed by my browser.

Jay 

[toc] | [next] | [standalone]

#28602

Jay Braun wrote:

> Can I use XMLHttpRequest to request a .js file, e.g.:
> 
> request.open('GET', latest.js);

Basically, yes.  Of course you have to put `latest.js` in quotes
(probably just a typo), and SOP applies as usual.

However, you would have to evaluate the script manually (i.e. the host
won't do it automatically).  You may consider letting the host
environment do the work for you by dynamically adding a respective
script element, instead.  You can circumvent client side caching by
adding a unique query string to the URI.  IIRC, the FAQ[1] elaborates on
this.

[1] <http://pointedears.de/scripts/faq/cljs/>

-- 
Christoph M. Becker

[toc] | [prev] | [next] | [standalone]

#28603

Yes, sorry, I forgot the quotes.

I want the .js to run in my browser, i.e., the server simply send it over for client-side processing.  Is that what you were describing?

j

[toc] | [prev] | [next] | [standalone]

#28605

Jay Braun wrote:

> I want the .js to run in my browser, i.e., the server simply send it
> over for client-side processing.  Is that what you were describing?

If you request the JS resource with XHR, only the data (i.e. the script)
are sent.  You'd have to eval() them to execute the script.

-- 
Christoph M. Becker

[toc] | [prev] | [next] | [standalone]

#28618

> If you request the JS resource with XHR, only the data (i.e. the script)
> are sent.  You'd have to eval() them to execute the script.

Thank you.  The script is definitely coming over (verified with the console browser).  But the JavaScript, which works when loaded statically with a <script> tag, is not executing.

My script contains many double quotes.  Do I need to escape them?

Just for reference, here is the JavaScript code that requests the JavaScript file every 2 seconds (the "every 2 seconds" in just for testing purposes):

    var dummy = setInterval(function() {
        var request = new XMLHttpRequest();
        request.open("GET", "var.js");
        request.setRequestHeader("Content-Type", "text/plain;charset=UTF-8");
        request.send();
        request.onreadystatechange = function() {
           if (request.readyState==4 && request.status==200) {
              var e = eval(request.responseText);
           }
        }
    }, 2000);

[toc] | [prev] | [next] | [standalone]

#28619

Jay Braun <lyngwyst@gmail.com> wrote on 03 Sep 2015 in comp.lang.javascript:

> var e = eval(request.responseText);

I fail to see the necessity of a return value,
so:

eval(request.responseText);

If the below works, 
the above should work,
given a correct code content:

var t = "alert('hi');"
eval(t)

So first test your code this way.

-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#28620

Jay Braun wrote:

> Thank you.  The script is definitely coming over (verified with the console browser).  But the JavaScript, which works when loaded statically with a <script> tag, is not executing.

Are you sure that it isn't evaluated?  I can imagine that the script
registers an event listener for the onload event of the Window object or
such.  In this case the listener may be registered, but never triggered.

There may be other reasons why the code doesn't work as expected, even
though the script is evaluated.

> My script contains many double quotes.  Do I need to escape them?

No.  (That would be necessary, though, if you would evaluate code in a
string literal.)

> Just for reference, here is the JavaScript code that requests the JavaScript file every 2 seconds (the "every 2 seconds" in just for testing purposes):
> 
>         request.setRequestHeader("Content-Type", "text/plain;charset=UTF-8");
>         request.send();

I don't think it makes sense to set a Content-Type request header, when
the body of the request is empty.

-- 
Christoph M. Becker

[toc] | [prev] | [next] | [standalone]

#28624

Just a shot in the dark:  Is there a limit on the size of an eval argument?  The script can be several hundred Kb in length.

Thanks,
Jay

On Thursday, September 3, 2015 at 3:44:29 PM UTC-7, Christoph M. Becker wrote:
> Jay Braun wrote:
> 
> > Thank you.  The script is definitely coming over (verified with the console browser).  But the JavaScript, which works when loaded statically with a <script> tag, is not executing.
> 
> Are you sure that it isn't evaluated?  I can imagine that the script
> registers an event listener for the onload event of the Window object or
> such.  In this case the listener may be registered, but never triggered.
> 
> There may be other reasons why the code doesn't work as expected, even
> though the script is evaluated.
> 
> > My script contains many double quotes.  Do I need to escape them?
> 
> No.  (That would be necessary, though, if you would evaluate code in a
> string literal.)
> 
> > Just for reference, here is the JavaScript code that requests the JavaScript file every 2 seconds (the "every 2 seconds" in just for testing purposes):
> > 
> >         request.setRequestHeader("Content-Type", "text/plain;charset=UTF-8");
> >         request.send();
> 
> I don't think it makes sense to set a Content-Type request header, when
> the body of the request is empty.
> 
> -- 
> Christoph M. Becker

[toc] | [prev] | [next] | [standalone]

#28634

On Thu, 3 Sep 2015 18:52:51 -0700 (PDT), Jay Braun wrote:

>Just a shot in the dark:  Is there a limit on the size of an eval argument?  The script can be several hundred Kb in length.

I propose to insert a script element dynamically. I think that
is more elegant anyway.

Note that the insertion takes some time. So if the inserted code
does not start doing something on its own, the calling code
should wait until the inserted code is completely available.

Hans-Georg

[toc] | [prev] | [next] | [standalone]

#28636

> I propose to insert a script element dynamically. I think that
> is more elegant anyway.

Hello.  Prior to reading this response, I tried something like that, i.e., creating a script element dynamically, and calling the desired function, which comprises the created script.  That works, but there's one remaining (big) problem:  Even though the second script is re-generated periodically, the logic in the first version is executed.  It's as if the second script has already been loaded into memory, and I cannot get rid of it, even with extreme measures.

Here is my most recent attempt, with extreme measures to "wipe out" the script element before creating a new one.  The function repaint() comprises the called script, a new version of which is generated periodically by a conventional C program running on the server machine.

    setInterval(
       function() {
          var fileref;
          if (fileref===undefined) {
             console.log("creating script");
             fileref=document.createElementNS (xmlns, "script");
             fileref.setAttribute("type","text/javascript");
             fileref.setAttribute("src", "var.js");
             console.log("calling repaint");
             repaint(xmlns, svgElem);
             fileref.remove();
             fileref=undefined;
          }
       }, 3000 );

Note that the messages logged to the browser console are being output every 3 seconds.  Each call to repaint executes the logic of the first version of the script, even though it has been overwritten.

I get the same results whether or not the outer html file defines var.js as a script.  The scrpt containing the above code, fixed.js, is defined in the html file as a script.  Here is my index.html with both .js files defined:

<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>Ping!</title> 
    <style>
        #svgContainer {
            width:  2401px;
            height: 2401px;
        }
    </style>
<script type='text/javascript' src='fixed.js'></script>
<script type='text/javascript' src='var.js'></script>
</head>
<body onload="resagui()">
    <div id="svgContainer"></div>
</body>

Incidentally, my application *does* execute new versions of var.js every 5 seconds if, instead of the JavaScript logic above, I put the following in the <title> section:

<meta http-equiv="refresh" content="5">

But that also re-execues fixed.js, which retrieves a large .png image from the server.  It's very time-consuming.

Thank you for any ideas you can offer.

Jay

[toc] | [prev] | [next] | [standalone]

#28638

On 2015-09-05 00:47, Jay Braun wrote:
>     setInterval(
>        function() {
>           var fileref;
>           if (fileref===undefined) {
>              console.log("creating script");
>              fileref=document.createElementNS (xmlns, "script");
>              fileref.setAttribute("type","text/javascript");
>              fileref.setAttribute("src", "var.js");
>              console.log("calling repaint");
>              repaint(xmlns, svgElem);
>              fileref.remove();
>              fileref=undefined;
>           }
>        }, 3000 );
> 
> Note that the messages logged to the browser console are being output
> every 3 seconds. Each call to repaint executes the logic of the first
> version of the script, even though it has been overwritten.

You never add `fileref` to the document, so nothing gets overwritten.
Try something along the lines of

    document.body.appendChild(fileref);

before you call `repaint()`.

If I understand correctly, the C program on the server side creates JS
code to alter the SVG contents, which then gets evaluated on the client,
replacing an existing function. That's one way to do it, but not
necessarily the most efficient or elegant one. I haven't read all of the
thread up to this point, so this may have been suggested before... if I
were to design this, it would probably look like this:

  1. client polls the server for new data, using XMLHttpRequest
  2. server collects data and sends a JSON response
  3. client receives JSON and creates a JS object or array from it
  4. client calls `repaint(newData)`
  [repeat]

Obviously, this would require modifying the server-side program; I don't
know if that's an option for you.


- stefan

[toc] | [prev] | [next] | [standalone]

#28651

Thank you, Stefan.  I feel kind of stupid leaving out the appendChild(), since I use it elsewhere.

Your understanding of my application is correct, and I am grateful for the design alternative.  

-- Jay

On Friday, September 4, 2015 at 6:12:56 PM UTC-7, Stefan Weiss wrote:
> On 2015-09-05 00:47, Jay Braun wrote:
> >     setInterval(
> >        function() {
> >           var fileref;
> >           if (fileref===undefined) {
> >              console.log("creating script");
> >              fileref=document.createElementNS (xmlns, "script");
> >              fileref.setAttribute("type","text/javascript");
> >              fileref.setAttribute("src", "var.js");
> >              console.log("calling repaint");
> >              repaint(xmlns, svgElem);
> >              fileref.remove();
> >              fileref=undefined;
> >           }
> >        }, 3000 );
> > 
> > Note that the messages logged to the browser console are being output
> > every 3 seconds. Each call to repaint executes the logic of the first
> > version of the script, even though it has been overwritten.
> 
> You never add `fileref` to the document, so nothing gets overwritten.
> Try something along the lines of
> 
>     document.body.appendChild(fileref);
> 
> before you call `repaint()`.
> 
> If I understand correctly, the C program on the server side creates JS
> code to alter the SVG contents, which then gets evaluated on the client,
> replacing an existing function. That's one way to do it, but not
> necessarily the most efficient or elegant one. I haven't read all of the
> thread up to this point, so this may have been suggested before... if I
> were to design this, it would probably look like this:
> 
>   1. client polls the server for new data, using XMLHttpRequest
>   2. server collects data and sends a JSON response
>   3. client receives JSON and creates a JS object or array from it
>   4. client calls `repaint(newData)`
>   [repeat]
> 
> Obviously, this would require modifying the server-side program; I don't
> know if that's an option for you.
> 
> 
> - stefan

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web