Vessel 0.2.0 - Interact with Steem securely from any website

I'm incredibly excited today to release the next version of Vessel - which features a brand new way to interact with the Steem blockchain from anywhere on the internet. It is my hope that this effort helps unlocks the potential of the Steem blockchain by empowering developers and content creators with tools to interact with their audiences anywhere.

<p dir="auto">A bit of background on Vessel before going too much further: <h2>What is Vessel? <p dir="auto">Vessel is a desktop wallet for the Steem blockchain, which can be downloaded and run on your computer. Vessel is free to use and open source, and is designed to be a way to help secure your account. While using Vessel, your keys/password never leave the app, transactions are signed locally, then broadcast to the blockchain much like any other downloadable cryptocurrency wallet. <p dir="auto">With Vessel, you no longer need to trust your web browser while performing secure actions with your account. <h2>Download Vessel <p dir="auto">Vessel is still <strong><em>beta software and it's recommended that you treat it as such. Before committing irreversible actions on your account (such as large outgoing transfers), please test with smaller amounts to ensure it's working properly and you understand your actions. If you send all your SBD to someone - there's no reversing that. <p dir="auto"><a href="https://github.com/aaroncox/vessel/releases/tag/v0.2.0" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Download available on github for macOS, Windows and Linux. <ul> <li><strong>Releases<span>: <a href="https://github.com/aaroncox/vessel/releases" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">https://github.com/aaroncox/vessel/releases <li><strong>chainBB Forums<span>: <a href="https://chainbb.com/f/vessel" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">https://chainbb.com/f/vessel <li><strong>Bug Reports<span>: <a href="https://github.com/aaroncox/vessel/issues" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">https://github.com/aaroncox/vessel/issues <li><strong>Source Code<span>: <a href="https://github.com/aaroncox/vessel" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">https://github.com/aaroncox/vessel <h2>What's new in 0.2.0 <p dir="auto">A single, infinitely usable feature: <ul> <li><strong>Operation creation through a URI scheme <p dir="auto">That's probably gibberish to 99% of you - so I'll try to explain what a URI Scheme is, then give some examples of how we can use it. <p dir="auto">Have you ever clicked on a link that opened your email client? These types of links are used everywhere: on contact pages, in email signatures, or anywhere you want someone to be able to contact you (a way of interacting). These links are a special type of link that uses a URI scheme (the <code>mailto:// scheme in this case) which allows your web browser to interact with your default mail client. <p dir="auto">That's the purpose of a URI scheme - to launch an app under your control as a way to interact with content on a website. <p dir="auto">This new version of Vessel implements this same idea and introduces an early draft of the <code>steem:// scheme - except instead of opening your email client, this scheme opens Vessel (or any other future Steem application). It also does way more than just opening Vessel - it can prompt the user to interact with the blockchain in a specific way. <p dir="auto">Let's look at a couple examples - but first, you really should have Vessel 0.2.0 installed for this. You can <a href="https://github.com/aaroncox/vessel/releases/tag/v0.2.0" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">download it here. If you have privacy/security/trust concerns with Vessel, I'd recommend you just import a posting key from one of your accounts. <p dir="auto">Ready? This post just got interactive. <h4>Example #1 - Voting on a post <p dir="auto">By using the <code>steem:// scheme, anyone can create links that actually interact with the Steem blockchain: <p dir="auto"><a href="https://tinyurl.com/ycfqmdsj" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Vote Button (or <a href="https://aaroncox.github.io/opbuilder/sign/tx/W1sidm90ZSIseyJhdXRob3IiOiJqZXN0YSIsInBlcm1saW5rIjoib3BidWlsZGVyLWEtdGlueS10b29sLXRvLWhlbHAtYnVpbGQtYW5kLXVuZGVyc3RhbmQtc3RlZW0tb3BzIiwidm90ZXIiOiIiLCJ3ZWlnaHQiOjEwMDAwfV1d#eyJ3ZWlnaHQiOnsicHJvbXB0Ijp0cnVlLCJ0eXBlIjoicGVyY2VudCIsImxhYmVsIjoiVm90ZSBQZXJjZW50YWdlIn19" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">view in opbuilder) <pre><code><a href='steem://sign/tx/W1sidm90ZSIseyJhdXRob3IiOiJqZXN0YSIsInBlcm1saW5rIjoib3BidWlsZGVyLWEtdGlueS10b29sLXRvLWhlbHAtYnVpbGQtYW5kLXVuZGVyc3RhbmQtc3RlZW0tb3BzIiwidm90ZXIiOiIiLCJ3ZWlnaHQiOjEwMDAwfV1d#eyJ3ZWlnaHQiOnsicHJvbXB0Ijp0cnVlLCJ0eXBlIjoicGVyY2VudCIsImxhYmVsIjoiVm90ZSBQZXJjZW50YWdlIn19'> Vote Button </a> <p dir="auto">That link was created specifically to prompt for a vote on <a href="/steemdev/@jesta/opbuilder-a-tiny-tool-to-help-build-and-understand-steem-ops">a post I wrote earlier this week about opbuilder (a developer tool to support this URI scheme). When clicked, Vessel will launch a small window to confirm the action and sometimes give values to modify (the percent in this case). <p dir="auto"><img src="https://images.hive.blog/768x0/https://steemdb.com/vessel/42.png" alt="https://steemdb.com/vessel/42.png" srcset="https://images.hive.blog/768x0/https://steemdb.com/vessel/42.png 1x, https://images.hive.blog/1536x0/https://steemdb.com/vessel/42.png 2x" /> <p dir="auto">When the window appears - nothing immediately happens. You have to choose to proceed with the transaction by selecting which account you'd like to use and clicking the button at the bottom. If you have a wallet password - you'll also be prompted for that. <p dir="auto">When you are ready to confirm the vote, hitting the button at the bottom will sign the transaction and broadcast it to the blockchain - without your keys ever leaving your wallet or being shared with anyone. The window will then close and you can continue doing whatever you were doing. <p dir="auto">Voting was probably one of the most simple examples I could provide - so let's move into some other examples. <h4>Example #2 - Vote for Witness <p dir="auto">A lot of people line the bottom of their posts with signatures related to the author's witness campaign, soliciting votes. Using the URI scheme and Vessel, you can now do things like this: <p dir="auto"><a href="https://tinyurl.com/ydfz54sk" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Vote @jesta as Witness (using Vessel) (<a href="https://aaroncox.github.io/opbuilder/sign/tx/W1siYWNjb3VudF93aXRuZXNzX3ZvdGUiLHsiYWNjb3VudCI6IiIsImFwcHJvdmUiOnRydWUsIndpdG5lc3MiOiJqZXN0YSJ9XV0=#e30=" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">view in opbuilder) <p dir="auto">That link will initiate a vote for me as a witness. Vessel will launch and display a form that allows you to select your account, and then broadcast the witness vote. No more having to step-by-step provide instructions, a content or website creator can craft operations they are looking to encourage other users to perform. <p dir="auto"><img src="https://images.hive.blog/768x0/https://steemdb.com/vessel/39.png" alt="https://steemdb.com/vessel/39.png" srcset="https://images.hive.blog/768x0/https://steemdb.com/vessel/39.png 1x, https://images.hive.blog/1536x0/https://steemdb.com/vessel/39.png 2x" /> <h4>Example #3 - Requesting a Delegation <p dir="auto">This example could be useful to services like Utopian, where you can delegate to their account in order to support the efforts of it's community. Instead of writing a post providing instructions on what to do - you can now simply just provide a link. <p dir="auto"><span>Here's an example link that initiates a delegation from you to <a href="/@utopian-io">@utopian-io, and prompts you to select an account and enter the amount of SP (or VESTS). <p dir="auto"><a href="https://tinyurl.com/y8s4tn38" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Delegate SP to @utopian-io (via Vessel) (<a href="https://aaroncox.github.io/opbuilder/sign/tx/W1siZGVsZWdhdGVfdmVzdGluZ19zaGFyZXMiLHsiZGVsZWdhdG9yIjoiIiwiZGVsZWdhdGVlIjoidXRvcGlhbi1pbyIsInZlc3Rpbmdfc2hhcmVzIjoiIn1dXQ==#eyJ2ZXN0aW5nX3NoYXJlcyI6eyJwcm9tcHQiOnRydWUsInR5cGUiOiJ2ZXN0cyIsImxhYmVsIjoiQW1vdW50IHRvIERlbGVnYXRlIn19" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">view in opbuilder) <p dir="auto"><img src="https://images.hive.blog/768x0/https://steemdb.com/vessel/40.png" alt="https://steemdb.com/vessel/40.png" srcset="https://images.hive.blog/768x0/https://steemdb.com/vessel/40.png 1x, https://images.hive.blog/1536x0/https://steemdb.com/vessel/40.png 2x" /> <h4>Example #4 - Donation Form <p dir="auto">Vessel also supports many parameters that lets you customize the operations slightly to fit special needs. If I were writing a post asking for donations to support the development of Vessel, I could do so with a link: <p dir="auto"><a href="https://tinyurl.com/y9jyjkq9" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Donate to support Vessel (with Vessel) (<a href="https://aaroncox.github.io/opbuilder/sign/tx/W1sidHJhbnNmZXIiLHsiYW1vdW50IjoiNS4wMDAgU1RFRU0iLCJmcm9tIjoiIiwibWVtbyI6IiIsInRvIjoidmVzc2VsIn1dXQ==#eyJhbW91bnQiOnsicHJvbXB0Ijp0cnVlLCJ0eXBlIjoiYXNzZXQiLCJsYWJlbCI6IkRvbmF0aW9uIn0sIm1lbW8iOnsicHJvbXB0Ijp0cnVlLCJ0eXBlIjoidGV4dCIsImxhYmVsIjoiTWVzc2FnZSAoT3B0aW9uYWwpIn0sInRvIjp7InByb21wdCI6ZmFsc2UsInR5cGUiOiJ0ZXh0In19" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">opbuilder) <p dir="auto"><img src="https://images.hive.blog/768x0/https://steemdb.com/vessel/41.png" alt="https://steemdb.com/vessel/41.png" srcset="https://images.hive.blog/768x0/https://steemdb.com/vessel/41.png 1x, https://images.hive.blog/1536x0/https://steemdb.com/vessel/41.png 2x" /> <p dir="auto">This link initiates a transfer and also customizes the display a bit. <ul> <li>The "amount" field has a custom label of "Donation" and a special input selector allowing them to choose the amount of STEEM or SBD to send. <li>The "amount" field has a suggested amount that users can change. <li>The "memo" field on the transfer has a custom label, prompting the user for a Message along with their donation. <p dir="auto">All the user has to do is pick an amount, decide if they want to include a message, choose the account to use and hit the button at the bottom. It could be even more simple using multiple links with individual pre-filled denominations. <p dir="auto">Regardless of how it's customized - you'll always be able to expand and view the raw JSON operations to see exactly what's happening under the hood. <h3>The examples could go on and on... <p dir="auto">The possibilities for this are endless. Anything that can be done on Steem can also theoretically be done utilizing this method. <p dir="auto">I built this specifically because I needed a secure way of interacting with the forum owners on chainBB. I really don't want to encourage users to enter their master password/active keys on my website - and I want something more secure than a user logged in with a posting key. <p dir="auto">Instead of just building something specifically for chainBB - I choose to build a robust enough system into Vessel to allow any project the means to securely interact with their audience, without having to entrust sensitive information with each other. <p dir="auto">The next version of chainBB will let forum owners configure moderation teams, beneficiaries, and other more security-sensitive options directly through Vessel. <p dir="auto">What this will be used for in the future is anyone's guess! <h3>What this means for 3rd Party websites and their ability to utilize Steem <p dir="auto">The important thing to realize is that anyone can use these links on <strong>any website or app that supports custom HTML. If you were to copy and paste any of the examples above onto your Wordpress blog or into a reddit post - they would just work. <p dir="auto">This furthers the ability for 3rd party websites to quickly and transparently integrate the features of Steem (and upcoming SMTs) into their own websites, services, and communities. <p dir="auto">To assist with this, I'm working on what I'm calling <a href="https://aaroncox.github.io/opbuilder/" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">opbuilder, a tool that can create operations and then provide the JSON, a <code>steem:// URI, or a SteemConnect link. All of the example links above were created using the opbuilder (and then run through a URL shortener, more on that below). <h3>Work in Progress <p dir="auto">There's a lot still to be done with all of this, including use cases, the UI, security and tools to help integrate this into any website. <p dir="auto">Almost all of the interactions created using this scheme will use a generic UI like the example shown for witness voting (#2). The <code>transfer, <code>vote, and <code>delegate_vesting_shares operations have custom UIs that look a bit nicer. Over time, these interfaces will be refined and improved as more use cases are discovered. <p dir="auto">There's also no feedback when an operation is complete. This has always been a problem with Vessel unfortunately since it doesn't show your action history anywhere. For the time being, I'd recommend viewing your account on steemdb.com or steemd.com if you're looking for account/action history. <h3>URI Scheme - Technicals <p dir="auto">These <code>steem://<span> URIs aren't incredibly complicated and I'd like to thank <a href="/@fabien">@fabien for sharing the idea of using the base64 strings. Currently only one path is supported: <pre><code>steem://sign/tx/{base64_encoded_operation}#{base64_encoded_application_parameters} <p dir="auto">The <code>base64_encoded_operation string after <code>steem://sign/tx is simply a base64 encoded string of the JSON operations to perform. The URL can also contain an optional hash, illustrated above as <code>base64_encoded_application_parameters. This is additional data that the application you're communicating with can use to further interact with the operations. <p dir="auto">In example #3 (the delegation prompt), here's a breakdown of how the URI works: <pre><code>Scheme: steem:// Host: sign (the action to perform) Path: /{type}/{opdata}#{appdata} Full URL: steem://sign/tx/W1siZGVsZWdhdGVfdmVzdGluZ19zaGFyZXMiLHsiZGVsZWdhdG9yIjoiIiwiZGVsZWdhdGVlIjoidXRvcGlhbi1pbyIsInZlc3Rpbmdfc2hhcmVzIjoiIn1dXQ==#eyJ2ZXN0aW5nX3NoYXJlcyI6eyJwcm9tcHQiOnRydWUsInR5cGUiOiJ2ZXN0cyIsImxhYmVsIjoiQW1vdW50IHRvIERlbGVnYXRlIn19 Base64 Encoded Operations: W1siZGVsZWdhdGVfdmVzdGluZ19zaGFyZXMiLHsiZGVsZWdhdG9yIjoiIiwiZGVsZWdhdGVlIjoidXRvcGlhbi1pbyIsInZlc3Rpbmdfc2hhcmVzIjoiIn1dXQ== Base64 Encoded Application Parameters: eyJ2ZXN0aW5nX3NoYXJlcyI6eyJwcm9tcHQiOnRydWUsInR5cGUiOiJ2ZXN0cyIsImxhYmVsIjoiQW1vdW50IHRvIERlbGVnYXRlIn19 <p dir="auto">If you were to decode these two strings, you'll see the operation and it's application parameters: <p dir="auto"><strong>Operation JSON: <pre><code>[ [ "delegate_vesting_shares", { "delegator": "", "delegatee": "utopian-io", "vesting_shares": "" } ] ] <p dir="auto"><strong>Application JSON: <pre><code>{ "vesting_shares": { "prompt": true, "type": "vests", "label": "Amount to Delegate" } } <p dir="auto">Vessel uses the Operation JSON as a template to craft an initial operation and then the Application JSON to enhance the UI to prompt users for interaction with the operation template. <h3>Bugs <p dir="auto">This is the first release in the 0.2.x series of Vessel and some of these new actions are going to have problems. Any transaction issues that occur while trying to broadcast will appear in a red box above the "Sign + Broadcast" button. <p dir="auto">Currently there are known bugs with: <ul> <li>Signing anything that requires <code>auths (like <code>custom_json). <li>JSON encoding some fields. <li>No interface for editing/templating multiple operations. <li>Signing a transaction using <code>account_auths - you need the key currently. <p dir="auto">Throughout the 0.2.x series of releases I'll be improving and addressing these as it relates to whatever projects start integrating these features. My first integration personally will be with chainBB, so the <code>custom_json operation is likely to be improved in 0.2.1. I'd invite other developers to join the effort and help improve it where they need it. <p dir="auto">If you have a bug to report, please file it on github. Bugs only though, as for discussion... <h3>Questions? Want to talk about using this? <p dir="auto"><span><a href="https://chainbb.com/f/vessel" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">https://chainbb.com/f/vessel <p dir="auto">I'm monitoring the above /f/vessel, a chainBB forum, for chatter related to Vessel. If you have questions/comments/concerns/whatever, I'd invite you to join the conversation there. chainBB is a discussion forum (and one of my other projects) so I'm going to drag you all there to use it :) <h3>steemit.com support for the <code>steem:// URI scheme <p dir="auto">At the time of this post - steemit.com filters out links that use the <code>steem:// scheme and only allows <code>http:// or <code>https://. I've <a href="https://github.com/steemit/condenser/pull/2132" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">created a pull request on steemit/condenser that alters the sanitizers to allow for these special links and am awaiting on feedback. Hopefully this pull request will get accepted and deployed to steemit.com to allow everyone to use this links. <p dir="auto"><a href="https://chainbb.com" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">chainBB.com has already been patched to allow support for this. <p dir="auto"><a href="https://tinyurl.com/" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">tinyurl.com to convert the <code>steem:// links into <code>https:// links before posting them. They redirect to the appropriate protocol and allow these links to work within a post on steemit.com.<span>In the mean time - clever <a href="/@netuoso">@netuoso recommended a workaround that this post uses to allow usage of these special links. You just have to use a URL shortener like <p dir="auto">It's a bit of a pain to have to jump through an extra hoop - but at least it's immediately functional. <h3>Vessel in 2018 <p dir="auto">I have a lot of goals for Vessel in 2018, here's a high level overview: <ul> <li><strong>Complete rebranding with new name. As much as I hate the idea, and love the name Vessel, there's actually a company out there that makes physical wallets named Vessel. I had no idea until very recently. Instead of competing with them on search engines and potentially trademarks, it will be easier to just rename the project and rebrand it. I've been entertaining ideas, but I have no idea what the new name will be or how it will be rebranded. <li><strong>Non-beta release product: Along with the rebrand, it's my goal to have a non-beta product released in 2018 of this wallet. This may also include a rewrite of the core of the wallet to accommodate better security and account management. <li><strong>More community development<span>: I don't want this to be a <a href="/@jesta">@jesta project, I want this to be a community effort. To that end - I'll be trying to work with any developer that's interested to improve this project. <a href="/@netuoso">@netuoso has been a great help, and as more developers join the effort, we'll be able to release higher quality code more regularly. <p dir="auto">These features and more will be developed as time permits. As a free/non-revenue generating project, Vessel has no full time developers and all development is done by volunteers. Features are created as free time becomes available and/or a revenue generating product creates a demand for it. <p dir="auto">Thanks to everyone who has given it a shot in 2017 and supported it in some way!