Skip to content

Custom Request Handler

The requestHandler option in the registerCompletion function acts as a middleware that allows you to customize how requests are made from the client to your specified endpoint. By default, Monacopilot handles requests internally, but with requestHandler, you can intercept and modify both the request and response.

This is particularly useful when you need to:

  • Add custom headers (like authentication)
  • Modify the request body by combining Monacopilot's default completionMetadata with your own custom properties
  • Transform the response before it's processed by Monacopilot

The handler receives the endpoint URL and the request body that Monacopilot has prepared, giving you full control over how the request is made and processed.

Example

javascript
registerCompletion(monaco, editor, {
    endpoint: 'https://api.example.com/code-completion',
    // ... other options
    requestHandler: async ({endpoint, body}) => {
        const response = await fetch(endpoint, {
            method: 'POST',
            headers: {
                // Add custom headers
                'X-Custom-Header': 'custom value',
            },
            body: JSON.stringify({
                ...body,
                // Add custom parameters
                customProperty: 'custom value',
            }),
        });

        const data = await response.json();

        // Process and transform the response
        const processedCompletion = data.completion
            .trim()
            .replace(/\t/g, '    '); // Convert tabs to spaces

        return {
            completion: processedCompletion,
        };
    },
});

The requestHandler function takes an object with endpoint and body as parameters.

PropertyTypeDescription
endpointstringThe endpoint to which the request is sent. This is the same as the endpoint in registerCompletion.
bodyobjectThe body of the request processed by Monacopilot.

The requestHandler should return an object with the following property:

PropertyTypeDescription
completionstring or nullThe completion text to be inserted into the editor. Return null if no completion is available.

Example of Receiving

In your request handler, you can receive the custom properties you passed like this:

typescript
app.post('/code-completion', async (req, res) => {
    const {completion, error} = await copilot.complete({body: req.body});

    // Recieve the custom things you passed
    const customProperty = req.body.customProperty;
    const xCustomHeader = req.headers['x-custom-header'];

    if (error) {
        return res.status(500).json({completion: null, error});
    }

    res.json({completion});
});

Released under the MIT License.