Skip to main content Skip to footer

How to use ActiveReportsJS MCP Server with AI Coding Assistants

Quick Start Guide
What You Will Need

VisualStudio Code

ActiveReportsJS

Controls Referenced

MCP Server

JavaScript Report Designer

JavaScript Report Viewer

Tutorial Concept This tutorial shows how to connect the ActiveReportsJS MCP Server to AI coding assistants, verify the connection, and use trusted MESCIUS product guidance directly in your development workflow. You'll learn how to get an MCP token, configure popular AI tools, and use MCP-powered assistance to build ActiveReportsJS applications more effectively.

Recently, MESCIUS USA, Inc. has released several MCP servers that developers are able to integrate into their development pipelines to make working with our products even easier. In this article, we’ll take a look at the ActiveReportsJS MCP server, how to obtain an MCP token, verify the connection, and use the MCP to get ActiveReportsJS-specific development guidance and assistance.

AI coding assistants can be useful when building an application, but their answers are only as useful as the context available to them. When working with a specialized JavaScript reporting library such as ActiveReportsJS, an AI assistant may not always have the latest information about package setup, APIs, report viewers, designers, exports, or recommended implementation patterns.

The MESCIUS MCP Server addresses this by connecting compatible AI assistants directly to trusted MESCIUS product knowledge. For ActiveReportsJS, this includes product documentation, APIs, implementation guidance, code examples, setup information, and other product resources.

MCP, or Model Context Protocol, provides a standard way for AI clients to connect to external tools and information sources. Instead of relying entirely on what the model already knows, the AI client can retrieve relevant ActiveReportsJS information as it processes your request.

In this article, we’ll show you how to:

Want to Try it Out? Download ActiveReportsJS Today!

Prerequisites 

Before configuring an AI client, you'll need an MCP-compatible client and a valid ActiveReportsJS MCP token.

The token and endpoint are both product-specific. An MCP token issued for another MESCIUS product cannot be used with the ActiveReportsJS MCP endpoint.

For ActiveReportsJS, we'll use the following connection information throughout this article:

ARJS Connection Information

These values are the same regardless of which compatible AI client you use. What changes is how each client stores and manages its MCP configuration.

Getting an ActiveReportsJS MCP Token

Before we can connect an AI assistant to the ActiveReportsJS MCP Server, we need a token that authorizes access.

MESCIUS provides two ways to obtain an MCP token depending on whether you're evaluating the product or already have an eligible MESCIUS license.

Request a Trial MCP Token

If you're evaluating ActiveReportsJS, or if you do not currently have an eligible active license or maintenance plan, you can request a 30-day MCP access token.

On the MESCIUS MCP token request page, select ActiveReportsJS as the product and provide your company email address. MESCIUS will send you a temporary product-specific MCP token that can be used to configure your AI assistant.

Because MCP tokens are product-specific, make sure you select ActiveReportsJS when requesting the token.

Open the MESCIUS MCP trial-token request page and complete the form:

Request an ActiveReportsJS MCP Trial Token

The token provides access to product information including documentation search, setup guidance, implementation information, and ActiveReportsJS best practices.

Keep the token available while configuring your AI client. We'll substitute it anywhere the examples use <YOUR_MCP_TOKEN>.

Generate an MCP Token as an Existing Customer

If you already have an eligible MESCIUS license, you do not need to request a trial token.

Customers with an active subscription license, or a perpetual license covered by active maintenance, can generate the MCP token from the MESCIUS My Account area.

After signing in:

  1. Open My Account > My Licenses.

  2. Locate your ActiveReportsJS license.

  3. Look in the Actions section beside the license.

  4. Click Generate Token for MCP.

  5. Copy the generated MCP token from the license details.

If the license is eligible for MCP access, the token is generated immediately.

Token Generation

After generating the key, copy it somewhere secure so that you can use it during client configuration.

If Generate Token for MCP is not available, verify that the subscription or maintenance associated with the license is still active. If the license is not currently eligible, you can use the 30-day trial-token process instead.

With our endpoint and token available, we can configure an AI client.

Connecting the MCP to Coding Agents

The ActiveReportsJS MCP supports connections to all of the popular coding agents; in this section, we’ll review some of the more common agents and how you can give them access to the MCP server.

Configuring the MCP Server in Claude Code CLI

Claude Code provides a command-line option for registering an HTTP MCP server.

Open a terminal and run the following command, replacing <YOUR_MCP_TOKEN> with your ActiveReportsJS MCP token:

claude mcp add --scope user --transport http arjs-mcp https://developer.mescius.com/mcp/activereportsjs --header "Authorization: Bearer <YOUR_MCP_TOKEN>"

The MESCIUS Claude Code configuration uses HTTP transport and supports configuring the MCP server at either the user or local scope. Using --scope user makes the MCP server available across your Claude Code projects.

If you only want the ActiveReportsJS MCP Server available for the current project, you can use --scope local instead.

Once the server has been added, verify the configuration:

claude mcp list
claude mcp get arjs-mcp

claude mcp list lets us confirm that the server was registered, while claude mcp get arjs-mcp displays the configuration for the ActiveReportsJS MCP server.

After the connection succeeds, you should see arjs-mcp listed as an available MCP server.

Configuring the MCP Server in Claude Desktop

Claude Desktop uses a JSON configuration file to define MCP servers.

This setup uses npx and mcp-remote, so make sure Node.js is installed and available before continuing.

Open Claude Desktop and navigate to:

Settings > Developer > Edit Config

This opens the claude_desktop_config.json configuration file.

Add the ActiveReportsJS MCP configuration:

{
  "mcpServers": {
    "arjs-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-remote@latest",
        "https://developer.mescius.com/mcp/activereportsjs",
        "--transport",
        "http-only",
        "--header",
        "Authorization:${MCP_TOKEN}"
      ],
      "env": {
        "MCP_TOKEN": "Bearer <YOUR_MCP_TOKEN>"
      }
    }
  }
}

Replace <YOUR_MCP_TOKEN> with your ActiveReportsJS MCP token.

The configuration launches mcp-remote through npx, points it at the ActiveReportsJS MCP endpoint, and provides the token using the Authorization header.

Save the file and restart Claude Desktop.

On Windows, make sure you completely quit Claude Desktop from the system tray before reopening it. Closing only the application window may leave the existing process running.

After restarting Claude Desktop, confirm that arjs-mcp appears as an available MCP server.

Claude MCP

Configuring the MCP Server in OpenAI Codex CLI

OpenAI Codex stores its MCP server configuration in config.toml. The Codex CLI and Codex IDE extension share this configuration, so configuring the server once makes it available in both environments.

Open:

~/.codex/config.toml

Add the following configuration:

[mcp_servers.arjs-mcp]
enabled = true
url = "https://developer.mescius.com/mcp/activereportsjs"
http_headers = { Authorization = "Bearer <YOUR_MCP_TOKEN>" }

Replace <YOUR_MCP_TOKEN> with your ActiveReportsJS MCP token.

Once the configuration is saved, restart the Codex CLI. If the Codex terminal interface is already running, exit it and open it again so the new MCP configuration can be loaded.

Inside Codex, run:

/mcp

You should see arjs-mcp among the available MCP servers. Because the Codex CLI and Codex VS Code extension share the same MCP configuration, the ActiveReportsJS server will also be available from the extension after it has been added to config.toml.

OpenAI MCP

Configuring the MCP Server in ChatGPT Desktop

ChatGPT Desktop provides a UI for adding an MCP server, so this configuration does not require editing a JSON or TOML file.

Open ChatGPT Desktop and navigate to:

Settings > Plugins > MCPs

Click Add server.

Enter the following values:

ChatGPT MCP

Replace <YOUR_MCP_TOKEN> with your ActiveReportsJS MCP token.

ARJS MCP Token

Click Save.

The new arjs-mcp connection should now appear in the MCP servers list.

With that connection available, ChatGPT can use the MCP Server to retrieve ActiveReportsJS product information while helping you build or troubleshoot an application.

Configuring the MCP Server for Github Copilot in VS Code

If GitHub Copilot is already part of your development workflow, you can configure ActiveReportsJS MCP directly in Visual Studio Code.

Open the VS Code Command Palette using:

  • Ctrl+Shift+P on Windows or Linux

  • Cmd+Shift+P on macOS

Run:

MCP: Open User Configuration

This opens the mcp.json user configuration file.

Add the ActiveReportsJS server:

{
  "servers": {
    "arjs-mcp": {
      "type": "http",
      "url": "https://developer.mescius.com/mcp/activereportsjs",
      "headers": {
        "Authorization": "Bearer <YOUR_MCP_TOKEN>"
      }
    }
  }
}

Replace <YOUR_MCP_TOKEN> with your ActiveReportsJS MCP token.

Next, open Copilot Chat and click the settings button in the upper-right corner. Select the MCP Servers section, locate arjs-mcp, right-click it, and select Start Server.

Start MCP Server

With the server running, GitHub Copilot can use ActiveReportsJS product context while you're working directly inside the application source code.

Verify the ActiveReportsJS MCP Connection

Regardless of which client you're using, it's a good idea to verify the connection before relying on MCP for development work.

First, confirm that:

  • arjs-mcp appears in the client's MCP server list.

  • The server is enabled or running.

  • MCP tools are available to the AI client.

  • Agent mode is enabled if your particular client requires it.

MESCIUS also recommends using a product-specific prompt to make sure the assistant actually invokes the configured MCP server.

For ActiveReportsJS, a simple test might be:

Use arjs-mcp to find the recommended way to add ActiveReportsJS to a React application.

Explicitly mentioning arjs-mcp is useful during testing because it tells the AI assistant which connected MCP source you want it to use.

The assistant should use the MESCIUS MCP Server to retrieve ActiveReportsJS information before constructing its response.

If the assistant responds without using MCP, verify that the MCP server is enabled and try explicitly mentioning arjs-mcp again.

Using the MCP When Building an ActiveReportsJS Application

Once the connection is working, you don't need to restrict MCP to simple documentation questions.

The MESCIUS MCP Server provides coding guidelines as well as semantic search across MESCIUS documentation and code examples. That gives the AI assistant more product-specific context before it generates implementation guidance or code.

For ActiveReportsJS development, that can be useful for tasks involving report designers, report viewers, embedded designer integrations, and export workflows including PDF, HTML, XLSX, and CSV.

For example, you could ask:

Use arjs-mcp to show me how to embed the ActiveReportsJS Viewer in a React application.

Or provide more information about the implementation you're building:

Use arjs-mcp to find the recommended ActiveReportsJS setup for an Angular application. Include the packages and imports I need.

You can also ask the assistant to research a specific reporting workflow before modifying your application:

Use arjs-mcp to determine how ActiveReportsJS exports a report to PDF, then show me how to add that workflow to my application.

When a framework, runtime, or ActiveReportsJS version matters, include it in the prompt. MESCIUS specifically recommends supplying that information when it is relevant to the answer.

Use arjs-mcp to show me the recommended way to integrate the ActiveReportsJS Designer into my React application. Explain the required packages first, then provide the implementation.

For example:

Use arjs-mcp to show me the recommended way to integrate the ActiveReportsJS Designer into my React application. Explain the required packages first, then provide the implementation.

This is where MCP becomes particularly useful compared with simply pasting a large amount of documentation into a chat.

The AI client can retrieve the relevant ActiveReportsJS information as part of the development conversation and use that context when constructing its response.

Tips for Getting Better ActiveReportsJS MCP Results

Connecting the server gives the AI assistant access to ActiveReportsJS product information, but the quality of the request still matters.

Try to make prompts specific to the feature you're implementing. If you're working with a particular framework or product version, mention it. If your client has multiple MCP servers configured and does not automatically select the ActiveReportsJS connection, explicitly include arjs-mcp in the prompt.

It's also useful to separate research from implementation for larger changes. For example, you might first ask:

Use arjs-mcp to find the recommended ActiveReportsJS Viewer setup for React. Explain the required packages, CSS, and initialization steps.

After reviewing the response, follow up with:

Now apply that approach to the React component in this project.

This makes it easier to see which ActiveReportsJS requirements the AI identified before it starts modifying code.

As with any AI-generated implementation, review the generated code before using it in production. MESCIUS also recommends starting a new conversation when earlier context begins causing unrelated or outdated responses.

Troubleshooting the MCP Connection

If arjs-mcp does not appear or the AI client cannot connect, start with the common configuration values.

Verify that the endpoint is exactly:

https://developer.mescius.com/mcp/activereportsjs

Then confirm that the authorization value includes Bearer followed by your ActiveReportsJS MCP token:

Authorization: Bearer <YOUR_MCP_TOKEN>

Remember that the token is product-specific. A token generated for SpreadJS or Wijmo cannot be used with the ActiveReportsJS endpoint.

Also make sure your AI client, CLI, IDE extension, or desktop application is current. MESCIUS recommends using an up-to-date client when connecting to the MCP service.

For client-specific issues, return to the relevant MESCIUS setup documentation and confirm that the server is both configured and enabled.

Conclusion

The ActiveReportsJS MCP Server gives MCP-compatible AI development tools a way to retrieve trusted ActiveReportsJS product information while they're helping you build an application.

The basic connection is the same across clients: obtain an ActiveReportsJS MCP token, connect arjs-mcp to the ActiveReportsJS endpoint, provide the token through the Authorization header, and verify that the server is available.

From there, you can use the MCP connection from Claude Code, OpenAI Codex, Claude Desktop, ChatGPT Desktop, GitHub Copilot, and other MCP-compatible development tools to ask product-specific questions and get implementation guidance grounded in MESCIUS resources.

If you're evaluating ActiveReportsJS, request a 30-day MCP token to get started. Existing customers with an eligible active license can generate their MCP token directly from My Account > My Licenses.

MCP Server

MCP Setup Documentation

Happy coding!

Want to Try it Out? Download ActiveReportsJS Today!

comments powered by Disqus