为什么 Angular HttpClient 响应为空？答案

【问题标题】：Why Angular HttpClient response is null?为什么 Angular HttpClient 响应为空？
【发布时间】：2019-04-20 11:48:01
【问题描述】：

我的环境：

商店 RestController : Spring Boot
- 在 localhost 笔记本电脑上 ubuntu 18:04
ShopService：Angular HttpClient
- 在 localhost 桌面 pc windows 10 上

问题：

我通过 HttpClient 获取的请求得到的响应为空。但如果我使用邮递员或浏览器，我会得到预期的响应正文。

Angular 代码：

const BASE_URL = 'http://pc01:8081/shopsystem/shops';
const  SHOP_NAME = 'Muster Shop';

@Injectable({
  providedIn: 'root'
})
export class ShopService {

  shop$: Shop;
  address$: Address;
  owner$: Owner;

  //header = new HttpHeaders({ 'Content-Type': 'application/json' });

  constructor(private http: HttpClient) { }

  public getShop(): Observable<Shop>{
    return this.http.get<Shop>(BASE_URL + '/' + SHOP_NAME);
  }

响应头：

回应：

对邮递员的要求：

Spring Boot 控制器：

我已经尝试过使用任意的 Observable 和使用 application/json 的 HttpHeaders 但同样的反应。

另一件事：如果我的 Spring Boot 控制器返回一个列表，那么我会得到包含内容的响应正文。

问题：

为什么我的 HttpClient 请求中的正文为空或空？

我该如何解决这个问题？

谢谢

【问题讨论】：

在 Spring Boot 控制器中显示您的 Get 方法
感谢您的快速回复。我用我的 spring boot 控制器编辑了我的问题
您是否尝试过在 uri 中设置没有空格？将muster shop 更改为musterShop，看看你是否仍然得到空值
我从后端得到了 404。请求地址：pc01:8081/shopsystem/shops/MusterShop 请求方法：GET 状态码：404
我认为这是你的插件在塞东西。把它关掉，看看会发生什么。在同一台机器上运行应用程序，看看会发生什么。在 Spring Boot 中正确启用 Cors，看看会发生什么。看起来你有一些调试要做。

标签： java angular spring-boot httpclient angular7

【解决方案1】：

您的 Angular HttpClient 对路径变量中的空间进行编码，因此它以 Muster%20Shop 的形式出现在 RestController 中。

然后您尝试查找具有该确切名称但不存在的记录。

在将@PathVariable 作为Muster Shop 发送到您的查询之前，您必须对其进行解码。

【讨论】：

但是 Spring Boot 会自动解码它，我可以在我的 Spring Boot 日志中看到它。如果来自 HttpClient 的请求到达我的 Spring Boot，它会调用预期的服务并返回预期的响应。

【解决方案2】：

将注解 @CrossOrigin 添加到您的 Controller 类

@CrossOrigin
@RestController
@RequiredArgsConstructor
@RequestMapping("/api/v1")
public class UserController {

    private final FileStorageService fileStorageService;
    private final GameService service;


    @GetMapping("{id}")
    public GameDTO getUserbyID(@PathVariable Long id) {
        log.info("get {} at {}", service.getUserbyID(id), Calendar.getInstance().getTime());
        return service.getUserbyID(id);
    }

【讨论】：

更详细的答案应该包括带有推荐修复的代码示例。