useOpenUrl

Open URLs within or outside the frame context

Defined in @coinbase/onchainkit

Opens URLs in the appropriate context - either within the Mini App environment or in external browsers. Handles cross-client compatibility automatically.

Returns

openUrl · (url: string) => void

Function that opens the specified URL. Behavior depends on the URL type and client capabilities.

url · string · required

The URL to open. Can be http/https links, deep links, or other URI schemes.

components/ExternalLinks.tsx

import { useOpenUrl } from '@coinbase/onchainkit/minikit';

export default function ExternalLinks() {
  const openUrl = useOpenUrl();

  return (
    <div className="external-links">
      <button onClick={() => openUrl('https://base.org')}>
        Visit Base.org
      </button>
      <button onClick={() => openUrl('https://twitter.com/base')}>
        Follow on Twitter
      </button>
      <button onClick={() => openUrl('https://discord.gg/basechain')}>
        Join Discord
      </button>
    </div>
  );
}

URLs opened with useOpenUrl may open in different contexts depending on the client. Don’t rely on specific opening behavior for critical functionality.

useOpenUrl automatically handles cross-client compatibility and provides the best user experience for external navigation.