# Solana

The SafePal browser extension and mobile in-app browser are both designed to interact with web applications. There are two main ways to integrate SafePal into your web application:

# 1、Direct Integration

The most direct way to interact with SafePal is via the provider that SafePal injects into your web application. This provider is globally available at window.safepal and its methods will always include SafePal's most up-to-date functionality. This documentation is dedicated to covering all aspects of the provider.

Note

You can use third-party libraries in conjunction with window.safepal

# Installed or not

const isSafePalInstalled = window.safepal;
1

https://github.com/solana-labs/wallet-adapter/tree/master/packages/wallets

# Provider

function getProvider() {
  const provider = window.safepal;
  if (!provider) {
    return window.open('https://www.safepal.com/download?product=2');
    throw  `Please guide users to download from our official website`
  }
  return provider;
}
1
2
3
4
5
6
7
8

# connect(request authorization to connect)

try {
  await window.safepal.connect();
  const publicKey = await window.safepal.getAccount();
  window.safepal.publicKey.toString(); // Once the web application is connected to SafePal,
} catch {
  alert('connected error');
}
1
2
3
4
5
6
7

# connected

window.safepal.connected;
const publicKey = await window.safepal.getAccount();
window.safepal.publicKey.toString(); // Once the web application is connected to SafePal
1
2
3

# signMessage

//string
window.safepal.signMessage(
  '020006106e655af38ff7324bbf1d4e16b06084763269b9'
);
// uint8Array
const message = `You can use uint8array to verify`;
const encodedMessage = new TextEncoder().encode(message);
const signedMessage = await window.safepal.signMessage(encodedMessage);
const nacl = require('tweetnacl');
const { PublicKey } = require('@solana/web3.js');
// nacl.sign.detached.verify(encodedMessage, signedMessage, publicKey)
nacl.sign.detached.verify(
  encodedMessage,
  signedMessage,
  new PublicKey(address).toBytes()
);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

# Event listeners

used eventemitter3 (opens new window)

window.safepal.on('connect', () => console.log('connected!'));
1

# sendTransaction

You can refer to the following demo : simple demo (opens new window) web3 demo (opens new window) Token demo (opens new window)

# 2、Solana Wallet Adapter

Another quick and easy way to get up and running with SafePal is via the Solana Wallet Adapter (opens new window) package. The wallet adapter is a set of modular TypeScript components that allow developers to easily integrate multiple Solana wallets into their applications. This package includes starter files, setup and usage instructions, and a live demo showcasing multiple UI frameworks.