Solution of browser cache problem in AJAX

Time:2021-9-21

Each time you clear the cache, you will get a new data, so in the final analysis, it is the browser cache problem. Tangled for a long time, and finally resolved, here to sum up.

We all know that Ajax can improve the speed of page loading. The main reason is to reduce the loading of duplicate data through Ajax, that is, cache the data into memory while loading the data. Once the data is loaded, as long as we do not refresh the page, the data will always be cached in memory. When the URL we submit is consistent with the historical URL, You don’t need to submit to the server, that is, you don’t need to get data from the server. Although this reduces the load of the server and improves the user experience, we can’t get the latest data. In order to ensure that the information we read is up-to-date, we need to disable its caching function.

There are several solutions:

1. Add anyajaxobj.setrequestheader (“if modified since”, “0”) before Ajax sends the request.

2. Add anyajaxobj. Setrequestheader (“cache control”, “no cache”) before Ajax sends the request.

3. Add a random number after the URL: “fresh =” + Math. Random();.

4. Add time after the URL: “nowtime =” + new date(). Gettime();.

5. If you use jQuery, you can do it directly $. Ajaxsetup ({cache: false}). In this way, all Ajax on the page will execute this statement, that is, there is no need to save cache records.

Recommended Today

The selector returned by ngrx store createselector performs one-step debugging of fetching logic

Test source code: import { Component } from ‘@angular/core’; import { createSelector } from ‘@ngrx/store’; export interface State { counter1: number; counter2: number; } export const selectCounter1 = (state: State) => state.counter1; export const selectCounter2 = (state: State) => state.counter2; export const selectTotal = createSelector( selectCounter1, selectCounter2, (counter1, counter2) => counter1 + counter2 ); // […]