Comment on page
📱
Othent Mobile
https://github.com/Othent/othent-mobile
Othent Mobile is a Safari Web Extension, that allows for an easy & fast integration of Othent on mobile web apps.
Othent uses a pop-up window for the login flow, so users need to disable pop-up blocker in
Settings > Safari.Once installed, any user can enable the Extension on any website:
- 1.Open Safari
Safari
- 2.Tap on the AA icon in the Safari URL bar
Safari URL Bar
- 3.Tap on "Manage Extensions"
Manage Extensions
- 4.Enable "Othent Mobile"
Enable Othent
After enabling the extension, users can review permissions for individual sites:
- 1.iOS shows a "Review Permissions" popup
Review Permissions
- 2.Or users can directly open the extension
Open Othent Popup
- 3.Select the duration for the permission to grant
Permissions
After these steps, every website where the extension has been enabled will have a new injected API into the
window object which can be used by your web apps.To use Othent in your application, you don't need to integrate or learn how the Othent Injected API works. Using arweave-js, you can easily sign a transaction through Othent in the background:
// create Arweave transaction
const tx = await arweave.createTransaction({
/* tx options */
});
// sign transaction
await arweave.transactions.sign(tx);
// TODO: handle signed transaction
When signing a transaction through arweave-js, you'll need to omit the second argument of the sign() function, or set it to "use_wallet". This will let the package know to use the extension in the background to sign the transaction.
Once the transaction is signed, you can safely post it to the network
The injected API in
window object can be used from:window.arweaveWallet: This API provides you several methods compatible with other Arweave Wallets such as ArConnect, plus the ones from the Othent 🥪 SDK.
Your web app can listen to know when the API has been safely injected by adding a simple listener:
addEventListener("arweaveWalletLoaded", () => {
console.log(`You are using the ${window.arweaveWallet.walletName} wallet.`);
console.log(`Wallet version is ${window.arweaveWallet.walletVersion}`);
});
Once this event has been emitted by Othent Mobile you can start using the API methods safely. Here's an example login after the API has been injected:s
addEventListener("arweaveWalletLoaded", () => {
window.arweaveWallet.logIn().then(console.log);
});
Last modified 2mo ago