Vue中如何用RSockets检索信息到前端？

如何解决Vue中如何用RSockets检索信息到前端？

我在后面的服务工作正常

抱歉，我会添加大部分代码，以便让那些喜欢在他们的项目中实现它的人可以理解和复制它。 请直接到 requestStream 或最后查看问题。

ProductSocketController

public class ProductSocketController {
    
    private final ProductService service;

    @MessageMapping("todos")
    public Flux<ProductDto> getAll(){
        return this.service.getAll();
    }

产品控制器

@RestController
@RequestMapping("product")
@CrossOrigin(origins= "*",methods = {RequestMethod.GET,RequestMethod.POST})
public class ProductController {
    
    private final Mono<RSocketRequester> requester;
    
    @GetMapping(value = "/socket/all",produces = MediaType.TEXT_EVENT_STREAM_VALUE)
    public Flux<ProductDto> allBySocket(){
        return this.requester.flatMapMany(r -> r.route("todos")
                .data(new ProductRequestDto())
                .retrieveFlux(ProductDto.class));
    }
}

产品服务

@Service
public class ProductService {
    
    @Autowired
    private ProductRepository repository;
    
    public Flux<ProductDto> getAll(){
        return this.repository.findAll()
        .map(EntityDtoUtil::toDto);
    }
}

这是我在邮递员中从我的服务“/socket/all”中检索的内容

data: {
    "id": 1,"description": "memo","price": 200,"subscriber": "memo"
}

data: {
    "id": 2,"description": "juan","price": 2054,"subscriber": "juan"
}

data: {
    "id": 3,"description": "camara","price": 600,"subscriber": "memo"
}

问题是我尝试传给前面的时候发现的，因为在和RSockets做连接的时候是成功的，但是在Vue中却出现这个错误

这是我用于连接的方法，请看requestStream部分（元数据）

 connect() {
      console.log("connecting with RSocket...");
      const transport = new RSocketWebSocketClient({
        url: "ws://localhost:6565/rsocket",});
      
      const client = new RSocketClient({
        // send/receive JSON objects instead of strings/buffers
        serializers: JsonSerializers,metadata: IdentitySerializer,setup: {
          // ms btw sending keepalive to server
          keepAlive: 60000,// ms timeout if no keepalive response
          lifetime: 180000,// format of `data`
          dataMimeType: "application/json",// format of `metadata`
          metadataMimeType: "message/x.rsocket.routing.v0",},transport,});
      // error handler
      const errorHanlder = (e) => console.log(e);
      // response handler
      const responseHanlder = (payload) => {
        console.log(payload.data);
      };

我认为错误在元数据中

      client.connect().subscribe({ 
        onComplete: (socket) => {
          socket
            .requestStream({
              metadata: String.fromCharCode("product/socket/1".length) + "product/socket/1"
            })
            .subscribe({
              onComplete: () => console.log('complete'),onError: errorHanlder,onNext: responseHanlder,onSubscribe: (subscription) => {
                subscription.request(2147483647); // set it to some max value
              },});
        },});
    },}

这是浏览器控制台发送的错误