pwntr.com

How to add a QR code to your website - or anywhere! Bitcoin donation button example

2016-07-17T19:36:00+02:00

QR codes. Yes, those little rascals you’ve seen around before. Let’s create one to serve as a Bitcoin donation button for your website.

Ever seen something like this guy?

In this little tutorial we’ll create the QR code image file via command line and add a donation button along with the QR code to a website. You’ll learn two things:

Creating QR codes with any content and size straight from our beloved command line
Some bitcoin related query string syntax to open a wallet when scanning a QR code

Alright then, let’s get right to it.

Requirements

Get yourself qrencode from Kentaro Fukuchi (link). For the sake of simplicity, I got myself a local copy via brew install qrencode on my MacBook. You don’t know brew? Shame on you, get this essential piece of package managing software for your mac right here. It’s fantastic, don’t think twice.

Don’t want to run it on a mac? Good news: pretty much any distro that doesn’t smell already should ship it. Try sudo apt-get install qrencode (Debian, Ubuntu) or sudo yum install qrencode (RHEL, CentOS).

You’re a Windows user? Try compiling qrencode using cygwin, or use some other GUI QR generator - sorry, out of scope here.

Creating the QR code

Finally, you have qrencode installed. Assuming you have a terminal open already, type:

qrencode -o helloworld.png -s 3 -m 0 'Yeay! It works, hello world!'

This will create our image file, helloworld.png, with 3 pixels per block (-s 3) and no margin pixels (-m 0) and the content Yeay! It works, hello world!. Yep, that’s the image from the preface section.

Go ahead, grab a phone and scan the code. All it will display is whatever you set to be the content. This opens endless possibilities. You can include links, raw data, or just a ton of characters (by default ~ 2950 @ 8 bits/char, see here).

qrencode comes with a nice man page, you should check it out for more fine tuning options (man qrencode).

TO include a URL in you QR code, just set the content to a URL. Like this:

qrencode -o url-qr-example.png -s 3 -m 0 'https://pwntr.com'

Resulting in this:

Scanning this would usually open a browser, depending on the default behavior of your scanner app.

Well this was fun. Let’s create a QR code that’s a tad bit more useful in the next section.

Creating a bitcoin donation button

Ok, we now know how to quickly create a QR code. But how can we open someone’s wallet (pun intended) when they scan the code? Simple.

Query string shenanigans

We set the content to a specially formatted standard query string, like this one:

bitcoin:3Qdb9iCMfzppCw4nME1Fst7Dsk7DmyuT4j?label=pwntr.com%20says%20thanks!

But slowly. What does this query string contain?

bitcoin:: This precedes your wallet’s public address, specifying the protocol to use when evaluating the QR content. It’s agreed upon that bitcoin: opens / is handled by the user’s default wallet application (both on desktop and mobile).
3Qdb9iCMfzppCw4nME1Fst7Dsk7DmyuT4j: This is my wallet’s public bitcoin address. Replace it with your own (you can skip this step, but that would mean more money for me ;)…)
?label=pwntr.com%20says%20thanks!: You might’ve guessed it. This is a reference that you want this transaction to be known by. The ? is the delimiter for the query string’s attributes that follow, in this case, just label. %20 is just a URI encoded space character, so that the message reads pwntr.com says thanks!.

You could also add amount in the string to specify a preset amount for the transaction. Only the first parameter in the query string after your public bitcoin address is delimited with a ?. All subsequent parameters are delimited by an ampersand (&param). In case of amount, this would look like this: &amount=20.

Some param that is used and implemented less frequently is message. Analogous to the amount example from above, you could put it in with &message=donation. In my experiments, this breaks some wallet clients as they don’t handle this extra param and hiccup.

More params are discussed RFC-like on bitcoins gihub pages, like this one.

Putting it all together

Now that we know how to create QR codes and how to craft nifty query strings with bitcoin addresses, nothing is holding us back any longer. Type:

qrencode -o bitcoin-qr-example.png -s 3 -m 0 'bitcoin:3Qdb9iCMfzppCw4nME1Fst7Dsk7DmyuT4j?label=pwntr.com%20says%20thanks!'

You’ll get this:

Once you scanned the code, the scanner will open your default wallet application, asking for the amount to donate (or to transfer, more generally speaking).

A simple link or button to make your life complete

Alright, we have the perfect QR code now. All that’s left is to insert it into our website or print it somewhere else. For the website case, just adding the image inside an anchor tag (<a></a>) would already do the trick. As you can see, below every article I added a little bitcoin logo along the QR code we just created, inside said anchor tag.

Example

And here it is, just add something like this anywhere you’d like your donation button to appear. People can then either click or scan it, depending on which device their wallet resides. And for anyone who wants to read it off manually, you can have the public bitcoin address visible in plain sight:

<a href="bitcoin:3Qdb9iCMfzppCw4nME1Fst7Dsk7DmyuT4j?label=pwntr.com%20says%20thanks!">
    <img src="img/bitcoin_logo.png">
    <img src="img/bitcoin_qr.png">
    <br><span>3Qdb9iCMfzppCw4nME1Fst7Dsk7DmyuT4j</span>
</a>

Results in something you see below the articles on this blog. Neat.

Closing thoughts

That wasn’t too hard, was it? I hope you liked this little tutorial. If you have any questions, please leave a comment.

In case you’d like to show your appreciation with some cold hard cash, go ahead, the public address in the logo above (and below this article) is live and awaiting any gracious donations :).

Microsoft Surface: why I might switch (update: didn’t switch)

2012-08-17T05:23:25+02:00

Well, it turns out some people are actually reading my post about Time Machine backups. So let’s create some more content on this nice little blog.

Today I finally watched the full Microsoft keynote about it’s new wunder-device, the Surface tablet PC and even found time to drop a comment or two. I really like the fact that it’s a real alternative to an actual PC since it’s more powerful than a regular tablet and it runs any x86 software you throw at it. What sold me in particular was the demo they used running Adobe Lightroom. On the hardware side the keyboard covers look very nice, the software itself seemed a bit buggy yet (finger swiping sometimes didn’t work, as well as the palm lock when using a stylus). At this early stage this is acceptable and no biggie, but only because Microsoft obviously found itself comfortable in its new role: being the underdog and copycat. Copying the magnet lock for the cover and some design aspects, they yet enriched the design with useful elements like the stand and paid great attention to detail. They stress that out in the video more than just once ;)…

Let’s take a look at the things I currently do with my beloved and portable MacBook Air (2011, core i7):

Surf the web
Read and write a ton of emails
Stay in contact with friends and family using Skype, facebook, ...
Edit photos while on road trips worldwide
Watch HD movies and TV series on the plane
Take notes during classes
Read PDFs and eBooks
Do some programming whenever necessary
Control my servers from wherever I am
Transfer files from and to friends and family
Support and debug on site
Do some work (see below)

An iPad could do some these things, but not all or only too complicated to fiddle around with. Plus it’s expensive, limited on storage, has no USB ports to extend storage or functionality and is too slow to do real RAW photo editing on the go. It works great as a device to consume media and even produce it in a very limited way, but for some serious business you need more flexibility. And business will be what will drive sales for the Microsoft Surface. Imagine a day at work, for me it has to do with accessing the companies’ network (sometimes over a wired connection), handling and editing spreadsheets and word files, creating presentations and working on papers to solve or illustrate problems and processes. It would be impossible or at least very cumbersome to do most of these tasks on an iPad or any other other tablet available right now (including the Nexus 7 I was eyeballing lately).

This is the perfect niche for a “new” device like the Surface. It aims at productivity and flexibility and is the first device that actually fulfills the proclaimed status of being in the post PC era. You can’t just drop everything you’ve been doing for the last decades and limit yourself to mostly consuming (at least not in most jobs and life situations). For me, post PC means a transition of handling regular PCs and creating new ways to interact with those devices, like through the use of touch screens and even a stylus for some situations. Steve jobs hated the idea of the stylus, and for most tasks it’s truly obsolete these days. But the classroom environment on campuses worldwide makes using one on a tablet a nice way to take notes in school books, papers or whatever. I can also see myself doodling on it during a presentation. It’s just intuitive like scribbling with a pen into your paper book, you don’t have to take that extra step of having to process how to add a note to whatever document you’re editing right now using a keyboard and a mouse. And it’s way more precise than your clunky finger tip.

From a product perspective, Apple showed the world a couple of times that for some categories the sealed “we make the whole banana” process of product development and manufacturing, including hardware and software, just works best. For that reason I’m a faithful mac user for over 6 years now. You just open your MacBook and it works. Throughout the years I never had any really bad bugs or quirks that destroyed the work I was doing or did. Updates, hardware, software, no problem. The only thing I was missing was some real processing power on the graphics side. That’s why I opted in some months ago and built a small AMD and Nvidia workstation, powered by Windows 7. In combination with a SSD this setup is a blessing when it comes to photo editing and sorting.

So, depending on the final price of the most powerful Surface tablet with x86 hardware, I might be adopting the Microsoft approach to mobile computing and buy it. That said, my MacBook Air will have to go then. And I’m not yet comfortable with that thought… Let’s see what the future brings.

Don’t miss to check out the keynote:

Easy Mac OS X (Mountain) Lion and Mavericks 10.7, 10.8 and 10.9 Time Machine backup using an Ubuntu Linux server [11.10, 12.04 LTS and up]

2012-03-03T22:50:47+01:00

Maybe you always wanted to have an Apple Time Capsule for easy backup management of your Macs. One of the drawbacks that comes with a device like that is its price. You could also use any Mac for it, but those are also expensive and most likely don’t wanna be hidden in a dusty closet. If you have an old PC somewhere that can run Linux (or BSD or any other UNIX) you already have everything you need to build a cheap, reliable Time Capsule yourself. Let’s get started!

What you’ll need:

A PC running Linux (or BSD etc.) as the server
A Mac (OS X 10.5 and above) that likes to use the Time Machine backup feature
A hard drive or spare disk space on your server that is at least as big as the Mac’s hard drive
A fast network to make things smooth
The latest version of Netatalk (>= v. 2.2.0)

This guide will use Ubuntu Linux as an example as I tested it with Ubuntu Linux 11.10 and 12.04 LTS. The only critical part is that your Netatalk version has to be >= 2.2.0 beta 4, else it won’t work with Lion. Aside from that pre-requisite you can use any Linux/UNIX/BSD/… distribution you want. On the client side, every version since Mac OS X Leopard (10.5) will work. And yes, that includes Lion, Mountain Lion and the newest Mavericks!

[Step 0. Optional, but recommended]

If you are using Ubuntu 11.10 or earlier, add this ppa repository to easily install and update Netatalk to one of the most current versions:

sudo add-apt-repository ppa:jstrunk-math/ppa

If you tried to set up a Time Machine / Netatalk installation before and didn’t succeed, completely remove Netatalk and all of its configuration files before you proceed:

sudo apt-get remove --purge netatalk

There is also no need for any additional Avahi setup since Netatalk 2.2.x comes with built-in Avahi/Bonjour/Zeroconf capabilities in case you were wondering.

Step 1: Install Netatalk

sudo apt-get install netatalk

Ok, first step: done!

Step 2: Configure the afpd server

Edit /etc/netatalk/afpd.conf with your favorite editor and add the following line at the end (comment out every other line that might be active):

- -tcp -noddp -uamlist uams_dhx.so,uams_dhx2_passwd.so -nosavepassword

This will define the afpd server (Netatalk).

Due to a bug in Ubuntu 11.10’s Netatalk version you have to use uams_dhx2_passwd.so instead of the usual uams_dhx2.so as the authentication module. If your are using Ubuntu 12.04 or later you can use either module (my reader Brandon mentioned that uams_dhx2_passwd.so might still be needed in 12.10).

Next make sure your /etc/default/netatalk file shows CNID_METAD_RUN=yes. This will ensure that all the metadata that is needed by OS X is handled and saved by an extra daemon on the side, too.

Step 3: Create and prepare the Time Machine backup locations

First of all you should decide which directories you would like to share with your Macs and where you want to save your Time Machine backups. And which user on your server shall be in charge of which backup and directory etc. Here’s an example setup with one user called username (how creative):

cd /home/username/
mkdir tm_backup

Creating the backup directory in his home directory ensures that he has the necessary rights to read and write in it. If you want to keep the backups somewhere else, say on an external hard drive, make sure that the user has the correct rights to access it fully! Here’s another example:

cd /media/backup_hdd/
sudo mkdir tm_backup
sudo chown -R username:username tm_backup

If you want be really fancy and have a single directory for all backups of all your Macs and users, create a group for the Time Machine users:

sudo groupadd tmusers
sudo usermod -a -G tmusers username
cd /media/backup_hdd/
sudo mkdir tm_backup
sudo chown -R username:tmusers tm_backup
sudo chmod 770 -R tm_backup

This will add a new group called tmusers to your systems, add the existing user username to it, create the backup directory and ensure that the owner username and the group tmusers have full access to it. However, it is also possible to skip this step and just use a single user on the server for all the Time Machine backups. Always keep in mind that the backups might be accessible by the other users if they’re all saved to a common directory. Creating a directory and a share for each user separately is the safest method.

Step 4: Configure the shared directory in Netatalk’s config

Now that we have the actual directory set up in the file system we can add the following line to the /etc/netatalk/AppleVolumes.default file:

/media/backup_hdd/tm_backup "Backup for username" allow:username cnidscheme:dbd volsizelimit:200000 options:usedots,upriv,tm

Adjust the location of the directory and the username to your needs. The example above also limits the size shown to OS X as 200 GB (the number is given in MiB, so it’s 200,000 times 1024 in the real world). Also note that the tm option is only option separating a Time Machine capable directory from a regular afp share.

Add a line like this for every user and directory that is supposed to make Time Machine backups. If you want to allow a whole group of users to access a directory for the purpose of Time Machine backups, use this line and make sure to edit the @tmusers option to be @yourgroupname (notice the @ in front of the group name).

/media/backup_hdd/tm_backup "Backup for all users" allow:@tmusers cnidscheme:dbd volsizelimit:1000000 options:usedots,upriv,tm

I made an adjustment to the volsizelimit option since 200 GB might not be enough to backup multiple Macs.

I also added the following line at the beginning of my /etc/netatalk/AppleVolumes.default file:

:DEFAULT: cnidscheme:dbd options:upriv,usedots

This adds some useful default settings when handling more than just a backup share. Just fyi.

Restart the Netatalk daemon to make sure it uses the newly adjusted configurations:

sudo service netatalk restart

We are now done configuring the server. Congratulations! Continue on the client side.

Step 5: Configure the Macs to use the server as a Time Machine volume

Open up a terminal on your Mac (press Command + Space, then enter Terminal and hit Enter) and allow unsupported network volumes to be used as a Time Machine backup destination:

defaults write com.apple.systempreferences TMShowUnsupportedNetworkVolumes 1

Note: run this command as the user that is going to actually make the backup, don’t put sudo in front of the command!

That is all for the command line work. From here on we can use the Mac OS X GUI to continue setting up the Time Machine backup.

Before you do anything else, restart your Mac. Trust me on that one, for some reason it didn’t work for me until I restarted my Mac. Save yourself some time and trouble.

After a fresh boot open up Finder and press Command + K to bring up the “Connect to Server” dialog.

Enter afp://ip_address_of_your_server, press Enter and select the according share from the list. Fill in username and password from the user on the server (not the one on the Mac) and see if you have access to the share. If everything works well, continue with the Time Machine preferences.

In the system preferences on your Mac, select Time Machine and click on “Select Disk…”

Select your share from the list, edit the other options like excluded directories and automatic backups to your liking and enjoy this cheap and reliable Time Machine solution! The first backup might take quite some time, depending on your network and hard drive speed. All the following backups will be incremental and a lot faster.

Bonus: you don’t even have to manually connect to the server share before a backup. Time Machine will let its magic happen and auto-mount / un-mount the share whenever it is needed. Peace of mind in a box.

P.S.: You can even use this share and setup to easily restore your Mac from scratch after it has crashed or caught fire.

Here are some useful in-depth links for further reading:

afpd.conf manpage

AppleVolumes.default manpage

Hello world!

2011-12-26T08:43:53+01:00

Welcome to my nice little website! I hope you enjoy my tutorials and random thoughts. Please feel free to leave a comment if you have any questions. I’ll be glad to help.