How can I create one of those image verification 'things'?

Many sites require people to type in a verification code contained within a graphic image to ensure that it is a 'real' person registering, rather than an automated spam bot. You can easily achieve this sort of functionality by dynamically creating an SVG graphic in Apex.

This requires a number of steps,

• Create a package to generate the SVG source, for example

       create or replace package pkg_auth as
         procedure validation_image;
       end pkg_auth;

      create or replace package body pkg_auth is
        procedure validation_image
        as
          v_random number;
        begin
          v_random := trunc(dbms_random.value(100000,999999));
          owa_util.mime_header( ccontent_type => 'image/svg+xml', bclose_header => FALSE, ccharset => 'utf-8');
          htp.p('Expires: Thu, 29 Oct 2000 17:04:19 GMT');
          htp.p('Pragma: no-cache');
          htp.p('Cache-Control: no-cache');
          owa_util.http_header_close;
          htp.p('<?xml version="1.0" standalone="no"?>');
          htp.p('<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg" version="1.1">');
          htp.p('<desc>Image generation demo</desc>');
          htp.p('<rect x="1" y="1" width="99" height="99"  fill="yellow" stroke="navy" stroke-width="1" />');
          htp.p('<text x="10" y="50"  font-size="20" fill="blue">');
          htp.p(v_random);
          htp.p('</text>');
          htp.p('</svg>');
        end validation_image;
      end pkg_auth;

• Grant access to this procedure to PUBLIC (or the user specified in your DAD)

       grant execute on pkg_auth to public

• Test the procedure works via mod_plsql by pointing your browser at

  http://yourhost:yourport/pls/htmldb/pkg_auth.validation_image

Note that if you created the package in a different schema, or haven't created a public synonym to it then you may need to specify the schema in the URL, for example

http://yourhost:yourport/pls/apex/schema.pkg_auth.validation_image

• Create an HTML region and include the following as the source

<embed src="/pls/apex/pkg_auth.validation_image" width="100" height="100" type="image/svg+xml" />

again note you may need to specify the schema if you have not created a public synonym for your package.

-- JohnScott - 12 Dec 2005

Comments