Spring REST应用：数据库无记录时HTML显示提示而非空JSON

这个需求很常见，咱们可以从后端逻辑调整和前端响应处理两部分入手，确保查不到MongoDB记录时，页面能显示友好提示而不是空JSON。

一、后端调整：根据查询结果返回不同响应 #

核心思路是在Controller层（或通过全局异常处理）判断查询结果是否为空，返回包含提示信息的响应，而不是直接返回空对象。

方案1：直接在Controller中判断返回（快速实现） #

修改你的Controller方法，用ResponseEntity<?>来灵活返回数据或错误信息：

@GetMapping("/person")
public ResponseEntity<?> getPerson(@RequestParam("userId") String userId) {
    // 调用Service层查询数据
    Person person = personService.findPersonById(userId);
    
    if (person == null) {
        // 查不到时返回404状态码+提示消息
        Map<String, String> errorMsg = new HashMap<>();
        errorMsg.put("message", "未找到匹配的用户记录，请检查输入的ID是否正确");
        return ResponseEntity.status(HttpStatus.NOT_FOUND).body(errorMsg);
    }
    
    // 查到数据时返回PersonView和200状态码
    PersonView personView = personMapper.convertToPersonView(person);
    return ResponseEntity.ok(personView);
}

方案2：用全局异常处理（更优雅的架构） #

如果你的项目追求代码解耦，可以自定义异常+全局异常处理器：

1. 自定义异常类

public class PersonNotFoundException extends RuntimeException {
    public PersonNotFoundException(String userId) {
        super(String.format("未找到ID为「%s」的用户记录", userId));
    }
}

2. 修改Service层，查不到时抛出异常

@Service
public class PersonService {
    @Autowired
    private PersonRepository personRepository;

    public Person findPersonById(String userId) {
        // 查不到数据时直接抛出自定义异常
        return personRepository.findById(userId)
                .orElseThrow(() -> new PersonNotFoundException(userId));
    }
}

3. 全局异常处理器

@RestControllerAdvice
public class GlobalExceptionHandler {
    @ExceptionHandler(PersonNotFoundException.class)
    public ResponseEntity<Map<String, String>> handlePersonNotFound(PersonNotFoundException ex) {
        Map<String, String> errorResponse = new HashMap<>();
        errorResponse.put("message", ex.getMessage());
        return ResponseEntity.status(HttpStatus.NOT_FOUND).body(errorResponse);
    }
}

这样Controller就可以保持简洁，不用写判断逻辑：

@GetMapping("/person")
public PersonView getPerson(@RequestParam("userId") String userId) {
    Person person = personService.findPersonById(userId);
    return personMapper.convertToPersonView(person);
}

二、前端处理：根据响应显示对应内容 #

前端需要区分后端返回的是用户数据还是错误提示，然后在页面上展示不同内容。这里以原生JavaScript为例：

1. HTML结构（基础示例） #

<div class="search-container">
    <input type="text" id="userIdInput" placeholder="请输入用户ID">
    <button id="searchBtn">查询用户</button>
</div>
<div id="resultArea" class="result-area"></div>

2. JavaScript逻辑（处理响应） #

document.getElementById('searchBtn').addEventListener('click', function() {
    const userId = document.getElementById('userIdInput').value.trim();
    const resultArea = document.getElementById('resultArea');
    
    if (!userId) {
        resultArea.innerHTML = '<p style="color: #dc3545;">请输入用户ID</p>';
        return;
    }

    // 发送请求到后端接口
    fetch(`/person?userId=${userId}`)
        .then(response => {
            // 先判断响应状态是否正常
            if (!response.ok) {
                // 状态码非200时，解析错误信息
                return response.json().then(errorData => { throw errorData; });
            }
            // 状态正常时解析用户数据
            return response.json();
        })
        .then(personData => {
            // 显示用户JSON数据（格式化展示）
            resultArea.innerHTML = `<pre style="color: #28a745;">${JSON.stringify(personData, null, 2)}</pre>`;
        })
        .catch(error => {
            // 显示错误提示
            resultArea.innerHTML = `<p style="color: #dc3545;">${error.message}</p>`;
        });
});

这样调整后，当数据库中没有匹配记录时，前端页面会显示你定义的提示文本，而不是空JSON啦。

内容的提问来源于stack exchange，提问作者MOngoDBUser