Writing to XML file on apache server using jQuery (without using server-side script)

Question

I have xml data fetched from a file on the server side, successfully accessed without use of server-side scripts (e.g. no php).

I'd like to write that xml data back to the file on the server side after some minor changes, again without use of server-side scripts (e.g. no php). Here is what I have so far:

<button id='WriteToXml'>Write to XML</button>   

<script>        

    $('#WriteToXml').click(function () {

        var output_xml;

        $.ajax({
            type: "GET",
            url: "/data/testdata_input.xml",
            dataType: "xml",
            async: false,

            success: function(xml) {            
                $(xml).find('input').remove();
                $(xml).find('test').append('<output></output>');
                output_xml = xml;
            }
        });

        // Alternative code?
        // $.post( "/data/testdata_output.xml", $(output_xml), "xml" );

        $.ajax({
            type: 'POST',
            url: "/data/testdata_output.xml", //url of receiver file on server
            data: $(output_xml) , //your data
            contentType: "text/xml",
            dataType: "xml",
            cache: false,       
            async: false,

            success: function(xml) {console.log( 'success\n'+ $(xml).find('test') );}

        });

    });

</script>

In another SO thread, I read that it was necessary to use a server-side script due to the design of javascript (for security reasons). But then in another thread, I saw code that didn't involve php, so I'm hoping I could use that code to write to the xml file on the server:

$.ajax({
    type: 'POST',
    url: "/data/testdata_output.xml", //url of receiver file on server
    data: "<test></test>" , //your data
    contentType: "text/xml",
    dataType: "xml",
    cache: false,       
    async: false,

    success: function(xml) {console.log( 'success\n'+ $(xml).find('test') 

So far I get a success message, but the xml file on the server remains intact. It would be great to understand where I misunderstood. In the meantime I will use this php code on the server-side and try to have it work:

//javascript
$.post('savedata.php', {data: "<test></test>",filename: "/data/testdata_output.xml"}, function(){/*Save complete*/});

//savedata.php
$data = $_POST['data'];
$filename = $_POST['filename'];
$f = fopen($filename, 'w+');
fwrite($f, $data);
fclose($f);

But it would still be nice to understand.

Also, I'd love some notes on using xml file types in the $.post code rather than a php file (based on the $.post jquery doc):

$.post( "/data/testdata_output.xml", "<test></test>", "xml" );

Thanks

Answer 1

You need a server side script to handle anything that modifies the server. That script should set out the restrictions on who is allowed to write what and where. It's not due to the design of javascript; it's just that otherwise, anyone could write any file to any web server, which is clearly unsafe.

When the URL of the request is a script that responds to user input, you'd use an HTTP POST. When the URL of the request represents a file to be written (as in your case), you would typically use an HTTP PUT. (You don't really have to use PUT -- you're the one writing the handler script, after all -- but writing to a file on the server is what PUT is for.)

In terms of the jquery request, without server-side scripting, the POST request is not significantly different from a GET request, in that the content of the file found at the URL is returned as the body of the response. (There are differences -- e.g. the POST would not be cached -- but I think that's the gist of the jquery example you mention.)