一千萬個為什麽

搜索

如何在基於ajax的網站和基本的HTML網站之間輕松切換?

我有一個網站(基於JSP/Servlets,使用MVC模式),我想支持基於AJAX的網站和基於HTML的基本網站。網站訪問者應該能夠將沖浪模式從Ajax更改為基本HTML,反之亦然,因為它適用於Google郵件。

問題:

  • 輕松實現這一目標的最佳方法是什麽?
  • 我應該為每個頁面設計兩個視圖嗎?

我使用JQuery和JSON作為這個結果答案

最佳答案

您需要不引人註目的Javascript ,它是漸進增強

首先,開始創建一個功能齊全的 webapplication ,不用任何一行Javascript。一旦你開始工作,然後開始編寫Javascript代碼,它“接管”原始HTML工作,而不用更改任何HTML/CSS行。在服務器端代碼中,您需要添加邏輯,該邏輯識別請求是否已被JavaScript觸發並相應地返回響應。您可以通過在webbrowser中啟用/禁用JavaScript來測試這兩種情況。在Firefox中,使用 Web Developer Toolbar 可以輕松實現。

例如,您有一個郵件列表,其中包含應顯示郵件正文的所有HTML鏈接:

Message title

如果沒有JavaScript,這將向servlet發出HTTP請求,該請求加載由 1 標識的郵件,將請求轉發到JSP,該JSP在視圖中隱藏消息列表並在視圖中顯示郵件。

使用JavaScript/jQuery,您需要編寫在Ajax的幫助下完全相同的代碼,例如:

$('a.show').click(function() {
    $.getJSON(this.href, callbackFunctionWhichHidesListAndShowsMail);
    return false;
});

在服務器端,您必須區分正常請求和ajax請求,以便您可以相應地返回響應。

boolean ajax = "XMLHttpRequest".equals(request.getHeader("x-requested-with"));

// ...

if (ajax) {
    writeJson(response, mail);
} else {
    request.setAttribute("mail", mail);
    request.getRequestDispatcher("/WEB-INF/mail.jsp").forward(request, response);
}

Finally, to give the user an option to switch between the modes manually, you have to set a cookie or preferably (since cookies are disableable) pass some information in URL (pathinfo or request parameter) which forces the server to disable emitting the <script> lines.

轉載註明原文: 如何在基於ajax的網站和基本的HTML網站之間輕松切換?