I don't think this can be done "cleanly", but I'll ask anyway.

I have a system which needs to get a JSON resource via a REST GET call in order to initialize. At the moment the system waits until the onLoad event and fires an ajax request to retrieve the resource, which I don't think is the best way to do it, as the resource is needed a run time.

What I would love to do is somehow load the resource at runtime inside an HTML tag then eval the contents. But what I'm working on is an API to be used by others, so I would like to achieve this in a logical and standards based way.

So is there any tag which fits the bill? A tag which can be placed in the doc head, that I will be able to read and eval the contents of at runtime?

Regards,

Chris

I don't think this can be done "cleanly", but I'll ask anyway.

I have a system which needs to get a JSON resource via a REST GET call in order to initialize. At the moment the system waits until the onLoad event and fires an ajax request to retrieve the resource, which I don't think is the best way to do it, as the resource is needed a run time.

What I would love to do is somehow load the resource at runtime inside an HTML tag then eval the contents. But what I'm working on is an API to be used by others, so I would like to achieve this in a logical and standards based way.

So is there any tag which fits the bill? A tag which can be placed in the doc head, that I will be able to read and eval the contents of at runtime?

Regards,

Chris

• javascript
• html
• dom

Share Improve this question Follow asked Dec 28, 2008 at 5:09 ChrisInCamboChrisInCambo 8,8151515 gold badges5353 silver badges6464 bronze badges 1

• I'm currently looking at the link tag - <link type="application/json" href="my.json" /> and wondering how I could make this work. – ChrisInCambo Commented Dec 28, 2008 at 5:14

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 3

Maybe I'm not understanding but couldn't you just:

<?php
$json_data = json_encode($your_data);
?>

<script>
var data = <?= $json_data ?>;
</script>

Is lack of CDN caching (Akamai etc) going to be a problem for you? If not, you could drop a script tag on the page, point the src attribute to a server side script which returns content with a javascript mime-type and contains the JS object you requested. It would be just like including an external script, only dynamically generated.

Ex:

In the head, have something like:

<script src="/js/loadjs.php?id=123"></script>

And have loadjs.php return something like:

var MyApp.initData = { id: 123, setting1: "xyz" };

Downside is that you would be unable to cache it via a CDN. I think browser caching would still work if you needed.

I was thinking of putting it in an iframe but then I realized that you have a problem with that the content-type is application/json. When I tested FF, IE and Chrome was trying to download the file and asked the user where to store it (Opera displayed the file)

Putting it in a LINK will not help you since the browser will not try to fetch the document (it only fetches for known resources like style-sheet)

To me it looks like you have to use AJAX. Can you elaborate on why that's a problem?

JSON on its own does nothing; you can't just use <script> to include it because it'll create an object that gets assigned to... nowhere. You'll have to modify it - either put it in a JS string to parse or stick a "var foo =" in front of it.

Do you have control of any server? Because if yes, you could use your server to proxy the service and wrap the JSON response with the appropriate "var" statement.

Alternatively, I believe this would work (I haven't tested it, and I always miscapitalize "innerHtml"), although IMO it's not terribly clean:

<script id="data" src="http://someotherserver./json.js"></script>
<script type="text/javascript">
    var dataElem = document.getElementById("data");
    if (dataElem)
    {
        var myData = eval(dataElem.innerHtml);
    }
</script>

Surgeon General's warning: eval-ing results from a server that you don't control is a bad idea.