What is the best way to store XHR data in a browser's cache?

I have been seeking a solution to locally cache an XHR request on my computer for future use. Whenever I visit an online shop, I often encounter a form in the order page that includes a field with XHR. After filling out this field, I have to submit the form to complete my order. Unfortunately, during times of heavy traffic on the site, these files fail to load on my system, leading me to refresh the page multiple times. Is there a way to cache this data on my computer so I can access it without encountering these loading issues again? It's worth noting that other fields of the form load perfectly fine and do not pose any problems.

javascriptjsonxmlxmlhttprequestjqxhr

Answer №1

When it comes to XHR responses, the browser cache automatically stores them based on your HTTP cache headers. To keep things simple, consider sending your response with "Cache-Control: public, max-age=0" and "Last-Modified: [your timestamp]" headers. This will prompt the browser to make conditional requests with "If-Modified-Since" headers, allowing you to respond with a "304 Not Modified" message if needed. By playing around with max-age/s-maxage and "Expires:" headers, you may even be able to serve your request directly from the browser cache without revalidation or server-roundtrip. While ETag headers can be used instead of "Last-Modified", they may not be as secure due to potential fingerprinting risks.

If you are utilizing HTTP/2 with server-pushed resources, keep in mind that cached responses are scoped to a session to prevent fingerprinting techniques.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Improving the Appearance of JSON Data on Android: Step-by-Step Guide

My Android application displays raw JSON data from an API, but I want to format it in a pretty print style like this: https://i.stack.imgur.com/hJSe3.png Instead of the current display which looks like this: https://i.stack.imgur.com/kLH9l.png Here is ...

javaandroidjsonapipretty-print

The Wordpress plugin's Ajax function is giving back a response value of zero

I'm facing an issue where I am attempting to send AJAX data to my wordpress table, but the response I receive from my PHP script is always a 0. This problem arises specifically on the admin side of things. Can anyone provide assistance? Furthermore, ...

javascriptphpjqueryajaxwordpress

How come my Bootstrap tooltip title only updates once when I use the keydown event in jQuery?

My goal is to provide users with a character count for text inputs and textareas based on a maximum limit. To achieve this, I have added tooltips to elements with a data-maxlength attribute. I update the tooltip for text inputs to display the current lengt ...

javascriptjquerytwitter-bootstrap

Python script to loop over JSON files and ignore empty files

I have a Python script that reads and converts multiple JSON files into CSV format. The majority of the files follow this structure: { "resultSet": { "totalRecords": "2", "agentLogins": [ ...

pythonjson

Guide on extracting XML data from C# and displaying it as a list on HTML using jQuery

Currently, I am retrieving XML data from a C# web API controller and struggling to display it as a list on an HTML view page. Despite trying several methods, none seem to be effective. Here is a snippet of the XML data obtained from the API. Any suggesti ...

c#jqueryajaxxmlasp.net-web-api

jquery plugin causing issues with bootstrap button functionality

Currently, I am utilizing the jQuery form plug-in to post my form in an Ajax way. The post function is functioning perfectly with the default button. However, it seems to encounter issues when I try to use a custom Bootstrap button as shown below. Could so ...

javascriptjqueryajaxtwitter-bootstrapjquery-plugins

Making a RESTful request through the use of HTTPUrlConnection

Currently, I am in the process of developing my initial Android application and am experimenting with integrating REST calls within the app. After referencing multiple resources, including various pages and posts on Stack Overflow, I have implemented the f ...

javaandroidjsonrest

Using $.ajax to fetch a JSON array from a PHP endpoint

Any assistance would be greatly appreciated if I am making a simple mistake somewhere. Associative Array data_form[name] = value; Action $.ajax({ type: "GET", cache: false, url: "../pages/ajax/takeaction.php", data: ...

phpjqueryjson

Is there a way to deactivate or dim a specific hour in an HTML time form?

I am currently facing a challenge with my booking form. I need to find a way to grey-out or disable the hours/times that have already been booked by previous customers. This will help ensure that the next person can select a different time slot. However, I ...

javascripthtmltime

Error: The dynamic selection function is experiencing an issue where it is unable to read the "map" property of an undefined

Currently, I am in the process of creating a React component that includes the usage of a select HTML input. The implementation is defined as shown below: <select className="form-control-mt-3" id="clientList" name="clientList" onChange={this.handleC ...

javascriptreactjs

Removing dropdown lists from input forms can be achieved without using jQuery by utilizing vanilla JavaScript

Looking to build a custom HTML/JavaScript terminal or shell. Interested in utilizing an input box and form to interact with JavaScript functions/commands. Unsure of how to eliminate the drop-down menu that appears after previous inputs. Pictured terminal: ...

javascriptjqueryhtml

Encountering a hydration issue in Next.js when attempting to refresh the page after switching languages (excluding English) with next-translate/useTranslation

I've encountered an issue with the useTranslation hook from the next-translate package in my Next.js project. Although all languages are being recognized, I'm facing a hydration error whenever I change the language and refresh the page. Below is ...

javascriptreactjsnext.jsserver-side-renderingnext-translate

Encountered an error while trying to set up the route due to Router.use() needing

Within my app.js file, I have the following code: app.use('/', require('./routes')); //old routes app.use('/api', require('./api')); Additionally, I have an api folder containing an index.js file. This is what the ...

javascriptnode.jsexpress

Revive the design of a website

As I work on creating my own homepage, I came across someone else's page that I really liked. I decided to download the page source and open it locally in my browser. However, I noticed that while the contents were all there, the style (frames, positi ...

javascripthtmlcss

Exploring the wonders of accessing POST request body in an Express server using TypeScript and Webpack

I am currently working on a Node and Express web server setup that utilizes Webpack, along with babel-loader and ts-loader. Let's take a look at some key portions of the code: webpack-config.js: const path = require("path"); const nodeExte ...

javascripttypescriptexpresswebpackbabeljs

Revamp your code by utilizing ES6 class to replace multiple if statements in Javascript

Currently, my code is filled with numerous if statements and I am considering a switch to classes in ES6. However, Javascript isn't my strong suit... so PLEASE HELP ME..! Previous code: //example code function first(){ console.log('first sce ...

javascriptnode.jsoopif-statementdesign-patterns

Align a collection of images in a grid format on the center of the page with

I am trying to center a div that contains multiple 145px X 145px thumbnail images without setting a fixed width. The goal is to have as many images in each row as the browser window can fit. However, I want to keep the images left-aligned within the center ...

javascripthtmlcssdynamiccenter

Using jQuery to fill out a form using data from a JSON

I'm struggling with understanding jQuery... I want to populate a form inside a jQueryUI dialog box. Although I can retrieve the JSON data successfully, I am having difficulty referencing the data and setting the values in the form fields... Below are ...

jqueryjsonforms

Code snippet in webpage body

Hey there, I could really use some assistance: I currently have the following: A) Login.html B) Documentation.html C) Base.html Within the login page, there is a form with fields for User and Password. In Documentation, there are links to various folder ...

javascripthtmlcssinclude

The setInterval() function within a jQuery dialog continues running even after being destroyed or removed

I'm facing an issue with a jQuery dialog that loads an external page and runs a setInterval() function querying the server continuously every second via AJAX. The problem arises when I close the dialog, as the setInterval keeps running. Below is the ...

javascriptjqueryajaxjquery-ui