用于Java中的Web应用程序编程的不同技术如何协同工作？ [英] How do the different technologies used for programming webapplications in Java work together?

查看：148
本文介绍了用于Java中的Web应用程序编程的不同技术如何协同工作？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我想使用Java开发Web应用程序。但我很困惑所有这些不同的技术以及它们如何协同工作：

I want to develop a webapplication using Java. But I am quite confused what all these different technologies are and how they work together:


  • HTTP

  • HTML

  • CSS

  • Javascript

  • jQuery

  • Web容器

  • Servlets

  • JSP

  • JSTL

  • 表达语言（EL）

  • HTTP
  • HTML
  • CSS
  • Javascript
  • jQuery
  • Web Container
  • Servlets
  • JSP
  • JSTL
  • Expression Language (EL)

网上有大量关于这些主题的资源，每一个都看起来像你需要阅读几本书才能理解它们。您是否可以解释这些技术，以便在开始开发Web应用程序时对它们有基本的了解？

There is a huge amount of resources which can be found on the web regarding these topics, and each of them looks like you need to read several books to understand them. Can you explain these technologies so that I have a basic understanding of them when starting to develop a webapplication?

推荐答案

注意目标这种解释是为了给出一般性的理解，而不是检查每个主题的所有细节。有经验的用户肯定会发现看起来过于笼统的点，但不要让新用户感到困惑。每个主题都提供了进一步阅读的链接。

Note that the goal of this explanation is to give a general understanding, not to examine all the details of each topic. Experienced users will surely find points which seem to be "too general", but let's don't confuse new users. Links for further reading are provided in each topic.

让我们从基础知识开始。您需要知道网页如何进入您的计算机才能理解以下所有技术。

Let's start with the fundamental basics. You need to know how a webpage comes to your computer in order to understand all the following technologies.

HTTP代表 超文本传输​​协议 。它描述了浏览器如何与Web服务器通信以检索其内容（网页）。网页存储在服务器上，浏览器需要一种方法来告诉服务器它想要获得哪个网页。另一方面，服务器需要告诉浏览器是否找到了所请求的资源，并将此信息发送给浏览器。

HTTP stands for Hyper Text Transfer Protocol. It describes how the browser communicates with the webservers in order to retrieve their content (webpages). Webpages are stored on servers, and the browser needs a way to tell a server which webpage it would like to get. The server, on the other hand, needs to tell the browser if the requested resource was found or not and send this information to the browser.


  1. 浏览器向服务器发送请求。该请求包含以下几个部分：


    • 网址，例如： https://stackoverflow.com/questions/ask ，以便服务器知道要传送的页面。

    • HTTP方法。最常见的是获取，这表示浏览器想要检索信息（例如单个页面或网络搜索），发布，这表明浏览器推送了一些信息到网络服务器，就像一个论坛帖子。帖子通常会更改服务器上的内容（例如论坛中的新帖子），而get则不会。

    • 请求正文，其中可以包含例如文本框的文本，图像到上传，等等。

  1. The browser sends a request to the server. The request consists of several parts:
    • The URL, e.g. "https://stackoverflow.com/questions/ask", so the server knows which page to deliver.
    • The HTTP method. Most common are get, which indicates that the browser wants to retrieve information (e.g. a single page, or a websearch), and post, which indicates that the browser pushes some information to the webserver, like a forum post. Post usually changes something on the server (like the new post in a forum), while get does not.
    • Request body, which can contain for example the text of a textbox, an image to be uploaded, etc.

  • HTTP状态代码。这是一个三位数字，显示请求的结果。最常见的是OK（2xx），REDIRECTION（3xx），CLIENT ERROR（4xx）和SERVER ERROR（5xx）。重定向状态代码是将浏览器重定向到另一个页面的最佳方式。

  • 响应正文，其中包含网页（如果有）。

  • A HTTP status code. This is a three-digit-number which shows the result of the request. Most common are OK (2xx), REDIRECTION (3xx), CLIENT ERROR (4xx) and SERVER ERROR (5xx). Redirection status codes are the best way to redirect the browser to another page.
  • Response body, this contains the webpage (if any).



HTML



HTML代表 超文本标记语言 并显示内容。 HTML文本从服务器发送到客户端（即浏览器），并由浏览器呈现以将其显示给用户。示例HTML：

HTML

HTML stands for Hyper Text Markup Language and presents the content. HTML text is sent from the server to the client (which is, the browser) and is rendered by the browser to display it to the user. Example HTML:

<!DOCTYPE HTML>
<html>
    <head>
        <title>My first webpage</title>
    </head>
    <body>
        <p>Hello World!</p>
    </body>
</html>

由于HTML多年来有所改善，因此第一个重要每个HTML页面的行包含 DOCTYPE 声明。它会告诉浏览器应该如何呈现不同的标记（例如< p> ）。渲染过程由浏览器完成。由本地计算机上的浏览器完成的所有操作都称为客户端。记住那个词！

Since HTML has improved over the years, it is important that the first line of each HTML page contains the DOCTYPE declaration. It tells the browser how the different tags (like <p>) should be rendered. The rendering process is done by the browser. Everything, that is done by the browser on the local computer, is called client-side. Remember that term!

表示 层叠样式表 。这会将样式添加到网页中，例如颜色，字体大小，元素位置等.CSS定义通常保存在单独的文件中以提高可维护性。样式的渲染也是客户端。

Means Cascading Style Sheets. This adds style to a webpage, like colors, font sizes, positions of elements, etc. CSS definitions are often kept in separate files to improve maintainability. Rendering of styles is also done client-side.

不，这与Java无关。重复：没有。这是一个执行的完全不同的编程语言通过客户端上的浏览器。使用 JavaScript ，您可以将编程逻辑添加到您的网页中并执行操作类似于：

No, this has nothing to do with Java. Repeat: nothing. It is a totally different programming language that is executed by the browser on client-side. With JavaScript, you can include programming logic to your webpage and do things like:


  • 验证用户输入

  • 精美幻灯片

  • 甚至编程游戏！

你需要知道可以在浏览器中关闭JavaScript，然后没有JavaScript代码将被执行。所以你不应该依赖于你的web应用程序的JavaScript可用性（除了你必须，比如游戏）。 JavaScript可能被滥用于重定向（您应该使用HTTP状态代码）或元素样式（使用CSS）。因此，在使用Javascript做某事之前，请检查是否可能以其他方式。 只使用HTML和CSS即可实现下拉菜单！

You need to be aware of that JavaScript can be turned off in the browser, and then no JavaScript code will be executed. So you should not rely on the availability of JavaScript for your webapplication (except you have to, like for a game). JavaScript can be abused for things like redirection (where you should use HTTP status codes) or styling of elements (use CSS for that). So before doing something with Javascript, check if it is possible somehow else. Even dropdown menus are possible with only HTML and CSS!

jQuery 只不过是用JavaScript编写的库。当您想要使JavaScript跨浏览器兼容时，它会变得很方便，因为不同的浏览器在JavaScript实现中有一些细微差别。它也适用于选择页面的某些元素，效果等。它仍然是JavaScript，所以它在客户端上运行。

jQuery is nothing else than a library written in JavaScript. It becomes handy when you want to make your JavaScript cross-browser compatible, because different browsers have some minor differences in their JavaScript implementations. It is also useful for selecting certain elements of a page, effects, etc. It is still JavaScript, so it runs on client-side.

这是一个位于您的服务器上并在服务器端<上运行的软件/ strong>即可。您的网络应用程序通常放在网络容器中。它是客户端请求和Web应用程序之间的接口，并且可以使编程Web应用程序更加舒适。例如， Apache Tomcat 是一个Web容器。

This is a software which is located on your server and runs on server-side. Your webapplications are usually placed in a web container. It is the interface between client requests and your webapplication and does several things to make programming webapplications more comfortable. For example, Apache Tomcat is a web container.

现在我们进入Java世界。 Servlets 是您的Web应用程序的一部分，它位于Web容器内的服务器上，它们运行在服务器侧即可。 Servlet是Java类，用于处理来自客户端的请求并发回响应。典型的HTTP Servlet如下所示：

Now we get to the Java world. Servlets are part of your webapplication which is located on a server inside a web container, they run on server-side. Servlets are Java classes which process the request from the client and send back a response. A typical HTTP Servlet looks like this:

public class HelloWorld extends HttpServlet {
    public void doGet(HttpServletRequest request,
                      HttpServletResponse response)
                      throws ServletException, IOException {
        PrintWriter out = response.getWriter();
        out.println("<!DOCTYPE HTML>");
        out.println("<html>");
        out.println("<head>");
        out.println("<title>Hi</title>");
        out.println("</head>");
        out.println("<body>");
        out.println("<p>Hello World!</p>");
        out.println("</body>");
        out.println("</html>");
    }
}

HttpServlet 类有几个 doXxx 方法，每个HTTP方法一个，可由开发人员覆盖。这里，重写 doGet ，这意味着当向此servlet发送GET请求时将执行此代码。此方法将请求和响应作为参数获取， HttpServletRequest 和 HttpServletResponse 。

HttpServlet classes have several doXxx methods, one for each HTTP method, which can be overridden by the developer. Here, doGet is overridden, which means that this code is executed when a GET request is sent to this servlet. This method gets the request and response as parameters, HttpServletRequest and HttpServletResponse.

要通过URL访问此Servlet，请 web.xml 必须配置：

To make this Servlet accessible via a URL, the web.xml has to be configured:

<servlet>
    <servlet-name>HelloWorld</servlet-name>
    <servlet-class>com.example.HelloWorld</servlet-class>
</servlet>
<servlet-mapping>
    <servlet-name>HelloWorld</servlet-name>
    <url-pattern>/hello</url-pattern>
</servlet-mapping>

现在，客户端可以使用GET和 /向我们的servlet发出请求你好作为URL。例如，如果我们的网络应用程序在www.example.com上运行，则使用正确的URL将是 http://www.example.com/hello 使用GET。

Now, a client can make a request to our servlet using GET and /hello as URL. For example, if our webapplication runs on www.example.com, correct URL to be used would be http://www.example.com/hello using GET.

代表 Java Server Pages 。如您所见，使用Servlet向客户端发送响应是非常不方便的。一些聪明的家伙有这样的想法：如果我们可以将Java代码添加到HTML页面怎么办？嗯，那就是JSP：

Stands for Java Server Pages. As you have seen, using Servlets to send responses to the client is rather unhandy. Some clever guys had the idea: "What if we could just add Java code to HTML pages?" Well, and that's what JSP is:

<!DOCTYPE HTML>
<html>
    <head>
        <title>Hello JSP</title>
    </head>
    <body>
        <%
            for(int i=0; i<10; i++){
                out.print("Loop number " + i);
            }
        %>          
    </body>
</html>

事实上， JSP被转换为Java Servlet代码（由Web容器）并编译。真！这不是魔术。这意味着，它们只不过是Servlets！这是上述JSP的等效Servlet代码：

In fact, JSPs are translated to Java Servlet code (by the web container) and compiled. Really! It's no magic. That means, they are nothing else than Servlets! This is the equivalent Servlet code for the above JSP:

public class ServletAbc extends GenericServlet {
    public void service(ServletRequest req,ServletResponse res)
                        throws ServletException, IOException{
        PrintWriter out = res.getWriter();

        out.println("<!DOCTYPE HTML>");
        out.println("<html>");
        out.println("<head>");
        out.println("<title>Hello JSP</title>");
        out.println("</head>");
        out.println("<body>");
        for(int i=0; i<10; i++){
            out.print("Loop number " + i);
        }
        out.println("</body>");
        out.println("</html>");
    }
}

你看，所有的Java代码都在服务器端。

You see, all Java code is processed on server-side before the response is sent to the client.

代表 Java标准标记库 。就像名字所说，这是一个你在你之前需要包含的图书馆可以使用它。

Stands for Java Standard Tag Library. Like the name says, it is a library which you need to include before you can use it.

带有Java代码的JSP仍然不是最佳解决方案。随着页面大小的增加，降低可维护性并且难以阅读，它变得非常难以理解。那么，如果我们可以使用额外的标签来实现页面流，循环等并让Java类执行编程逻辑呢？欢迎使用标记库！

JSPs with Java code are still not the best solution. It becomes very unreadable as the size of the pages grows, reduces maintainability and is difficult to read. So, what if we could just use additional tags to implement page flow, loops etc. and let Java classes do the programming logic? Welcome using tag libraries!

有许多标记库，JSTL是基本标记库，提供核心功能。这包括if / else构造，循环等。它包含在JSP中，翻译和编译为Servlet，因此在服务器端上运行。

There are many tag libraries out there, and JSTL is the "basic" one, providing core functionality. This includes if/else constructs, loops, etc. It is included in JSPs, translated and compiled to Servlets and therefore runs on server-side.

表示 表达语言 ，用于计算表达式和访问在Java类中创建的Java对象的值。通常，您将Servlet，JSP，JSTL和表达式语言组合在一起：

Means Expression Language and is used to evaluate expressions and to access values of Java objects you have created in Java classes. Usually, you combine Servlets, JSP, JSTL and Expression language:


  • 客户端请求来自Servlet。 Servlet执行一些编程逻辑（比如从数据库中读取数据）并在请求中存储一些Java对象。之后，它将请求转发到服务器上的另一个资源，就像JSP一样。 转发 在网络应用程序内部发生并且不重定向。

  • JSP使用EL访问请求中的Java对象，显示它们并将响应发送给客户端。

  • A client request comes to a Servlet. The Servlet does some programming logic (like reading data from a Database) and stores some Java objects in the request. After that, it forwards the request to another resource on the server, like a JSP. Forwarding happens inside the webapplication and is not a redirect.
  • The JSP uses EL to access the Java objects in the request, displays them and sends the response to the client.

例如，这是您的Servlet：

For example, this is your Servlet:

public class HelloWorld extends HttpServlet {
   public void doGet(HttpServletRequest request,
                     HttpServletResponse response)
                     throws ServletException, IOException {
      // access databases, do calculations etc. here
      String hello = "Hello world!";
      String someBoolean = true;
      request.setAttribute("helloObject", hello);
      request.setAttribute("myBoolean", hello);
      RequestDispatcher dispatcher = request.getRequestDispatcher("/result.jsp);
      dispatcher.forward(request, response);
   }
}

result.jsp ：

<!DOCTYPE HTML>
<html xmlns:c="http://java.sun.com/jsp/jstl/core">
    <head>
        <title>Hello EL</title>
    </head>
    <body>
        ${helloObject}
        <c:if test="${myBoolean}">
            The expression is true.
        </c:if>
    </body>
</html>

这将输出 Hello world！表达式为true。。


  • I我认为我已经清楚地表明在服务器端运行什么以及在客户端运行什么。不要混淆它们。

  • 始终使用正确的工具来完成正确的工作。内容，CSS为布局和风格，Javascript用于客户端编程逻辑。如果你不需要它，不要依赖Javascript，有些用户关闭了它。

  • 大多数其他技术，如JSF，都是建立在现有技术之上的。了解它们的构建内容，了解它们的运行位置（客户端，服务器）以及它们应该执行的操作。

这篇关于用于Java中的Web应用程序编程的不同技术如何协同工作？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
Java开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆