服務器發送響應但客戶端未加載發送的內容

Question

我有簡單的節點服務器（nodejs + express + ejs呈現） ，當用戶嘗試加載特定的頁面服務器時，發送該編譯的html並發送該響應。

為了跟蹤用戶，我添加了2個計數器

一個。 計數器，當服務器收到該頁面的請求時遞增

灣 當客戶端加載頁面時，它包含一些代碼，這些代碼會將HTTP請求返回到我用作計數器的服務器

現在問題是隨着時間的推移， sentResponse計數器和clientLoad計數器之間的差異增加了很多，所以我得到sentResponse = 7000和clientLoad = 3600 。

關於什么可能導致這種行為的任何建議

注意：在請求到達我的服務器之前我也設置了Cloudfare並且我暫停了它但是我仍然遇到了巨大的差異？

注意：我也注意到很多用戶經常在4s以下多次向頁面發出請求，但我確信我發送的是有效的html而且我的差異幾乎是50％所以我不認為每個訪問該頁面的用戶都是在4s下按ctrl + r 2次或更多次。

碼：

server.js

app.get('/dashboard', (res, res) => {
    ...
    ...
    ...

    Tracker.incrementCount('sentResponse');
    res.render(page.ejs, {...});
});

app.get('/client-load-start', (req, res) => {
    Tracker.incrementCount('clientLoadStart');
    res.send(200);
});

page.ejs

<html>
    <head>
        ...
        <script src='/client-load-start?version=<some_random_4_digit_number>'></script>
        ...
    </head>

    <body>
        ...
        ...
    </body>
</html>

Answer 1

我可以想到為什么計數可能不同的以下可能性。

設置緩存標頭（Cache-Control）可能會導致瀏覽器緩存請求。
JS沒有在客戶端的瀏覽器中啟用，因此不可能對服務器進行AJAX調用來更新clientLoad計數器（這是不太可能的，但仍然是可能的一種）。
人們甚至在加載頁面之前就與頁面進行了交互，導致AJAX調用無法觸發。 人們在頁面加載之前重新加載頁面。

如果你只是想跟蹤

頁面點擊，您可以使用“sentResponse”計數器。
活躍用戶，考慮網絡套接字（計算我網頁的點擊次數）

Answer 2

您可以嘗試使用緩存清除方法。 每次瀏覽器加載/dashboard ，瀏覽器都會獲得/client-load-start路由的腳本源。 問題是唯一的時間/client-load-start是在清除瀏覽器的緩存時，還是第一次加載站點時。 這將導致兩個計數隨時間變化很大的問題。

嘗試讓瀏覽器認為/client-load-start是一個需要下載的新腳本。 您可以通過向src添加查詢參數來完成此操作。

<script src='/client-load-start?<%- Date.now()%>=1'></script>

每次瀏覽器轉到/dashboard它都會嘗試下載新腳本，因為查詢參數已更改，從而破壞了緩存。

Answer 3

事件順序

瀏覽器請求/dashboard
服務器增加sentResponse ，顯示並發送page.ejs到瀏覽器
瀏覽器接收page.ejs並檢測<script>標記
瀏覽器檢查腳本URL是否在瀏覽器緩存中
- 如果在緩存中找到腳本URL，則序列在此結束; clientLoad保持不變
瀏覽器從您的服務器請求腳本
服務器執行get請求，增加clientLoad

問題

這里的“問題”是瀏覽器 - 或瀏覽器與服務器之間的任何代理 - 將緩存返回的腳本，除非您另外指示它。

請注意，在大多數情況下，緩存實際上是預期的和預期的行為。 這也是瀏覽器的默認行為。

解

要指示瀏覽器（或多個代理）避免緩存文件，您可以設置緩存控制標頭。

app.get('/client-load-start', (req, res) => {
    Tracker.incrementCount('clientLoadStart');
    res
       .set('cache-control', 'max-age=0; private; no-cache')
       .send(200);
});

這將指示瀏覽器永遠不會緩存請求並始終獲取新副本，從而在每次請求時增加clientLoadStart 。

另一種方法是“ 緩存清除 ”，這意味着您有意更改腳本的URL，例如通過附加上面的隨機數，從而“破壞”緩存鍵。

服務器發送響應但客戶端未加載發送的內容

問題描述

3 個解決方案

解決方案1
1 2018-10-12 20:12:57

解決方案2
1 2018-10-16 01:08:28

解決方案3
0 2018-10-18 11:49:55

事件順序

問題

解

服務器發送響應但客戶端未加載發送的內容

問題描述

3 個解決方案

解決方案1 1 2018-10-12 20:12:57

解決方案2 1 2018-10-16 01:08:28

解決方案3 0 2018-10-18 11:49:55

事件順序

問題

解

解決方案1
1 2018-10-12 20:12:57

解決方案2
1 2018-10-16 01:08:28

解決方案3
0 2018-10-18 11:49:55