Vue Solana Logo

RPC and Clusters

Configure Solana clusters, RPC endpoints, WebSocket endpoints, and client helpers.

Vue Solana keeps cluster and endpoint configuration shared across @vue-solana/core, @vue-solana/vue, and @vue-solana/nuxt.

Use this guide when you need to choose a cluster, provide a custom RPC endpoint, or understand what the RPC composables expose.

Cluster Names

Supported cluster names are:

  • devnet
  • testnet
  • mainnet
  • mainnet-beta (legacy alias for mainnet)
  • localnet

Use mainnet for Solana mainnet. This is Solana's official mainnet cluster name. The legacy mainnet-beta spelling is still accepted and redirects to the same endpoint.

devnet is the default because it is the safest cluster for examples and development.

Core Setup

Use @vue-solana/core/rpc when you want framework-agnostic client setup.

import { createSolanaContext } from "@vue-solana/core/rpc";

const solana = createSolanaContext({
  cluster: "devnet",
  commitment: "confirmed",
});

const { value: latestBlockhash } = await solana.client.rpc.getLatestBlockhash().send();

console.log(solana.endpoint, latestBlockhash.blockhash);

createSolanaContext() returns the resolved cluster, HTTP endpoint, WebSocket wsEndpoint, and a Kit client whose rpc sends RPC requests.

Custom RPC Endpoints

Production apps should usually use a dedicated RPC provider instead of public cluster endpoints.

import { createSolanaContext } from "@vue-solana/core/rpc";

const solana = createSolanaContext({
  cluster: "mainnet",
  endpoint: "https://your-rpc.example.com",
  commitment: "confirmed",
});

If wsEndpoint is omitted, Vue Solana derives it from the HTTP endpoint by converting https to wss and http to ws.

import { getWebSocketEndpoint } from "@vue-solana/core/clusters";

const wsEndpoint = getWebSocketEndpoint("https://api.devnet.solana.com");

Vue Setup

Install the Vue plugin once near app startup.

import { createApp } from "vue";
import { createSolanaPlugin } from "@vue-solana/vue";
import App from "./App.vue";

createApp(App)
  .use(
    createSolanaPlugin({
      cluster: "devnet",
      commitment: "confirmed",
    }),
  )
  .mount("#app");

Then read RPC state from components with useRpc().

<script setup lang="ts">
import { useRpc } from "@vue-solana/vue/useRpc";

const { cluster, endpoint, status, latestBlockhash, error, checkConnection } = useRpc();
</script>

<template>
  <section>
    <p>Cluster: {{ cluster }}</p>
    <p>Endpoint: {{ endpoint }}</p>
    <p>Status: {{ status }}</p>
    <p>Latest blockhash: {{ latestBlockhash }}</p>
    <p v-if="error">Unable to reach RPC.</p>
    <button type="button" @click="checkConnection">Check RPC</button>
  </section>
</template>

Nuxt Setup

Configure the module in nuxt.config.ts.

export default defineNuxtConfig({
  modules: ["@vue-solana/nuxt"],
  solana: {
    cluster: "devnet",
    commitment: "confirmed",
  },
});

Nuxt stores module options in public runtime config, so options must be JSON-serializable. The Nuxt module intentionally omits payer and payerSecretKey; never place a raw secret in public runtime config. Install an ephemeral payer in a client-only plugin with clientPlugin: false.

Direct core and Vue clients can pass payer or payerSecretKey to createSolanaClient() / createSolanaPlugin(). The default client uses the official solanaRpc() stack for client-sent transactions, and solanaRpc() installs the transaction planner and the plan-signing and plan-sending executors itself.

Use the auto-imported useSolanaRpc() composable in Nuxt pages and components.

<script setup lang="ts">
const { cluster, endpoint, status, checkConnection } = useSolanaRpc();
</script>

The Nuxt runtime plugin is client-only. Composables can be called during SSR, but wallet and RPC work should be triggered from client lifecycle hooks or user actions.

Endpoint Helpers

Use @vue-solana/core/clusters when you need the built-in endpoint values without creating a client.

import {
  DEFAULT_CLUSTER,
  getClusterEndpoint,
  getClusterWebSocketEndpoint,
} from "@vue-solana/core/clusters";

const endpoint = getClusterEndpoint(DEFAULT_CLUSTER);
const wsEndpoint = getClusterWebSocketEndpoint("devnet");

Production Notes

  • Prefer a dedicated RPC provider for production traffic.
  • Avoid broad or frequent scans on public RPC endpoints.
  • Use WebSocket subscriptions intentionally; always clean them up when you no longer need them.
  • Treat RPC responses as untrusted input and handle missing, stale, or failed data.

Clusters

Wallets