静的コンテンツとAJAXページコンテンツの両方を配信する最良の方法は何ですか？

非JS対応ページとJS対応ページの両方のWebページを開発するためのベストプラクティスは何ですか？私はJSP/JSTLをビュー技術として使用してSpring MVC Webアプリケーションを開発しています。静的コンテンツとAJAXページコンテンツの両方を配信する最良の方法は何ですか？

私が働く方法は、完全なWebページ（「html」、「head」など）タグをその中に作成することです。これはすべてのブラウザで動作します。私の全アプリは、JSが無効になっている（醜いバグにもかかわらず）。

ページには、トップレベルの「divs」をタブに変換するjQueryスクリプト、ダイアログに他のdivを組み込むjQueryスクリプトなどがあります.JSは、基本となるHTMLを「ハイジャック」します。 My JSはAJAX呼び出しを使用してコンテンツを正しいダイアログまたはタブdivにロードするリンクとボタンをハイジャックします。

これはすべてうまく動作し、私はアーキテクチャが好きですが、AJAXリクエストで「contentOnly」パラメータを追加するような最適化を追加しました。これは条件付きで "頭"などを無視するSpring MVCビューによって取得されます。つまり、AJAXバージョンが望む実際のコンテンツのみをレンダリングします。それはただ気難しいと感じます。

私はページ全体を読み込んで外側のビットを破棄することができますが、厳密には必要でないすべての関連するCSSとJSファイルを読み込むのは非効率的です。

私の質問は、この条件付き書式を書いた方がいいですか？VelocityやFreeMarkerやGrailsが使用しているものとは違う、別のビュー技術や何かを使っていなければなりませんか？

私の条件の例： -

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> 

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> 
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %> 

<c:if test="${param.contentOnly == null}"> 
<!DOCTYPE html> 
<html> 
<head> 
    <%@ include file="_stylesAndScripts.jsp"%> 
    <title>My App Title</title> 
</head> 

<body> 
    <%@ include file="_header.jsp"%> 
    <%@ include file="_menu.jsp"%> 
</c:if> 
    <div id="leadListPanel" class="contentPanel"> 
     <h1>My App Title</h1> 
     <p>The time on the server is ${serverTime}.</p> 

     <table id="leadTable" class="list"> 
        ... rest of content... 

<c:if test="${param.contentOnly == null}"> 

    <%@ include file="_footer.jsp"%> 
</body> 
</html> 
</c:if>

出典

2011-07-18 David Kerr

他の方法でファイルを含める必要があります。

/WEB-INF/template.jsp

<!DOCTYPE html> 
<html> 
    <head> 
     <%@ include file="_stylesAndScripts.jsp"%> 
     <title>My App Title</title> 
    </head> 
    <body> 
     <%@ include file="_header.jsp"%> 
     <%@ include file="_menu.jsp"%> 
     <jsp:include page="${page}.jsp" /> 
     <%@ include file="_footer.jsp"%> 
    </body> 
</html>

leads.jsp

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> 
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %> 
<div id="leadListPanel" class="contentPanel"> 
    <h1>My App Title</h1> 
    <p>The time on the server is ${serverTime}.</p> 

    <table id="leadTable" class="list"> 
       ... rest of content...

および特定の要求URLに基づいleads${page}などの変数を設定し、その代わりtemplate.jspに転送コントローラを作成します。私は春をしないので、春でそれを達成する方法を詳細には答えられません。

@WebServlet(urlPatterns={"/pages/*"}) 
public class TemplateServlet extends HttpServlet { 

    @Override 
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
     String page = request.getPathInfo(); 
     // .. Do some other preprocessing if necessary .. and then: 
     request.setAttribute("page", page); 
     request.getRequestDispatcher("/WEB-INF/template.jsp").forward(request, response); 
    } 

}

が含まleads.jspに表示されるテンプレートを取得するhttp://example.com/contextname/pages/leadsとして、それを起動します。しかし、次の基本的なJSP /サーブレットのキックオフの例は、一般的なアイデアを与える必要があります。最後に、http://example.com/contextname/leads.jspを単独で呼び出して、単独のテンプレートコンテンツを取得することができます。

出典

2011-07-21 16:24:14 BalusC

ありがとうございます。私はSiteMeshのようなものがこれを助けるかもしれないかどうか疑問に思います。 –

私はFreemarkerのに数年前のアプローチのようなものを使用していると私はそれを行うには良い方法を知りません。

これらの条件に合わせてJSPタグを作成して、見た目がよく見えるようにして実際の実装を隠すことができます。このようなもの：

<t:NonAjax> 
    <!DOCTYPE html> 
    <html> 
    <head> 
    <%@ include file="_stylesAndScripts.jsp"%> 
    <title>My App Title</title> 
    </head> 
    <body> 
    <%@ include file="_header.jsp"%> 
    <%@ include file="_menu.jsp"%> 
</t:NonAjax> 
<div id="leadListPanel" class="contentPanel"> 
    <h1>My App Title</h1> 
    <p>The time on the server is ${serverTime}.</p> 

    <table id="leadTable" class="list"> 
       ... rest of content... 

<t:NonAjax> 
    <%@ include file="_footer.jsp"%> 
    </body> 
    </html> 
</t:NonAjax>

出典

2011-07-20 10:43:27

静的コンテンツとAJAXページコンテンツの両方を配信する最良の方法は何ですか？

答えて

関連する問題