quarta-feira, 13 de abril de 2011

Conectando Aplicação AIR à banco MySQL via AsSQL

Há alguns dias, um co-worker me deu essa dica. Era sobre um novo projeto open-source de um driver que conectava, à primeira vista, aplicações Actionscript 3.0 à bancos MySQL diretamente. Mas depois de uma olhada rápida, percebemos que era voltado somente a aplicações AIR.

O AsSQL permite que aplicações locais feitas em AIR conectem-se à bancos de dados MySQL diretamente, via Actionscript 3.0. Sem precisar usar PHP, .NET ou qualquer outra liguagem server-side.

Com isso, desenvolvedores AIR tem mais uma ferramenta poderosa, deixando mais fácil a persistência de dados na núvem. Maaas… fiz alguns testes em projetos Flex, e correu tudo bem localmente. Mas quando publiquei não consegui fazer conectar com meu DB publicado, mesmo ele estando liberado para qualquer origem de conexão.

Em relação a projetos Flash / Actionscript 3.0 puro, não achei nada na documentação e exemplos que desse suporte.

Já em AIR, correu tudo legal e consegui conectar uma aplicação local com meu banco publicado, mas tive que deixar o banco aberto, aceitando conexões de qualquer tipo de origem.

Também fiz testes trackeando as chamadas para ver se o usuário e/ou senha do banco estava explicitos, mas o Charles nem sequer mostrou alguma chamada. Então está bem seguro e protegido.

Como sempre faço, iria disponibilisar o source pra download, mas o FTP do meu site tirou essa noite pra dormir. Então, como é um projeto simples em AIR, segue o MXML principal.

   1: <?xml version="1.0" encoding="utf-8"?>
   2: <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml"
   3:                         layout="absolute"
   4:                         xmlns:mxml="com.maclema.mysql.mxml.*">
   5:     <mx:Script>
   6:         <![CDATA[
   7:             import com.maclema.mysql.events.MySqlEvent;
   8:             import com.maclema.util.ResultsUtil;
   9:  
  10:             import mx.controls.Alert;
  11:  
  12:             [Bindable]
  13:             private var _recovering:Boolean;
  14:  
  15:             protected function mySqlService_connectHandler( event:Event ):void
  16:             {
  17:                 Alert.show( 'Conexão realizada com sucesso!' );
  18:             }
  19:  
  20:             protected function btnGetUsers_clickHandler( event:MouseEvent ):void
  21:             {
  22:                 _recovering = true;
  23:  
  24:                 mySqlService.send( 'SELECT * FROM tb_users' );
  25:             }
  26:  
  27:             protected function mySqlService_responseHandler( event:MySqlEvent ):void
  28:             {
  29:                 _recovering = false;
  30:             }
  31:         ]]>
  32:     </mx:Script>
  33:  
  34:     <mxml:MySqlService id="mySqlService"
  35:                        hostname="localhost"
  36:                        username="root"
  37:                        password=""
  38:                        database="db_assql_test"
  39:                        autoConnect="true"
  40:                        connect="mySqlService_connectHandler(event)"
  41:                        showBusyCursor="true"/>
  42:  
  43:     <mx:Panel title="AsSQL Usage Test - By Idemax.net"
  44:               horizontalCenter="0"
  45:               verticalCenter="0"
  46:               paddingBottom="10"
  47:               paddingLeft="10"
  48:               paddingRight="10"
  49:               paddingTop="10">
  50:         <mx:VBox width="100%"
  51:                  height="100%">
  52:             <mx:HBox width="100%">
  53:                 <mx:Label text="{mySqlService.lastResult.length} usuários"/>
  54:                 <mx:Spacer width="100%"/>
  55:                 <mx:Button id="btnGetUsers"
  56:                            label="buscar usuários"
  57:                            enabled="{!_recovering}"
  58:                            click="btnGetUsers_clickHandler(event)"/>
  59:             </mx:HBox>
  60:             <mx:DataGrid width="100%"
  61:                          height="100%"
  62:                          dataProvider="{mySqlService.lastResult}"
  63:                          columns="{ResultsUtil.getDataGridColumns(mySqlService.lastResultSet)}"/>
  64:         </mx:VBox>
  65:     </mx:Panel>
  66: </mx:WindowedApplication>

E o banco que usei no teste (é só copiar e colar esse código abaixo num arquivo .SQL e importar em seu MySQL).



   1: -- phpMyAdmin SQL Dump
   2: -- version 3.3.9
   3: -- http://www.phpmyadmin.net
   4: --
   5: -- Host: localhost
   6: -- Generation Time: Apr 13, 2011 at 02:25 AM
   7: -- Server version: 5.5.8
   8: -- PHP Version: 5.3.5
   9:  
  10: SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";
  11:  
  12:  
  13: /*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
  14: /*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
  15: /*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
  16: /*!40101 SET NAMES utf8 */;
  17:  
  18: --
  19: -- Database: `db_assql_test`
  20: --
  21: CREATE DATABASE `db_assql_test` DEFAULT CHARACTER SET latin1 COLLATE latin1_swedish_ci;
  22: USE `db_assql_test`;
  23:  
  24: -- --------------------------------------------------------
  25:  
  26: --
  27: -- Table structure for table `tb_users`
  28: --
  29: CREATE TABLE IF NOT EXISTS `tb_users` (
  30:   `id` int(11) NOT NULL AUTO_INCREMENT,
  31:   `user` varchar(255) NOT NULL,
  32:   `pass` varchar(255) NOT NULL,
  33:   PRIMARY KEY (`id`)
  34: ) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=4 ;
  35:  
  36: --
  37: -- Dumping data for table `tb_users`
  38: --
  39: INSERT INTO `tb_users` (`id`, `user`, `pass`) VALUES
  40: (1, 'Idemax Green', '123456'),
  41: (2, 'Marcelo Filho', '789456'),
  42: (3, 'João da Silva', '147852');

8 comentários:

  1. Parabéns Idemac. Realmente está app é muito útil.

    ResponderExcluir
  2. Po maneiro essa sua iniciativa de mostras exemplos dessa forma, gostaria de saber como faço um crud bem simples com esse assql abrindo o bd sem q eu tenha q clicar em um botão. se puder responder aqui para q outros saibam ou me enviar como faz agradeço. Pena q tu parou de postar. Vlw

    ResponderExcluir
    Respostas
    1. Olá Marllon, a conexão é iniciada automaticamente pois a propriedade autoConnect="true" está definida, se não fosse definida ou fosse "false", você teria que iniciá-la programaticamente.
      Obrigado pelo comentário. Se tiver sugestões de posts, pode mandar!

      Excluir
  3. O lance é q to querendo fazer um pequeno programa com flex conectando com sql como no exemplo que vc fez e somando a isso colocar botões que possam inserir dados no banco, excluí-los e editá-los. Se você puder fazer um exemplo e postar para a galera esse tipo de exemplo usando assql me ajudaria muito e a muitas pessoas creio eu. Obrigado.

    ResponderExcluir
    Respostas
    1. Claro, vou criar um tutorial mais completo e posto aqui em breve! Pra adiantar sua dúvida, naquele método SEND você pode passar qualquer SQL.
      Obrigado.

      Excluir
  4. Até deu uma olhada na documentação do assql hj, mas como estou começando no flex e bd fiquei meio confuso no uso. Vlw kra to no aguardo do seu tuto. Obrigado.

    ResponderExcluir
  5. E ae blz? Eu estava pesquisando outro meio de fazer o crud q te falei com um banco de dados no flex para desktop app e achei este:


























    Mas está me dando esses erros

    TypeError: Error #1009: Cannot access a property or method of a null object reference.
    at exemflex/excuseUpdate()[C:\Users\Marllon\Documents\Flex Builder 3\exemflex\src\exemflex.mxml:77]
    at exemflex/insertemp()[C:\Users\Marllon\Documents\Flex Builder 3\exemflex\src\exemflex.mxml:88]
    at exemflex/___exemflex_Button1_click()[C:\Users\Marllon\Documents\Flex Builder 3\exemflex\src\exemflex.mxml:116]

    TypeError: Error #1009: Cannot access a property or method of a null object reference.
    at exemflex/deleteemp()[C:\Users\Marllon\Documents\Flex Builder 3\exemflex\src\exemflex.mxml:94]
    at exemflex/___exemflex_Button2_click()[C:\Users\Marllon\Documents\Flex Builder 3\exemflex\src\exemflex.mxml:117]

    Sabe dizer o q pod ser? Se puder me ajudar agradeço. Vlw kra.

    ResponderExcluir
    Respostas
    1. "Cannot access a property or method of a null object reference.". Você está tentando acessar algo que não existe ou está nulo.

      Excluir