# Operation API loading issue

**URL:** <https://community.cumulocity.com/t/operation-api-loading-issue/1523>\
**Category:** Forum\
**Tags:** device-connectivity, cumulocity\
**Created:** [January 10, 2022, 10:04am UTC](https://community.cumulocity.com/t/operation-api-loading-issue/1523 "2022-01-10T10:04:01Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![mhassan](https://dub1.discourse-cdn.com/flex005/user_avatar/community.cumulocity.com/mhassan/32/4078_2.png) [@mhassan](https://community.cumulocity.com/u/mhassan)\
**Post date:** [January 10, 2022, 10:04am UTC](https://community.cumulocity.com/t/operation-api-loading-issue/1523/1 "2022-01-10T10:04:01Z")

</div>

#### What product/components do you use and which version/fix level?

Cumulocity **1010.0.12**

#### Are you using a free trial or a product with a customer license?

Customer License

#### What are trying to achieve? Please describe in detail.

We have build a widget, Where we are calling GET device control operation API ([https://test.cumulocity.com/devicecontrol/operations/](https://test.cumulocity.com/devicecontrol/operations/){operation ID}) and the API is in pending status on server but in my local it runs after multiple try and give me successful status.  
There is two part first I post an operation API then that API successfully gives me operation ID but when I try to run GET API using the operation ID from post API, I got pending status in my browser network and in my widget even though the operation is successful in device management control section.  
I believe the server is to fast and it didn’t give much time to GET API to completes.  
I’m wondering what could be the possible reason and any help much appreciated.

API -  
async getData(id) {  
const response = await this.fetchClient.fetch(‘/devicecontrol/operations/’ + id, this.options).then(handleErrors).catch(error =\> this.toasterService.error(`${error}\n`, “”, { positionClass: ‘toast-top-center’, timeOut: 300000000 })); // Fetch API Response  
return response.json();  
}

#### Do you get any error messages? Please provide a **full error** message screenshot and log file.

It’s pending in my browser!

 ![image](https://europe1.discourse-cdn.com/flex005/uploads/cumulocity/original/3X/a/9/a9456ddd602ad8f0f9ca85b45104247e1a6d4212.png)

But the same operation ID is successful in postman or device management.

 ![image](https://europe1.discourse-cdn.com/flex005/uploads/cumulocity/original/3X/7/2/725d7c8bf3c0642741abe78e420ba63d21a210fa.png)

---

<div class="post-metadata">

**Author:** ![Christian\_Guether1](https://dub1.discourse-cdn.com/flex005/user_avatar/community.cumulocity.com/christian_guether1/32/14848_2.png) [@Christian\_Guether1](https://community.cumulocity.com/u/Christian_Guether1)\
**Post date:** [January 10, 2022, 12:30pm UTC](https://community.cumulocity.com/t/operation-api-loading-issue/1523/2 "2022-01-10T12:30:23Z")

</div>

Hi Saif,

as a general remark, if you communicate with Cumulocity’s API you can use the [@c8y/client](http://resources.cumulocity.com/documentation/websdk/client/index.html) instead of the FetchClient. For the Operation API it is the [OperationService](http://resources.cumulocity.com/documentation/websdk/client/classes/operationservice.html).

For your issue, I think you shouldn’t simply poll the operation and its status using a GET request as it will result in multiple requests to check whether the status of the operation has been updated to successful. I suggest to use the [Realtime API](http://resources.cumulocity.com/documentation/websdk/client/classes/realtime.html) and subscribe for updates for your operations.

Realtime service needs to be injected into your service/component and then you can subscribe to different channels:

```javascript
// realtime event
const subscription = realtime.subscribe('/operations/<<id>>', (data) => {
  console.log(data); // logs all operations CRUD changes
});
realtime.unsubscribe(subscription);

```

Basically you would receive notifications for the operation every time it has been updated. This includes also changes to its status.

Best regards  
Christian

---

<div class="post-metadata">

**Author:** ![mhassan](https://dub1.discourse-cdn.com/flex005/user_avatar/community.cumulocity.com/mhassan/32/4078_2.png) [@mhassan](https://community.cumulocity.com/u/mhassan)\
**Post date:** [January 11, 2022, 11:31am UTC](https://community.cumulocity.com/t/operation-api-loading-issue/1523/3 "2022-01-11T11:31:16Z")

</div>

Hey @Christian_Guether1 ,

Thanks for the quick response, I changed the FetchClient API to OperationService and the response is quite same. The issue is on server deployment the response I get from the operation API is pending but in reality the operation is successful, The server doesn’t give much time to load.

API -  
async getData(id) {  
const response = await this.operationservice.detail(id)  
return response.data;  
}

API response -

c8y\_Command: {text: “{“Update”:“AcquisitionRates”}”}  
creationTime: “2022-01-11T11:29:56.040Z”  
description: “Execute shell command: UpdateStatus”  
deviceId: “31635012”  
id: “36887681”  
self: “[https://solenis.us.cumulocity.com/devicecontrol/operations/36887681](https://solenis.us.cumulocity.com/devicecontrol/operations/36887681)”  
status: “PENDING”

Can you please give me more information on how I can use the Realtime API here and what I need to subscribe here?

Thanks.

---

<div class="post-metadata">

**Author:** ![Christian\_Guether1](https://dub1.discourse-cdn.com/flex005/user_avatar/community.cumulocity.com/christian_guether1/32/14848_2.png) [@Christian\_Guether1](https://community.cumulocity.com/u/Christian_Guether1)\
**Post date:** [January 14, 2022, 10:42am UTC](https://community.cumulocity.com/t/operation-api-loading-issue/1523/4 "2022-01-14T10:42:52Z")

</div>

Hi Saif,

a minimal example to subscribe for notifications on operations for a specific device:

```typescript
import { Component, OnDestroy, OnInit } from '@angular/core';
import { IOperation, Realtime } from '@c8y/client'

@Component({
  selector: 'hello',
  templateUrl: './hello.component.html'
})
export class HelloComponent implements OnInit, OnDestroy {
  private readonly DEVICE_ID = '701';

  private subscription: object;

  constructor(private realtime: Realtime) { }

  ngOnInit(): void {
    this.subscription = this.realtime.subscribe(`/operations/${this.DEVICE_ID}`, ((notification) => {
      const operation: IOperation = notification.data.data;
      console.log('operation update received: ', operation);
    }));
  }

  ngOnDestroy(): void {
    this.realtime.unsubscribe(this.subscription);
  }
}

```

The Realtime service is injected as a dependency. In the onInit method the component subscribes for notifications on operations using the Realtime service and the channel `/operations/`. In this case, the component subscribes for operations of a particular device: `private readonly DEVICE_ID = '701';` via `/operations/${this.DEVICE_ID}`. Using this subscription, the component only receives notifications, which have been created/updated for this specific device. If you want to receive operations for all devices, you can set up a subscription and use the `*` as a wildcard: `/operations/*`.

By using this approach you will be informed about every operation status updates.

Best regards  
Christian

---

<div class="post-metadata">

**Author:** ![system](https://dub1.discourse-cdn.com/flex005/user_avatar/community.cumulocity.com/system/32/31990_2.png) [@system](https://community.cumulocity.com/u/system)\
**Post date:** [April 14, 2022, 10:43am UTC](https://community.cumulocity.com/t/operation-api-loading-issue/1523/5 "2022-04-14T10:43:46Z")

</div>

Closed on April 14, 2022, 10:43am UTC

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.
