How to disable cache http server

#1
  1. My goal is: I am building simple http server with interactive checkbox that modify json file in file system through rpc function call.
  2. My actions are: I put the library link in yml file https://github.com/mongoose-os-libs/http-server.
  3. The result I see is: I did see my page is showing and all good except the json file seems not loaded with refresh method, but I must use ctrl + F5. When I am disabling cache with developer mode all were working fine.
  4. My expectation & question is: I think mongoose os is caching my json file by default, I need to disable the caching.
#2

Where do you “disable cache with developer mode”, in the browser ? Ctrl-F5 affects your browser, not the server, your browser is caching the file.
How is the JSON file being get ?
Did you try serving your content dynamically from within an RPC, callable from your page with (for example) zepto ? (stripped down example follows, inspired on Owen Versteeg’s WiFi setup example)

<script src="zepto.min.js"></script>

  <div class="row form">

    <div class="col c4">
      <div class="form-control"><button href="#" class="btn btn-sm btn-c" id="control">Control</button></div>
    </div>

    <div class="col c8">
      <h3>Door is: </h3>
      <div id="status"></div>
    </div>

    <div class="col c8">
      <!-- <h3>Result:</h3> -->
      <div id="result"></div>
    </div>

  </div>

<script>
  var log = function(msg) {
    $('<span/>').html(msg + '\n').appendTo('#result')
  };

  $('#control').on('click', function() {
    log('Calling /rpc/Door.Set  ...');
    $.ajax({
      url: '/rpc/Door.Set',
      data: JSON.stringify({}),
      type: 'POST',
      // contentType: 'application/json',
      success: function(data) {
	      log('Result: ' + JSON.stringify(data));
      },
    })
  });

  var show = function(msg) {
    $('#status').replaceWith(msg)
  };

  window.setInterval(function(){
    $.ajax({
      url: '/rpc/Door.Get',
      data: JSON.stringify({}),
      type: 'POST',
      // contentType: 'application/json',
      success: function(data) {
        show(data.rc);
      },
    })
  }, 1000);
</script>
RPC.addHandler('Door.Set', function(args) {
    let response = {
    	rc: (1) ? 'OK' : 'Failed'
    };
    return response;
});
RPC.addHandler('Door.Get', function(args) {
    let response = {
    	rc: door_state
    };
    return response;
});
#3

Hello scaprile, thanks for the reply.
I am using microsoft edge which can disable cache while the developer tools is being opened.
I am getting the json file using fetch command.

fetch('setting.json').
then(function (response){ return response.json();}).
then(function(data){ //something to copy data to checkbox});

Also when I accessed the data through http GET from browser like

192.168.100.100/setting.json

I got old data, until i refresh the page then it shows latest data.

I got a solution which using RPC function FS.Get

   var xhr = new XMLHttpRequest();
   xhr.open("POST", "/rpc/FS.Get", true);
   xhr.setRequestHeader('Content-Type', 'application/json');
   var comm = {"filename": "setting.json"};
   xhr.send(JSON.stringify(comm));
   xhr.onload = function() {//something to copy to checkbox};

It worked like a charm, I wondered if there is any simpler solution, because the data obtained from FS.get is encoded base64.

#4

All your cache problems are browser side.
If the browser understands it is reading static content it will probably give you its local copy. On HTML pages you have some meta to signal the browser (and proxies, etc) data should not be cached.
When reading JSON data because we want dynamic content, instead of storing a file and serving that file, the content is retrieved by a GET or POST in a javascript served to the browser like what I posted before. The simple idea is something like this:

  • DEVICE
    • serve static HTML containing javascript or link to javascript that calls a CGI-type function to return dynamic data
    • function calls run some procedure to retrieve/generate the necessary info and return it, usually as JSON or XML
    • device running Mongoose-OS: RPC calls implement the CGI equivalent
  • BROWSER
    • gets page, loads scripts, executes scripts
    • scripts GET/POST CGI functions (in our case RPCs) and get data, usually JSON or XML
    • scripts display data in the page

AJAX = Asynchronous Javascript And XML
There is no “AJAJ” afaik, but this is effectively the same but using JSON instead of XML.

The first block I pasted before is the static HTML served, what the browser will parse and execute.
The second block is the RPCs implemented in mJS to be run on the device

#5

I already used RPC function to modify the json file with code below

static void setting_modifier(struct mg_rpc_request_info *ri, void *cb_arg, struct mg_rpc_frame_info *fi, struct mg_str args) {
 if (json_scanf(args.p, args.len, ri->args_fmt,&some_variable)) {
    mg_rpc_send_responsef(ri, "OK");
	LOG(LL_INFO, ("setting json file received"));
	json_fprintf("setting.json", "{json format}", some_variable);
 }else {
    mg_rpc_send_errorf(ri, -1, "Bad request");
 }
  
  (void) cb_arg;
  (void) fi;
}

The json parameters are well-received with RPC handler like this.

I don’t know what the cause of this caching problem, I am still new in mongoose OS. Once I was using arduino asyncwebserver library, the file didn’t cache with same browser.

#6

I don’t think it is a mOS “problem”, but you can put a network sniffer (Wireshark) and see whether your browser is caching and why