作为Web开发初学者,最头疼的往往是“从0到1”的落地:环境配置怎么配?项目怎么搭?权限怎么控?今天这篇就把开发环境配置、权限安全控制、完整项目流程这三个核心点拆成步步可操作的细节,手把手带你走通Web应用开发的关键环节~

一、先搞定“地基”:Web开发环境一站式配置(JDK+Maven+IDEA)

       开发环境是项目的“地基”,这里以Windows10/11系统为例,教你把JDK、Mavenue、IDEA到“开箱即用”~


       1.JDK 1.8安装与配置(超详细版)

         JDK是Java开发的基础,选1.8是因为兼容性最强~

         步骤1:下载JDK

         1.打开Oracle官网JDK下载页(或国内镜像站,比如华为云镜像);
         2.选择“JDK8u301”(或更高效版本)的Windows x64 Installer ,点击下载;
         3.勾选同意协议,登录Oracle账号(没有的话注册一个),即可开始下载。 

         步骤2:安装JDK

         1.双击下载好的jdk-8u301-windows-x64.exe,点击“下一步”;
         2.双击“更改”,选择安装路径(必须无中文、无空格,比如          D:\Develop\Java\jdk1.8.0_301),再点“下一步”;
         3.等待安装完成(会自动安装JRE,路径建议和JDK同目D:\Develop\Java\jdk1.8.0_301);
         4.点击“关闭”完成安装。

         步骤3:配置环境变量

         1.右键“此电脑”->选择“属性”->点击“高级系统设置”->选择“环境变量”;
         2.在“系统变量”区域,点击“新建”:

            变量名:JAVA_HOME

            变量值:JDK安装路径(比如D:\Develop\Java\jdk1.8.0_301)

         3.找到“系统变量”里的Path,双击打开:

            点击“新建”,输入%JAVA_HOME%\bin;

            再点击“新建”,输入%JAVA_HOME%\jre\bin;

            点击“上移”,把这两个路径移到最上方(避免和其他版本冲突);

         4.点击“确定”,保存所有设置。

         步骤4:验证是否配置成功

         1.按下Win+R,输入打开cmd命令提示符;
         2.输入Java -version,按下回车,出现以下内容则成功
Microsoft Windows [版本 10.0.26100.7462]
(c) Microsoft Corporation。保留所有权利。

C:\Users\rootname>java -version
java version "1.8.0_301" 2025-04-15
Java(TM) SE Runtime Environment (build 1.8.0_301-b09)
Java HotSpot(TM) 64-Bit Server VM (build 1.8.0_301-b09, mixed mode, sharing)

C:\Users\rootname>

         2.Maven3.8.6安装与配置(加速依赖下载)

            Maven是Java项目的“依赖管家”,能自动下载Jar包,配置国内镜像后速度会快很多~

             步骤1:下载Maven

             1.打开Maven官网下载页;
             2.找到“Files”区域,下载 apache-maven-3.8.6-bin.zip (Windows选zip包)。

             步骤2:安装Maven(解压即可)

             1.把下载好的zip包解压到无中文、无空格的路径(比如 D:\Develop\Maven\apache- maven-3.8.6 );
             2.解压后,目录结构里会有 bin (可执行文件)、 conf (配置文件)等文件夹。

             步骤3:配置环境变量

             1. 打开“环境变量”设置(步骤同JDK);
             2.在“系统变量”区域,点击“新建”:

                变量名: MAVEN_HOME 
                变量值:Maven解压路径(比如 D:\Develop\Maven\apache-maven-3.8.6 )

             3. 编辑“系统变量”里的 Path ,新增 %MAVEN_HOME%\bin ,并上移到顶部;
             4. 点击“确定”保存。

             步骤4:配置国内镜像(阿里云)

             1. 打开Maven目录下的 conf\settings.xml (用记事本或IDEA打开);
             2. 找到 <mirrors> 标签,在里面添加阿里云镜像(替换默认镜像):
<mirrors>
  <!-- 阿里云镜像 -->
  <mirror>
    <id>aliyunmaven</id>
    <mirrorOf>central</mirrorOf>
    <url>https://maven.aliyun.com/repository/public</url>
  </mirror>
</mirrors>
              3.找到 <localRepository> 标签,取消注释并设置本地仓库路径(比如 D:\Develop\Maven\repo ),用于存放下载的依赖包:
<localRepository>D:\Develop\Maven\repo</localRepository>
              4.保存 settings.xml 文件。

              步骤5:验证Maven

              1.打开CMD,输入 mvn -v ;
              2. 出现如下内容则成功(注意Maven版本和Java版本对应):
                  
C:\Users\Rootname>mvn -v
Apache Maven 3.8.6 (84538c9988a25aec085021c365c560670ad80f63)
Maven home: D:\Develop\Maven\apache-maven-3.8.6
Java version: 1.8.0_301, vendor: Oracle Corporation, runtime: D:\Develop\Java\jre1.8.0_301

                3.IDEA 2023配置(关联JDK+Maven)

IDEA是Java开发的主流IDE,这里用2023版本为例~

                步骤1:下载并安装IDEA

                1. 打开JetBrains官网,下载“Community”(社区版,免费);
                2. 双击安装包,选择安装路径(比如 D:\Develop\IDEA\IntelliJ IDEA Community Edition 2023.2.5 );
                3. 勾选“64-bit launcher”“Add launchers dir to PATH”等选项,点击“Next”直到安装完成。

                 步骤2:关联JDK

                 1. 打开IDEA,点击“File”→“Project Structure”(或按 Ctrl+Alt+Shift+S );
                 2. 左侧选择“SDKs”,点击“+”→“Add JDK”;
                 3. 选择之前安装的JDK路径(比如 D:\Develop\Java\jdk1.8.0_301 ),点击“OK”;
                 4. 此时“Project SDK”会显示“1.8”,点击“OK”保存。


                 步骤3:关联Maven

                 1. 点击“File”→“Settings”(或按 Ctrl+Alt+S );
                 2. 左侧选择“Build, Execution, Deployment”→“Build Tools”→“Maven”;
                 3. 把“Maven home path”改为自己的Maven路径(比如 D:\Develop\Maven\apache-maven-3.8.6 );
                 4. 把“User settings file”改为Maven的 settings.xml 路径(比如 D:\Develop\Maven\apache-maven-3.8.6\conf\settings.xml );
                5. 把“Local repository”改为自己设置的本地仓库路径(比如 D:\Develop\Maven\repo );
                6. 点击“Apply”→“OK”保存。


二、项目开发的“安全锁”:SpringBoot权限控制与安全管理(Spring Security)

Web项目必须做权限控制,否则任何用户都能操作敏感接口~这里用Spring Security实现“用户-角色-权限”的基础管控,步骤拆到“复制代码就能用”~


 步骤1: 新建SpringBoot项目(提前准备)

1. 打开IDEA,点击“New Project”→选择“Spring Initializr”;

2. 填写项目信息:Group(比如 com.example )、Artifact(比如 web-security-demo )、Java版本选“8”;

3. 选择依赖:Web→Spring Web;SQL→MyBatis-Plus Framework、MySQL Driver;Security→Spring Security;

4. 选择项目路径,点击“Create”创建项目。

步骤2:数据库准备(用户表+角色表)

1.先在MySQL里建2张表: sys_user (用户表)、 sys_role (角色表),用Navicat或SQL语句创建:

CREATE TABLE `sys_user` (
  `id` bigint NOT NULL AUTO_INCREMENT COMMENT '用户ID',
  `username` varchar(20) NOT NULL COMMENT '用户名',
  `password` varchar(100) NOT NULL COMMENT '加密后的密码',
  `role_id` bigint NOT NULL COMMENT '关联角色ID',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

-- 角色表
CREATE TABLE `sys_role` (
  `id` bigint NOT NULL AUTO_INCREMENT COMMENT '角色ID',
  `role_code` varchar(20) NOT NULL COMMENT '角色编码(如ROLE_ADMIN)',
  `role_name` varchar(20) NOT NULL COMMENT '角色名称(如管理员)',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

2.插入测试数据(密码是123456,用BCrypt加密后的结果)

INSERT INTO `sys_user` VALUES (1, 'admin', '$2a$10$Z8H4k1y7t5G6F3d2S1a0b9C7v8B6n5m4l3k2j1i0h9g8f7e6d5c4b3a2', 1);
INSERT INTO `sys_user` VALUES (2, 'user', '$2a$10$Z8H4k1y7t5G6F3d2S1a0b9C7v8B6n5m4l3k2j1i0h9g8f7e6d5c4b3a2', 2);
INSERT INTO `sys_role` VALUES (1, 'ROLE_ADMIN', '管理员');
INSERT INTO `sys_role` VALUES (2, 'ROLE_USER', '普通用户');

步骤3:代码开发:实现用户认证与权限控制

(1)实体类:对应数据库表

// SysUser.java
package com.example.websecuritydemo.entity;

import lombok.Data;

@Data
public class SysUser {
    private Long id;
    private String username;
    private String password;
    private Long roleId;
}

// SysRole.java
package com.example.websecuritydemo.entity;

import lombok.Data;

@Data
public class SysRole {
    private Long id;
    private String roleCode;
    private String roleName;
}
 

(2)Mapper接口:操作数据库(MyBatis-Plus)

// SysUserMapper.java
package com.example.websecuritydemo.mapper;

import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import com.example.websecuritydemo.entity.SysUser;
import org.apache.ibatis.annotations.Select;

public interface SysUserMapper extends BaseMapper<SysUser> {
    // 根据用户名查用户
    @Select("SELECT * FROM sys_user WHERE username = #{username}")
    SysUser findByUsername(String username);
}

// SysRoleMapper.java
package com.example.websecuritydemo.mapper;

import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import com.example.websecuritydemo.entity.SysRole;
import org.apache.ibatis.annotations.Select;

public interface SysRoleMapper extends BaseMapper<SysRole> {
    // 根据用户ID查角色
    @Select("SELECT r.* FROM sys_role r JOIN sys_user u ON r.id = u.role_id WHERE u.id = #{userId}")
    SysRole findByUserId(Long userId);
}

(3)Service层:处理业务逻辑

// UserService.java
package com.example.websecuritydemo.service;

import com.example.websecuritydemo.entity.SysUser;

public interface UserService {
    // 根据用户名查用户
    SysUser findByUsername(String username);
    // 根据用户ID查角色编码
    String getRoleCodeByUserId(Long userId);
}

// UserServiceImpl.java
package com.example.websecuritydemo.service.impl;

import com.example.websecuritydemo.entity.SysRole;
import com.example.websecuritydemo.entity.SysUser;
import com.example.websecuritydemo.mapper.SysRoleMapper;
import com.example.websecuritydemo.mapper.SysUserMapper;
import com.example.websecuritydemo.service.UserService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

@Service
public class UserServiceImpl implements UserService {
    @Autowired
    private SysUserMapper sysUserMapper;
    @Autowired
    private SysRoleMapper sysRoleMapper;

    @Override
    public SysUser findByUsername(String username) {
        return sysUserMapper.findByUsername(username);
    }

    @Override
    public String getRoleCodeByUserId(Long userId) {
        SysRole role = sysRoleMapper.findByUserId(userId);
        return role.getRoleCode();
    }
}

(4)自定义UserDetailsService:实现用户认证

package com.example.websecuritydemo.security;

import com.example.websecuritydemo.entity.SysUser;
import com.example.websecuritydemo.service.UserService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.security.core.GrantedAuthority;
import org.springframework.security.core.authority.SimpleGrantedAuthority;
import org.springframework.security.core.userdetails.UserDetails;
import org.springframework.security.core.userdetails.UserDetailsService;
import org.springframework.security.core.userdetails.UsernameNotFoundException;
import org.springframework.stereotype.Component;

import java.util.ArrayList;
import java.util.Collection;

@Component
public class CustomUserDetailsService implements UserDetailsService {
    @Autowired
    private UserService userService;

    @Override
    public UserDetails loadUserByUsername(String username) throws UsernameNotFoundException {
        // 1. 根据用户名查用户
        SysUser user = userService.findByUsername(username);
        if (user == null) {
            throw new UsernameNotFoundException("用户名不存在:" + username);
        }
        // 2. 根据用户ID查角色编码
        String roleCode = userService.getRoleCodeByUserId(user.getId());
        // 3. 把角色编码转为Spring Security的权限对象
        Collection<GrantedAuthority> authorities = new ArrayList<>();
        authorities.add(new SimpleGrantedAuthority(roleCode));
        // 4. 返回UserDetails对象(包含用户名、密码、权限)
        return new org.springframework.security.core.userdetails.User(
                user.getUsername(),
                user.getPassword(),
                authorities
        );
    }
}
 

(5)Security配置类:定义权限规则

package com.example.websecuritydemo.security;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Bean;
import org.springframework.security.config.annotation.authentication.builders.AuthenticationManagerBuilder;
import org.springframework.security.config.annotation.web.builders.HttpSecurity;
import org.springframework.security.config.annotation.web.configuration.EnableWebSecurity;
import org.springframework.security.config.annotation.web.configuration.WebSecurityConfigurerAdapter;
import org.springframework.security.crypto.bcrypt.BCryptPasswordEncoder;
import org.springframework.security.crypto.password.PasswordEncoder;

@EnableWebSecurity
public class SecurityConfig extends WebSecurityConfigurerAdapter {
    @Autowired
    private CustomUserDetailsService customUserDetailsService;

    // 配置密码加密方式(必须和数据库中密码的加密方式一致)
    @Bean
    public PasswordEncoder passwordEncoder() {
        return new BCryptPasswordEncoder();
    }

    // 配置用户认证的数据源
    @Override
    protected void configure(AuthenticationManagerBuilder auth) throws Exception {
        auth.userDetailsService(customUserDetailsService).passwordEncoder(passwordEncoder());
    }

    // 配置接口的权限规则
    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http
                // 1. 配置接口权限
                .authorizeRequests()
                .antMatchers("/public/**").permitAll() // 公开接口:所有人可访问
                .antMatchers("/admin/**").hasRole("ADMIN") // 管理员接口:需要ADMIN角色
                .antMatchers("/user/**").hasRole("USER") // 普通用户接口:需要USER角色
                .anyRequest().authenticated() // 其他接口:必须登录
                // 2. 配置表单登录(Spring Security自带登录页)
                .and()
                .formLogin()
                .loginPage("/login") // 自定义登录页路径(可选,默认是/spring-security-login)
                .loginProcessingUrl("/doLogin") // 登录请求接口(默认是/login)
                .defaultSuccessUrl("/index") // 登录成功后跳转的页面
                // 3. 关闭CSRF(测试环境可用,生产环境建议开启)
                .and()
                .csrf().disable();
    }
}
 

(6)Controller层:写测试接口

package com.example.websecuritydemo.controller;

import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

@RestController
public class TestController {
    // 公开接口:所有人可访问
    @GetMapping("/public/hello")
    public String publicHello() {
        return "这是公开接口,不用登录就能看~";
    }

    // 管理员接口:只有ADMIN角色能访问
    @GetMapping("/admin/hello")
    public String adminHello() {
        return "这是管理员接口,只有admin能看~";
    }

    // 普通用户接口:只有USER角色能访问
    @GetMapping("/user/hello")
    public String userHello() {
        return "这是普通用户接口,只有user能看~";
    }
}
 

步骤4:测试权限控制

1. 启动SpringBoot项目;

2. 访问 http://localhost:8080/public/hello :直接看到返回内容(公开接口);

3. 访问 http://localhost:8080/admin/hello :自动跳转到登录页,输入 admin/123456 登录后,能看到返回内容;

4. 用 user/123456 登录后,访问 /admin/hello :会提示“403 Forbidden”(无权限)。



三、完整Web项目开发流程:从需求到上线的全链路(以“学生管理系统”为例)

一个Web项目的开发,不是“写代码”这么简单,而是从“需求”到“上线运维”的全流程,这里以“学生管理系统”为例,拆成6个核心步骤:


1. 需求分析与技术选型

需求分析(明确“做什么”)

1. 和产品/客户沟通,明确核心需求:

功能需求:学生信息的增删改查、用户权限控制、导出学生Excel表;
非功能需求:页面加载时间≤2秒、支持100人同时访问、数据要加密存储;

2. 输出《需求规格说明书》,明确“哪些功能必须做”“哪些是可选功能”。

技术选型(明确“用什么做”)
根据需求选技术栈,确保“够用、好维护”:
后端:SpringBoot 2.7.x + MyBatis-Plus + MySQL 8.0;
前端:Thymeleaf(模板引擎) + Bootstrap(Th框架);
工具:Git(版本控制)、Maven(依赖管理)、Postman(接口测试)、Jenkins(自动化部署)。


2. 数据库设计(核心是“表结构”)

1. 根据需求设计表:

比如 student (学生表)、 sys_user (用户表)、 sys_role (角色表);

2. 遵循数据库设计规范:

每个表要有主键(建议用自增Long型);
字段要加注释,比如 student 表的 age 字段注释“学生年龄”;
加索引:比如 student 表的 class_id (班级ID)加普通索引,加快查询;
外键关联:比如 student.class_id 关联 class.id (班级表)。

3. 输出《数据库设计文档》,包含表结构、字段说明、索引说明。


3. 项目搭建与代码开发

项目搭建

1. 用IDEA创建SpringBoot项目,引入所需依赖;
2. 初始化Git仓库,把项目推到GitHub/Gitee(方便多人协作)。

代码开发(分层开发)

按照“Controller→Service→Mapper→Entity”的分层写代码:

1. Entity:对应数据库表的实体类;
2. Mapper:操作数据库的接口(用MyBatis-Plus减少重复代码);
3. Service:处理业务逻辑(比如“添加学生时要校验年龄是否合法”);
4. Controller:接收前端请求,调用Service,返回数据/页面;
5. 前端:用Thymeleaf写页面,实现“列表展示”“表单提交”等功能。


4. 测试(确保“做对了”)

 
1. 单元测试:用Junit测Service层的方法,比如“测试添加学生的方法是否能正确校验年龄”;

2. 接口测试:用Postman测Controller的接口,比如“测试删除学生的接口是否返回正确的状态码”;

3. 集成测试:启动整个项目,测“从页面点击‘添加学生’到数据库新增一条记录”的全流程;

4. 性能测试:用JMeter模拟100人同时访问,看页面加载时间是否符合要求;

5. 输出《测试报告》,记录Bug和修复情况。



5. 部署上线

1. 打包:用Maven打Jar包( mvn clean package -DskipTests );

2. 服务器准备:购买云服务器(比如阿里云ECS),安装JDK、MySQL、Nginx;

3. 上传Jar包:用Xshell/Xftp把Jar包传到服务器的 /opt/app 目录;

4. 启动项目:用 nohup java -jar student-manage-1.0-SNAPSHOT.jar & 启动(nohup表示后台运行);

5. 配置Nginx:把域名(比如 student.example.com )解析到服务器IP,配置Nginx反向代理到8080端口。 


6. 运维与迭代

 运维:

1. 用Logback记录日志,每天查看日志文件,排查异常;
2. 用Spring Boot Admin监控项目运行状态(比如内存占用、接口请求量);
3. 定期备份数据库(比如每天凌晨用脚本备份到OSS)。

迭代:

1. 收集用户反馈,比如“希望增加‘学生成绩统计’功能”;
2. 评估需求优先级,把“学生成绩统计”加入下一个版本的开发计划;
3. 重复“需求分析→开发→测试→部署”的流程,持续优化项目。

Logo

有“AI”的1024 = 2048,欢迎大家加入2048 AI社区

更多推荐