Category Archives: Tips

Detecting IPv6 with JS and PHP

0 minutes, 36 seconds

A friend of mine wanted a way to know if visitors to her site were coming from an IPv6 address. To do this, you would run some PHP to output a JS variable with global scope:

// thanks to:
// https://plugins.svn.wordpress.org/ipv6detector
$ip =  $_SERVER['REMOTE_ADDR'];
if (substr_count($ip, ":") > 0 && substr_count($ip, ".") == 0) {
        $js = 'var is6 = true';
} else {
        $js = 'var is6 = false';
}
print "<script>$js</script>";

And then to give the user a sense of excitement, animate showing them if they are v6 or v4. You’ll need jQuery for this, of course:

<div id="ipwhich" style="font-size:2em">?</div>
<script>
var showMe = 'v4!';
if(is6){
        var showMe = 'v6!';     
}
$("#ipwhich").delay(1000).hide().delay(1000).html(showMe).fadeIn();
</script>
</div>

I did up a live demo: give it a try!

Let’s Encrypt TLS & A+ on SSL Labs

1 minute, 23 seconds

As you may recall, around here we like our TLS, and we like it rare!  I have no idea what “rare” means in the context of web encryption, but you know, that’s the way we like it!  We also like it cheap!  Even better than cheap (free) is open (libre)!  So, put it all together, and you get Let’s Encrypt TLS certs on plip.com and related properties.  Yay!

I saw the EFF/Let’s Encrypt crew speak at at DEF CON this past summer,  and it was super inspiring.  I’d already heard about the project, but it was that much more exciting to hear their talk.  I was dead set on cutting over from my old CA, to the new, definitively open, one.

While I was in my server, I went and visited my fave site for secure web server configs, cipherli.st. The only option I can’t run is SSLSessionTickets, as it requires Apache 2.4.11 or later. We’ll get there later with an Apache upgrade.

Put this all together?  You get a big fat A+ on SSL Labs.  w00t!

Some caveats are that Let’s Encrypt is just in public beta, so there’s some still some kinks to work out. For example, I mistakenly tried to get a cert for a wildcard vhost (eg “*.foo.bar.com”).  I got back an error:

An unexpected error occurred:
The request message was malformed :: Error creating new authz :: Invalid character in DNS name
Please see the logfiles in /var/log/letsencrypt for more details.

So, while I shouldn’t have selected the domain to get a cert (Let’s Encrypt doesn’t do wildcard certs), the error was a bit cryptic.  Fortunately the fine folks in their IRC channel (web IRC client – #letsencrypt @ Freenode to DIY) quickly pointed out to not use wildcards and that there was issue 1683 already open.

Awesome sauce, thanks Let’s Encrypt!

Bootstrapping with secure passwords

2 minutes, 6 seconds

I recently fat fingered the partitions on my 5k iMac when installing Ubuntu (more on Ubuntu on a 5k later!), so I was stuck doing a double clean install of both OS X and Ubuntu.  Given how often I find myself re-installing a system from scratch, I’ve gotten pretty good at getting all my core apps set up.  All the software I run is open source or free, so downloading it is quite easy.  But how do you log in using all your secure passwords?  The passwords are stored in my password safe, but the password safe is stored in a password protected, self hosted cloud file server. Classic chicken and egg scenario.  Here’s how I get around it:

  1. Go to a computer where you have your password safe handy
  2. Log into your cloud file server
  3. Generate an unprotected shared link to your password safe.  This will look something like this: http://my_owncloud_server.com/public.php?service=files&t=4617c2d4e806fa0d8bf6f47e4123f695
  4. Then take that link, and use a URL shortener to make a short, but not too guessable URL

Now, when you need to bootstrap a new computer, it’s simple as pie:

  1. Download password safe binary
  2. Go to http://tinyurl.com/MySecretPasswordSafeURLHere
  3. Download password safe file

Thus we solve the chicken and egg problem.  As well, since we’re pointing to the most up to date version of your password safe on your cloud server, you’ll always have your latest passwords!

Yes, yes, we are exposing our selves here to some risk that some one will guess the shortened URL of our our password safe.  However, this is pretty unlikely that it’ll be guessed.  As well, you use a good pass phrase on your password safe, right?!

For smart phones, I’ve had similar problems bootstrapping when I can’t download the password safe app because I can’t log into the app store. Another chicken and egg!  Here’s how I work around this (which would work for the desktop scenario too):

  1. Turn your phone on, skip account set up
  2. Connect to WiFi or cellular data so your mobile browser can connect to the internet
  3. On another computer, where you have access to your password safe, copy your primary login for your app store (aka your iCloud or gmail/google app login)
  4. Go to onetimesecret.com and create a secret URL
  5. Go to ye’ ol’ URL shortener, and create a customized, short URL: http://tinyurl.com/help-obi-won-kanobi linking to your onetimesecret URL
  6. Now you can manually type the short URL on your phone and get the password which you can then copy and paste to log into to the phone/app store.

Though it seems like a number of painful steps they both go more quickly than you think and I seem to do them enough they’re second nature.

Using Git on Ubuntu with SSH Tunnels to Mac OS X Host

4 minutes, 9 seconds

Intro & Prerequisites

Are you using Linux but cannot get your LT2P-IPSEC VPN hosted on your Mac OS X server working?   Do you write code on your Ubuntu client and check into a git server behind your VPN? Maybe you should consider ditching the VPN client and using SSH tunnels instead. Really, this will work for any server that’s on the remote LAN that you have SSH access to, but in my case it was the same host as the VPN Server, a mac. As well, this can be any client as well, not just Ubuntu.

In all the notes below, any time you see “mrjones” or USERNAME, replace it with your username.  Anytime you see an all caps computer name that’s SERVER_NAME.com, replace it your server’s name.  The VPN server, SSH jump host and jump host are all the same.

You’ll need:

  • An SSH client you know how to configure. For OS X and Ubuntu clients, this is built in.  For Windows you can use putty.
  • An SSH account the remote server which has access to your remote LAN you want to access.
  • An SSH public key you have put on on your ~USERNAME/.ssh/authorized_keys file on this same remote server.

SOCKS5

You can use SSH to create an SSH tunnel, specifically one that has dynamic ports and hosts as specified by the requesting app – aka a SOCKS5 proxy. To do this, you can use any local port above 1024, but I use 1080.  It looks like this:

ssh -D 1080 mrjones@SECRET_DOMAIN.com

In your browser then, for example FireFox, you set up the proxy by:

  • socksPreferences -> Advanced -> Network -> Connection -> Settings
  • Choose “Manual Proxy Configuration”
  • In the bottom option for “SOCKS Host” put “127.0.0.1” and for port put “1080”

 

The benefit of setting up a SOCKS5 proxy is that your URLs are the same as if you were on the VPN. This means that when you copy and paste them into/out of IM chats and emails, they just work as opposed to having localhost in them or trailing, odd ports.

SSH Tunnels with agent forwarding

You may still need to SSH to a production machine via the remote server jump host.  In order to do this and not have to re-federate your private key the SSH jump host (or generate a new private key on the jump host and then federate that out to the production machines), you can just do this:

ssh -A -t -l mrjones SECRET_DOMAIN.com ssh -A -t -l root SECURE_INTERNAL_SERVER.com

After running that you should have a prompt on SECURE_INTERNAL_SERVER.com as root.  This assumes that you have your public on your *local* box added to the authorized_keys of the account your SSHing to on the remote most box (SECURE_INTERNAL_SERVER.com).  This is a thing of beauty.

Checking code out with git over SSH

If you’re like me, you need to git clone for repos hosted on your stash/gitlab/whatever server which is only accessible on the VPN or LAN. You can do this with tunnels as well!  For me, I use  Stash professionaly, so instead of running this command to clone a repo:

git clone  ssh://git@STASH_SERVER.com:7999/path/to/repo.git

You can run this to add a tunnel to the stash host and then clone via a specialized host:

ssh mrjones@SECRET_DOMAIN.com -N -L 7999:STASH_SERVER.com:7999
git clone ssh://git@localhost:7999/path/to/repo.git

subsequent git commands like commit, pull, status etc. work with out modification transparently.

Pushing code with git over SSH

If you’re like me, you need to push using git via awesome git post-commit hooks. You can do this with tunnels as well!  Instead of running this command to add your remote:

git remote add live ssh://git@PROD_WEB.com/opt/git/web.git

You can run this to add a tunnel to PROD_WEB.com and then add a specialized remote:

ssh mrjones@SECRET_DOMAIN.com -N -L 2200:PROD_WEB.com:22
git remote add live ssh://git@localhost:2200/opt/git/web.git

subsequent git commands to push new branches work with out modification transparently.

Side note, you can push specific tags using this syntax:

 git push live +TAG_HERE^{}:master

SSH Tunnel manager

gstm

DDG gSTM pic

Managing all these tunnels is a total pain.  You could create a shell script to do it, but the cleanest way by far is to use a tunnel manager.  For me on Ubuntu this gSTM (Gnome SSH Tunnel Manager).  This allows you to, with one click, turn on and off all the tunnels listed above.

 

Caveats

Right now the biggest caveat with this set up is that *ALL* your web traffic goes over the VPN host (this is actually the same as when you’re on your mac based VPN). Further, your browser will not work *at all* with out the tunnels set up, even for any hosts (not same as VPN ;).  Which means even if you want to use your browser for non-work when you’re not working, all your browser traffic goes through your VPN server.

As well, if you run a vagrant dev environment, you can not access your VMs via their local Virtual Box IP, as they’re not accessible from VPN server.

You can fix both of these issues by either using a different browser for non work/vagrant hosts or disabling the proxy by flipping it back to “no proxy” back in settings.

I believe that Foxy Proxy might solve this, but haven’t tried it yet!

Your mom just got her first smart phone: what should she learn first?

2 minutes, 25 seconds

My mom just got her first smart phone, an iPhone 5S. What should she learn to do on it first? Fortunately, she has an iPad already so the iOS as a whole isn’t entirely foreign.

First up is the core list of phone phone features which is actually only limited to 6:

  • How to receive a call
  • How to place a call
  • How to send an SMS (text message)
  • How to receive an SMS (text message)
  • How to adjust or turn off your ring volume
  • How to turn on and off airplane mode

My mom wants to barely use her phone so she doesn’t have to pay a lot per month.  Right now she’s paying $17.50 for 250 minutes, 300 texts and 30 MB per month from Consumer Cellular.  With these tight constraints, airplane mode will be your friend to ensure while you’re phone is not actively being used that it’s not using data while your email is checked or while some app is sucking down bits. As well, knowing if you’re phone is going to sound like Defcon level 1 alert when some one calls you is important. Know your sounds vs your silence!

The second set of features to learn are centered around how your phone is not just a phone, but a super powerful mini computer that fits in your purse:

  • How to get on WiFi at your house and other primary locations you frequent.  Though calls and texts will still be deducted from your plan, surfing the web and looking up directions will not. Couple this with your airplane mode savviness, and you’ll be a penny pinching queen!
  • Know your camera!  You always have it with you and you can use it in airplane mode! Your camera can not only take selfies and scenic shots, but it can take pictures of:
    • Where you parked your car at the airport
    • That recipe you’re reading in a magazine at the doctors
    • Slides of a presentation
  • Know your maps app.  You can look where to find a cup of coffee in a part of town you don’t know.  You can have it navigate it for you to a business you’ve never been to.  You can instantly look up where that deli you went to last year is in NYC or what country Estonia is next to (Latvia and Russia ;)
  • Know your audio app(s).  You can not only load your phone with your favorite tunes exactly like an iPod, but you can stream them from providers like Google Play and Pandora. NOTE! This will use a lot of your monthly data if you’re not on WiFi. On top of all this, you can get a podcast app and load your phone full of amazing stories and info that can all be listened to with airplane mode one.

I don’t know if she agrees (Mom?), but I think some of the best advice I gave her was that she didn’t need to rush things with the new phone.  She could take as long as she needed to learn how to do a task (or wait until I’m free to walk her through it).

Do you know someone who just got a smart phone for the first time? What do you think should be on the top items to learn?

How to test PHPs memory_limit setting

0 minutes, 42 seconds

So, we all know that in PHP, you configure it with a php.ini file. And in there, you can set the amount of RAM a script can use with the memory_limitsetting (remember this is “M” not “MB”!).  And if you get this error:

PHP Fatal error:  Allowed memory size of 134217728 bytes exhausted (tried to allocate 234881025 bytes)

Then you can increase the memory_limit to be larger (don’t forget to restart apache!). However, what if you want a script to hit that limit to see how your error logs and such are set up?  I had more fun than I thought I would writing a textbook solution to a textbook problem.  Here it is in it’s 4 line glory:

$str = 'memory!';
$i = 1;
while ($i++ != 100) $str .= $str  ;
print "done!";

When you run this you should see an error as this will exceed 128M of memory. If not, so salt to taste ($i++ != 200) if you run with a higher memory_limit setting!

On really nice standing desks with really nice computers

3 minutes, 53 seconds

A good friend of mine is setting up a new workstation in his new lab and wanted some advice on what would be the best setup. Being a bit of a geek about monitors and having set up my own desk, I had a lot of ideas on this. After a detail-packed email to him, I realized it’d make a great post for others looking to do the same thing.

The overall question I got: What would be the best standing desk with the best monitors for a new Mac Pro (nMP)?

This is fun!  I get to spend imaginary money for a dream set up.  For my “what’s the best” type of questions, I always try to refer to  The Wirecutter, they’re great. As well, I try to use Amazon whenever possible for all of my shopping needs

The Desk

Though Wirecutter has a newer, cheaper recommendation, I still like their step up, the NextDesk Terra, which was their “regular” recommendation when I got mine. I see it’s now down to $1,500.terra

NextDesk upgrades: You can get a ton more bells and whistles including CPU stands, software integration, casters, batteries (for use when moving on casters) and more. The bare minimum I would get is the “Power Management,” which is really well done. Also – think on whether you want the hole(s) for cables in the desk. I regretted getting a single center one. I might have gone with none or two side ones.

Monitors and Stands

standsI use Ergotron’s single and dual arm mounts. Amazon pictures the dual with two monitors on top of each other, but it can easily do two side by side (as well, they rotate for one portrait and one landscape). You can also order the single and then add a second arm to the same pole at a later date if you decide to add another monitor.

IPS 60hz 4k displays used to be $3,000+.  This is no longer the case! The Dell P2715Q 4k 27″ is down to $500! This is insane. You could get two of these no prob for your Mac Pro. IPS means that the viewing angles are perfect.  60hz means that the refresh rate is super fast and your mouse/window movements don’t feel sluggish.  dell4k means that you can either run HiDPI for super crisp text or 1:1 for TONS of real estate. Well, assuming you have good eyes for the 1:1 ;)

Though 4k is ready for prime time, there are a few bumps in the road, specifically around displaying the boot process. As well, I see Apple’s nMP page boldly advertises “connect up to three high-resolution 4K displays.” However, I’ve also seen reports that the 3rd will be only at 30hz (boo!).

I forget which cables Dell comes with, but you can always get a 3, 6, or 9 foot (or more!); it’s nice to have the perfect length cable with no extra slack. cableSame for ethernet, USB, firewire and thunderbolt cables too! For example, here’s a 6ft mini display -> display port cable for just $7. Oh yes – don’t use any ugly looking dongles!  Get the right cable for the job.

Mac Pro and peripherals

I don’t actually have a new Mac Pro (aka nMP aka 2013 Mac Pro), so I don’t have too much to say about which CPU and GPU to get.  However, I did just get a 5k iMac that works great with the Dell         4k display! (Well, as long as you don’t mind some UI degradation. Ok, not so great, but worth the trade off for me.). To save money on the most expensive item in this monster desk setup, I strongly recommend using refurb.me – they’re the best way to effortlessly get good deals on Apple refurbed products! These are direct from Apple and include an Apple warranty.

mac.proOne new Mac purchasing trick I did learn is about buying your new Mac with more RAM direct from Apple.  Don’t do it! For example, 64GB of aftermarket RAM only costs $664 instead of Apple’s $1,300. ramConsider putting the saved money toward more cores or disk or graphics card! I love Crucial for cheap aftermarket RAM, but I usually end up buying their stuff on Amazon. Here, B00GEC3ZJQ on Amazon is cheaper than the exact same part (CT5019226) on the Crucial site. Order two kits to max out your nMP to 64GB.

Keyboard and keyboard mouse – I love Wirecutter’s recommendations for wireless versions of both mice and keyboards. They really add to the clean lines of VESA stands on the awesome desk.mouse

Despite loving the wireless mouse and keyboard, my new boss got me a “welcome to your new job!” gift of a fancy Das Keyboard 4 Pro which I NEVER would have bought on my own given it’s price. If I had office mates, they NEVER would want me to use it because it’s too loud. That said, I actually love this keyboard so much that I alternate it with Wirecutter’s bluetooth pick, but the cable does ruin the lines of your desk. ;) Oh – I see it comes in “soft tactile” model as well. This might be a more quiet option!

das.keyboardI love following this topic so drop me a note if you have any questions or want to update me with your experiences in this area!

Named anchor navigation using JavaScript

1 minute, 31 seconds

Recently I wanted to implement simple way to load a number of gallery images on an a static HTML page.  JavaScript was my go to, specifically jQuery.  I started by including jQuery on my page:

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>

After noodling on which way to build this, I decided to use the anchor name (“#”) in the URL.  We register a jQuery listener like this:

$( document ).ready(function() {
    $(window).on('hashchange', function() {
        changePhoto();
    });
});

What this code does, is on page load (“ready()”), we listen to changes to the “hashchange”.  When we hear a change to the anchor name, run the “changePhoto()” function.

I then have a single img HTML tag which we’ll update:

<img  id="changable" src="Image1.jpg"  />

And some links which control which image the user can see:

<a href="#" class="go-photo" photo="1">Photo 1</a> - 
<a href="#" class="go-photo" photo="2">Photo 2</a> - 
<a href="#" class="go-photo" photo="3">Photo 3</a>

To handle these clicks, we just have a function which looks for the “go-photo”:

$('.go-photo').click(function(e) {
        e.preventDefault();
        window.location.hash = $(this).attr('photo');
 });

This simply intercepts the default action of clicking a link and instead updates the anchor based of the ID of the “photo” element in the link.  Any time the hash is updated in the URL, our listener will fire our own “changePhoto()” function.

Finally, we have our changePhoto function which handles changing the image source upon a hash change in the URL:

function changePhoto( base){
    photoid = window.location.hash.replace("#", "");
    $('#changable').attr('src', 'Image' + photoid + '.jpg');
    return true;
}

And, bam, you have a tidy, JS based photo navigator. My main goal of having both a JS call to change the anchor and the browser back button  trigger a call to changePhoto() as achieved. To add a new photo to your page, just upload a new Image4.jpg image and add a new link with the right “photo=4” value and you’re good to go!

Tip: Better Amazon URLs

0 minutes, 52 seconds

Have you ever had a friend send you an Amazon link that was all kinds of long and ugly? Maybe it looked like this:

http://www.amazon.com/Princess-Tiana-Balloon-Bouquet-Balloons/dp/B00BIIAUY4/ref=sr_1_1/187-3169712-6163024?s=toys-and-games&ie=UTF8&qid=1421967348&sr=1-1

Thought you can clearly see it’s for some sort of balloons by the “Princess-Tiana-Balloon-Bouquet-Balloons” part, there’s a bunch of referrer tracking junk in there after that.  It’s very ugly.  As well, maybe you have 3 or 4 balloons you’re thinking of getting and want to send them to a friend with the price and if it’s Amazon Prime or not.  Enter the tip!

You only need 3 parts to the URL for it to work:

  1. Domain: http://amazon.com
  2. Vanity Name: Princess-Tiana-Balloon-Bouquet-Balloons
  3. Product ID: /dp/B00BIIAUY4

The three takeaways are that you A) don’t need all the junk at the end, B) the domain can drop the “www” and, most importantly, C) can put what ever you want in the vanity section. In our case, we could make that ugly ol’ URL all purty and helpful and it still works just fine:

http://amazon.com/11buck.no-prime.tianna.balloon/dp/B00BIIAUY4