Archive for the ‘code’ Category



Processing: Using webcam in a browser

Friday, August 13th, 2010

For those web developers out there who are familiar with Casey Reas and Ben Fry‘s Processing programming language, you might have encountered a standstill when it came to sharing your sketches that use the computer’s video webcam.  Sure the libraries make webcams easy to use, giving you online support on the official website and quick results when you run the program. But what about publishing your webcam sketches to an internet browser? Why do you get the white box of death?

Objective

The browser needs to alert the users that your program needs access to their webcam. Permission must be set first before anything can be shown. In order to make the browser ask this vital question you must sign your .jar files. Signing prevents your program from being blocked (a.k.a. white box of death) and gives it online ownership for security’s sake. The process must be redone every six months or so to maintain ownership credibility. Since you will be using at least one library (for webcam use), you will not only need to sign one .jar file but multiple .jar files. In my case I had to sign four.

Requirements

Steps

  1. After you export your Processing sketch, move the applet folder to your desktop. This is optional yet it makes it really easy for people who are shaky when it comes to making commands in Terminal. Once you know the exact location of the applet folder, open it to see the names of your .jar files. Write them down or keep the folder open so you can see them. Now open the terminal emulator of your choice.
  2. The first command is simply finding your applet folder. Yes, there is a single space after “cd”. Spaces are important!
    cd ~/Desktop/applet

    Press Enter/Return to make the command. Nothing should really happen, but to see if you actually found the folder you can make another command.

    ls

    This will list everything in the applet folder. If you don’t recognize any the files listed or nothing shows up, you didn’t put in the correct path.

  3. Now that you have found the applet folder in Terminal, you will need to make a pKeyStore file that is secured with two passwords and an alias of your choosing. These are in bold if you want to change them, but this command will work for anyone as long as they remain consistent. Capitalization is important!
    keytool -genkey -keystore pKeyStore -storepass p5store -keypass p5keys -alias p5geek
  4. Terminal will now ask for ownership details like organization name, etc. If you go fast on this part you can miss the last question where it asks you to confirm that the information you supplied is true. If you type just anything you will be forced to start all over again. Type “Yes” and you will ready for Step 5.
  5. The pKeyStore file that has been created in the applet folder has your information at this point. However, you will now have to self-certify each .jar file using the passwords and alias you established in Step 3. You can initialize this by the following command (Note: The passwords and alias are in bold in case you changed them):
    keytool -selfcert -keystore pKeyStore -storepass p5store -keypass p5keys -alias p5geek
  6. The command to self-certify a .jar file is simple. You will use “jarsigner” instead of “keytool” along with the usual stuff (keystore name, two passwords and alias). The one other crucial change is the name of the .jar file. It goes before the alias. You must do this command for each .jar file in the applet folder in order for the program to work online (Note: The .jar file is in bold to show what is the changing part of the command):
    jarsigner -keystore pKeyStore -storepass p5store -keypass p5keys core.jar -alias p5geek

    For example, after this command you would type everything out again but replace “core.jar” with “video.jar” (or whatever the other .jar file is named) until all .jar files have been signed. You will know this by the confirmation message Terminal will give you after each command.

  7. Upload the applet folder to your web server or run the program through your local server and see the alert box that the browser gives you. Click “Allow Access” and you are good to go! Just remember this process six months from now when you have to renew the certification.