etag in REST api for concurrency issue

Hi All,

I have  the following code where I am using etag in REST api to check for concurrency.

var ProjectName = ProjectName || {};
ProjectName.Functions = ProjectName.Functions || {};

var itemTitle ="Item1"


ProjectName.Functions.GetNextSeq = function(itemTitle, p) {

  // If we've passed in a deferred object, then use it, else create a new one (this enables recursion)
  var deferred = p || $.Deferred();

  // Get the information from the Configuration list
  var Configuration = {};
  var etag;
  
		
		Configuration = $.ajax({
    url: "https://domain.sharepoint.com/sites/siteURL" +"/_api/web/lists/getbytitle('ListName')/items?" +"$select=*&$filter=LinkTitle eq '" + itemTitle + "'",
    method: "GET",
    headers: {"Accept": "application/json; odata=verbose"
    },
    success: function(data) {

      if (data.d.results.length > 0) {
        var thisParam = data.d.results[0];
        Configuration[thisParam.Title] = {
          Count: thisParam.Count,
          ID: thisParam.ID,
          etag: thisParam["__metadata"].etag
        }

      }
	 
	var webUri = "https://domain.sharepoint.com/sites/siteURL";
	ProjectName.Functions.GetFormDigest(webUri).then(function (data) {  

      $.ajax({
        url: webUri +"/_api/web/lists/getbytitle('ListName')/items(" + Configuration.responseJSON.d.results[0].Id + ")",
        type: "POST",
        contentType: "application/json;odata=verbose",
        data: JSON.stringify({"__metadata": {"type": "SP.Data.ListNameListItem"
          },"Count": (parseInt(Configuration.responseJSON.d.results[0].Count) + 1).toString()
        }),
        headers: {"Accept": "application/json;odata=verbose","X-RequestDigest": $("#__REQUESTDIGEST").val(),"X-HTTP-Method": "MERGE","IF-MATCH": Configuration.responseJSON.d.results[0].__metadata.etag
        },
        success: function(data) {
		  console.log("item updated");
        },
        error: function(data, a, b) {
          // If the server sends back a 412 response (Precondition Failed), then we have a concurrency issue, so call the function again with the existing deferred object
          if (data.status === 412) {
			console.log("error");  
            ProjectName.Functions.GetNextSeq(itemTitle);
          }
        }
      });
	});
    },
    error: function(data) {
      console.log('API error: ' + data);
    }
  });

  // Return the deferred object to the calling code
  return deferred;

}



ProjectName.Functions.GetFormDigest = function (webUrl) {
    return $.ajax({
        url: webUrl + "/_api/contextinfo",
        method: "POST",
        headers: { "Accept": "application/json; odata=verbose" }
    });
}

$.when(ProjectName.Functions.GetNextSeq(dtToday)).then(function() {
    console.log("Done") });

I have a list with title "Item1", it has a column ""Count", everytime the page is loaded, the count is incremented.

The above is working fine to some extend, but not working perfectly fine. When I open the same page in 5 tab and refresh all the tabs at the same time, the count should get updated by 5 but that does not happen, it updates sometimes 4, 3 and even 5 times.

I am unable to figure out what is wrong.

I keep getting following error : 

403 forbidden - "The security validation for this page is invalid and might be corrupted. Please use your web browser's Back button to try your operation again"

I have also added ProjectName.Functions.GetFormDigest(webUri) function yet I am facing the issue.

Reference I used : http://sympmarc.com/2015/10/23/using-etags-in-sharepoint-rest-calls-to-manage-concurrency-control/

Please help.

Thanks in Advance, Jiniv Thakkar