详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)

    前几天,我在自学web开发部署的过程中遇到了很多坑。比如新版的JDK lib文件夹(我的版本是16)里面没有ext文件,甚至连rt.jar,tools.jar也没有,这让原本用记事本进行部署的我无法servlet.jar包添加进来。于是我就开始使用eclipse进行开发部署,看了其它人的使用教程,又发现自己的eclipse 所生成的web文件夹结构和他们都不一样(因为我下的都是最新版的)。于是摸索了两天后,总结了在JDK,tomcat,eclipse都是最新版下的web应用部署步骤(图片与文字结合论述)☞☞☞☞☞☞☞☞☞☞☞☞
<1>打开安装的最新版eclipse,点击上方工具栏里的File,选择new选项,在弹出的选项中选择Dynamic Web Project后,出现如图窗口☞

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第1张图片

<2>如图☞

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第2张图片

 <3>如图☞

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第3张图片

 <4>经过如上步骤,就能得到一个web应用文件目录结构☞

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第4张图片

    接下来我们来分析一个问题,新版的JDK lib文件下是没有ext文件的,这对于给JDK添加扩展包带来了很大的困难(因为无法再像以前那样把需要扩展的包移入ext文件夹中就可以实现扩展)比如我现在需要用servlet进行一个web开发,JDK中是没有servlet对应包的,那我如何添加呢?毫无疑问我可以用eclipse进行添加(这对于还在用记事本工具开发的小伙伴来说很不友好).添加步骤如下

<1>在你的项目下随便建立一个新的文件,用于存放servlet.jar包(此包在你所安装的tomcat lib文件夹里面,把它复制到这个新文件夹里面就行)如图所示☞

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第5张图片

 <2>然后右键你的项目名,选择Build Path选项,再选择Configure Build Path 之后会出现如图窗口

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第6张图片

 <3>选择Libraries选项 鼠标单机一下ClassPath  右边的Add Jars键亮了后,点击它后 会出现如图窗口

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第7张图片

 <4>然后打开你的项目文件 发现里面有你刚刚复制进来的servlet.jar,然后点击它并选择OK,最后选择Apply and Close(应用并关闭的意思)

最后返回你的web项目文件夹里面  你会发现多了一个Referenced Libraries 文件夹 里面存放了你刚刚添加的servlet.jar包。这样你就可以在Java代码里面通过关键词import导入servlet相关包了。

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第8张图片

 以后添加扩展包都可以按这种操作。

这些工作做完之后就可以开始web部署了,我的部署图如图所示☞

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第9张图片

 部署完web文件后,如果想要使它运行起来,我们需要一个web容器,也就是需要一个服务器(比如Tomcat).下面来教如何在eclipse里面配置Tomcat

<1>选择Window选项里面的preferences(偏好设置)选项

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第10张图片

 <2>点击Add后会出现如图画面☞

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第11张图片

 在Apache中选择你安装的tomcat版本,然后点击finish,至此服务器配置完毕。

配置完Tomcat后,在主页面找到servers选项,如图所示☞

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第12张图片

 

按图操作后会有☞

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第13张图片

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第14张图片

 返回主界面☞

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第15张图片

 会弹出如图窗口☞

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第16张图片

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第17张图片

 

意思就是 ecilpse会把你的web应用映射到tomcat  webapps这个文件夹里面
最后就可以右键 选择start 启动服务器让自己的web应用跑起来了
 

详细的web开发部署步骤(在新版配置环境下的自我总结)&(内附精美五子棋游戏代码)_第18张图片

至此,所有手续办完了,让大家看看我web应用运行的结果吧☞ 

代码如下☞

(chessgame.java部分)
package lee;
import java.io.PrintWriter;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/chessgame")
public class chessgame extends HttpServlet {
	private static final long serialVersionUID = 1L;
    public chessgame() {
        super();
        // TODO Auto-generated constructor stub
    }
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		request.setCharacterEncoding("gb2312");
		String cipher=request.getParameter("playerword");
		if(cipher.equals("520"))
		{request.getRequestDispatcher("/WEB-INF/game.html").forward(request, response);}
		else {response.setContentType("text/html;charset=gb2312");
			response.getWriter().println("\r\n"
					+ "\r\n"
					+ "\r\n"
					+ "\r\n"
					+ "错误登录\r\n"
					+ "\r\n"
					+ "\r\n"
					+ "\r\n"
					+ "\r\n"
					+ "");}
	}
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		doGet(request, response);
	}

}
(game.html部分)






不支持






(简单的登录界面部分)




登录界面



请输入玩家姓名:
请输入权限密码:

完结,散花~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

你可能感兴趣的:(javascript,java,eclipse,html5,css)