在我的 Web 应用程序中，我向 url /navigate.php 发送了一个 POST 请求。它按应有的方式工作。

问题是，这个 Web 应用程序应该也可以离线工作。我将在由于连接问题无法完成请求时显示通知，当问题解决后用户可以再次同步。

当我出于调试目的断开互联网连接时，我发现每次请求仍然返回 200 状态代码。

我错了，POST 请求不应该被浏览器缓存吗？

在 Stack Overflow 上搜索后，我尝试了这里写的解决方案。

我在 url 中附加了一个缓存 bust (new Date().getTime())，但没有任何变化。请求仍然以 200 返回。

我尝试从服务器 (PHP/Ubuntu) 发送以下 header :

header("Expires: Sat, 01 Jan 2005 00:00:00 GMT");
header("Last-Modified: ".gmdate( "D, d M Y H:i:s")."GMT");
header("Cache-Control: no-cache, no-store");
header("Pragma: no-cache");

我没有将 jQuery 用于 AJAX(因为我只需要将它用于 AJAX，没有别的)，否则我会使用它的 cache 选项，并将其设置为 假。但我猜它做的是同样的事情，将缓存中断附加到 url。

我正在使用以下代码发送请求:

define([],function(){

var a=[

    function(){return new XMLHttpRequest()},
    function(){return new ActiveXObject("Msxml2.XMLHTTP")},
    function(){return new ActiveXObject("Msxml3.XMLHTTP")},
    function(){return new ActiveXObject("Microsoft.XMLHTTP")}

];

    var o=function(){

        var r=false;

        for(var i=0;i<a.length;i++) {

            try{

                r=a[i]();

            } catch(e) {

                continue;

            }

            break;

        }

        return r;

    };

    var verifyParam = function(param) {
        if(typeof param === "undefined" || param === null) {
            return false;
        } else {
            return true;
        }
    };

    var checkParam = function(param,defaultValue) {
        if(!verifyParam(param)) {
            return defaultValue;
        } else {
            return param;
        }
    };

    var generateCacheBust = function() {
        return (new Date().getTime());
    };

    var request = function(url,method,dataInPost,initCallback,callback,error) {

        var req = o();

        if(!req) return false;

        initCallback = checkParam(initCallback,function(){});

        callback = checkParam(callback,function(){});

        error = checkParam(error,function(){});

        initCallback(req);

        req.open(method,url,true);

        if(dataInPost) {

            req.setRequestHeader('Content-type','application/x-www-form-urlencoded');

        }

        req.onreadystatechange = function() {

            if(req.readyState!=4) {

                return;

            }

            try {

                if(req.status!=200 && req.status!=304) {

                    error(req.status);

                    return;

                } else {

                    callback(req);

                }

            } catch (e) {

                error(req.status);

                return;

            }

        }

        if(req.readyState == 4) return;

        try {

            req.send(dataInPost);

        } catch (e) {

            error(req.status);

            return;

        }

    };

    var dataToString = function(data) {

        var string = '';

        for(var key in data) {

            string += (encodeURIComponent(key)+'='+encodeURIComponent(data[key])+'&');

        }

        return string.substring(0,string.length-1);

    }

    var formattedResponse = function(req,type) {

        var responseData = req.responseText;

        if(type=="json") {

            return JSON.parse(responseData);

        } else {

            return responseData;

        }

    }

    var get = function(params) {

        if(!verifyParam(params.url)) { return false; }

        params.data = checkParam(params.data,{});

        params.responseType = checkParam(params.responseType,'text');

        params.init = checkParam(params.init,function(){});

        params.success = checkParam(params.success,function(){});

        params.error = checkParam(params.error,function(){});

        params.cache = checkParam(params.cache,true);

        if(!params.cache) {params.data.cacheBust = generateCacheBust();}

        request(params.url+'?'+dataToString(params.data),"GET",false,params.init,function(req){

            params.success(formattedResponse(req,params.responseType));

        },params.error);

    };

    var post = function(params) {

        if(!verifyParam(params.url)) { return false; }

        params.data = checkParam(params.data,{});

        params.responseType = checkParam(params.responseType,'text');

        params.init = checkParam(params.init,function(){});

        params.success = checkParam(params.success,function(){});

        params.error = checkParam(params.error,function(){});

        params.cache = checkParam(params.cache,true);

        if(!params.cache) {params.url += "?" + "cacheBust=" + generateCacheBust();}

        request(params.url,"POST",dataToString(params.data),params.init,function(req){

            params.success(formattedResponse(req,params.responseType));

        },params.error);

    };

    return {

        get:get,

        post:post

    };

});

在网络日志 (Firefox) 上，这里是 firebug 显示的 header

请求 header :

POST /explorer/ajax/navigate.php?cacheBust=1412147821832 HTTP/1.1
Host: genortal.com
User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:31.0) Gecko/20100101 Firefox/31.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Referer: http://genortal.com/dashboard.php
Content-Length: 12
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache

响应头:

HTTP/1.1 200 OK
Date: Wed, 01 Oct 2014 07:17:01 GMT
Server: Apache/2.4.7 (Ubuntu)
X-Powered-By: PHP/5.5.9-1ubuntu4.3
Expires: Sat, 01 Jan 2005 00:00:00 GMT
Cache-Control: no-cache, no-store
Pragma: no-cache
Last-Modified: Wed, 01 Oct 2014 07:17:02GMT
Content-Length: 744
Keep-Alive: timeout=5, max=79
Connection: Keep-Alive
Content-Type: application/json

这是我断开互联网连接后得到的标题:

请求 header :

POST /explorer/ajax/navigate.php?cacheBust=1412148166275 HTTP/1.1
Host: genortal.com
Connection: keep-alive
Content-Length: 12
Cache-Control: no-cache
Pragma: no-cache
Origin: http://genortal.com
User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/36.0.1985.125 Safari/537.36
Content-type: application/x-www-form-urlencoded
Accept: */*
Referer: http://genortal.com/dashboard.php
Accept-Encoding: gzip,deflate,sdch
Accept-Language: en-US,en;q=0.8

响应头:

HTTP/1.1 200 OK
Date: Wed, 01 Oct 2014 07:22:46 GMT
Server: Apache/2.4.7 (Ubuntu)
X-Powered-By: PHP/5.5.9-1ubuntu4.3
Expires: Sat, 01 Jan 2005 00:00:00 GMT
Cache-Control: no-cache, no-store
Pragma: no-cache
Last-Modified: Wed, 01 Oct 2014 07:22:47GMT
Content-Length: 117
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: application/json

服务器端代码:

<?php
/**
 * Generation Portal
 * Date: 24/9/14
 * Time: 8:59 PM
 */

require_once '../../start_session.php';
require_once '../../libload.php';

use GenerationPortal\Genortal\Accounts\Session;
use GenerationPortal\Genortal\RequestIn;
use GenerationPortal\Genortal\ErrorDictionary\AjaxErrors;
use GenerationPortal\Genortal\AjaxHandler;
use GenerationPortal\Genortal\Explorer\Navigator;
use GenerationPortal\Genortal\Storage\DatabaseLayer;
use GenerationPortal\Genortal\FileSystem\FileSystem;

header("Expires: Sat, 01 Jan 2005 00:00:00 GMT");
header("Last-Modified: ".gmdate( "D, d M Y H:i:s")."GMT");
header("Cache-Control: no-cache, no-store");
header("Pragma: no-cache");

$requestIn = new RequestIn();

$ajaxHandler = new AjaxHandler();

if(!Session::loggedIn()) {

    $ajaxHandler->error('not_signed_in',AjaxErrors::desc('not_signed_in'));

}

if(!$requestIn->paramSet('path')) {

    $ajaxHandler->error('missing_parameters',AjaxErrors::desc('missing_parameters'));

}

$navigator = new Navigator();

try {

    $databaseLayer = new DatabaseLayer();

    $fileSystem = new FileSystem(Session::uid(),$requestIn->param('path'),$databaseLayer);

} catch (\Exception $e) {

    $ajaxHandler->error('server_error',AjaxErrors::desc('server_error'));

}

$ajaxHandler->respond($navigator->parseDirectoryListing($fileSystem));

任何人都可以就这里发生的事情提供快速帮助吗？这是HTTP缓存的作用吗？

最佳答案

您应该为此目的尝试使用缓存无效化。我的意思是传递一个额外的参数，它是可变的，你的 URL 是这样的

www.mydomain.com/navigate.php; //url without cache bust parameter
myRand=parseInt(Math.random()*99999999); 
www.mydomain.com/navigate.php?rand=54321 //url with cache bust parameter

因此在上面的缓存中，您的服务器会将其理解为新请求。

关于javascript - AJAX POST 请求被缓存，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26135860/