Skip to main content

Sending Data

The call function can be used as a generic HTTP utility for performing POST requests with the purpose of sending data to a server endpoint. This function provides flexibility and is adaptable for many use cases where data submission is required (e.g., creating new records, submitting forms, etc.).

Consideration​

Backend

class SomeController extends Controller
{
#[Action(method: 'post')]
public function functionName()
{
return [];
}
}

Frontend

import { functionName } from '@actions/SomeController.js';

Function Signature​

functionName.call({params = {}, headers = {}, data = {}})

Parameters​

  • params (Optional):

    • An object representing query parameters to append to the request URL.
    • Useful for sending additional information or filtering based on dynamic needs.

    Example:

    params: { userId: 123, type: 'admin' }
  • headers (Optional):

    • An object containing the HTTP headers to include in the request.
    • Typically used for passing content type, authentication tokens, or custom headers.

    Example:

    headers: { 
    'Authorization': 'Bearer <token>'
    }
  • data (Optional):

    • The payload to be sent to the server.
    • type: object

    Example:

    data: { 
    name: 'John Doe',
    email: '[email protected]',
    password: 'securePassword123'
    }

Return Value​

  • Promise:
    • Resolves to the server's response, which can either be the raw response object, a JSON body, or status metadata based on the API's design.
    • Should be parsed (if needed) for further processing.

Workflow and Behavior​

  1. Headers Construction:
  • Merges default headers with custom headers from the caller in the header object
  1. Sending the POST Request:
  • Attaches the data payload to the request.
  1. Processing the Response:
  • Returns the server's response directly or throws errors based on the HTTP status code.
  1. Error Handling:
  • Supports customizable error handling by parsing functionName.errors messages and providing robust exception management.

Example Usage​

Example 1: Submitting JSON Data​

When working with JSON APIs, include a Content-Type header of application/json and provide the data payload in the data object:

functionName.call({
params: {},
headers: {'Authorization': 'Bearer myToken'},
data: {name: 'Jane Doe', email: '[email protected]'}
}).then(response => {
console.log('Data submitted successfully:', response);
}).catch(error => {
console.error('Failed to submit data:', functionName.errors);
});

Example 2: Submitting File Data​

For file uploads, use FormData to package the body content:

const formData = new FormData();

formData.append('file', selectedFile);
formData.append('userId', 123);

functionName.call({
headers: {'Authorization': 'Bearer myToken'},
data: formData
}).then(response => {
console.log('File uploaded successfully:', response);
}).catch(error => {
console.error('Failed to upload file:', functionName.errors);
});