Gigya 服务在 Flex4 中不起作用，但在 Flex3 中运行良好

Question

I was gigya service to login to my webpage using social services login.

Everything was working fine in my flex 3, but when since I have changed my code to flex 4, I am unable to see any gigya services being loaded.

My code is below:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:flexlib_controls="flexlib.controls.*" 
                xmlns:s="library://ns.adobe.com/flex/spark" xmlns:fx="http://ns.adobe.com/mxml/2009"
                xmlns:mx="library://ns.adobe.com/flex/mx"
                verticalAlign="middle" horizontalAlign="center" width="400" height="150" layout="absolute"
                backgroundColor="#FFFFFF" borderStyle="none" color="#FFFFFF" backgroundGradientAlphas="[0,0]"
                backgroundAlpha="0" applicationComplete="init()"
                verticalScrollPolicy="off" horizontalScrollPolicy="off" fontFamily="Arial" fontSize="12">       

    <fx:Script>
        <![CDATA[                       
            import c7.config.ServerConfig;

            import com.adobe.serialization.json.JSON;
            import com.hurlant.crypto.*;
            import com.hurlant.crypto.hash.HMAC;
            import com.hurlant.crypto.symmetric.ICipher;
            import com.hurlant.util.Base64;
            import com.hurlant.util.Hex;

            import flash.net.navigateToURL;

            import mx.controls.Alert;
            import mx.core.Application;

            import mx.rpc.events.ResultEvent;

            import spark.components.supportClasses.ListBase;

            private var loginEventObj:Object = new Object();
            private var currentUID:String = new String();           
            private var userInfo:UserInfo = new UserInfo();
            public var currentResult:ByteArray;
            public var secretKey:String = ServerConfig.get_gigya_key().secret_key;          

            // Define a configuration object. Insert your APIKey below: 
            private var conf:Object = { 
                APIKey: ServerConfig.get_gigya_key().api_key 
            };


            [Bindable]
            private static var RPC_URL:String = ServerConfig.get_rpc_base_url();            

            [Bindable]
            private var system_message:String = null;

            private var newUserFlag:Boolean = true; // lets assume the user is new first.

            private function init():void
            {               
                initSocialService();
            }


            private function initSocialService():void
            {               
                Security.allowDomain("cdn.gigya.com");
                Security.allowInsecureDomain("cdn.gigya.com");

                // Initialize the "mcRoot" attribute of the conf object - should refer to the root of the flash container. 
                this.conf.mcRoot=this.root; 

                // Load Social service 
                // Create the load-parameters object 
                var loadParams:Object = { 
                    services:'socialize',
                    callback:onServiceInit 
                } 

                // Load the service 
                gigya.load(conf,loadParams);
            }

            // Wait for the load to complete and handle failures/success 
            private function onServiceInit(response:*):void 
            { 
                if (response.hadError)          
                    throw new Error('Failed to init gigya service');                
                else 
                { 
                    gigya.services.socialize.addEventHandlers(conf, {onLogin:onLoginHandler});
                    showLoginUI(); 
                } 
            } 

            private function showLoginUI():void 
            {               
                // Define parameters object: 
                var params:Object = {width: 350,
                    enabledProviders: "facebook, twitter, yahoo, messenger, google, linkedin, myspace, aol, openid",
                    height: 80,
                    lastLoginIndication: "welcome",                     
                    showTermsLink: false,
                    showWhatsThis: true,                        
                    hideGigyaLink: true,
                    container: loginCanvas, // embed component inside loginCanvas container
                    UIConfig: '<config><body><background frame-color="#BFBFBF" background-color="#FFFFFF" corner-roundness="5;5;5;5"></background></body></config>',
                    cid: 'login page'}; 
                gigya.services.socialize.showLoginUI(conf, params);
            }

            // Note: the actual signature calculation implementation should be on server side 
            private function verifyTheSignature(UID:String, timestamp:String, signature:String): void  
            { 
                //trace('Your user ID: ' + UID + '\n timestamp: ' + timestamp + '\n signature: ' + signature); 
            }                                                       
        ]]>
    </fx:Script>
    <fx:Style>
        .textInput{
            fontFamily: Arial; 
            color: #333333;                  
            fontSize: 14;
            paddingTop: 2;
            paddingBottom: 2;
            paddingRight: 2;
            paddingLeft: 2;
            cornerRadius: 5;
            borderStyle: solid;             
        }
        .smallText{
            fontSize: 10;
            fontFamily: Arial;
            color: #4483af;         
        }
    </fx:Style>
    <mx:ViewStack id="vs_main" width="100%" height="100%" top="0" left="0" borderStyle="none" paddingLeft="0" paddingTop="0" paddingRight="0"
                  paddingBottom="0" backgroundAlpha="0" creationPolicy="all" verticalScrollPolicy="off" horizontalScrollPolicy="off">
        <s:NavigatorContent id="bx_login"  width="100%" height="100%">
            <s:Group id="bx_login1" width="100%" height="100%">
                <s:Label id="both_required_error_lbl" text="Both username and password are required" top="2" left="2" color="#ff0000" visible="false"/>
                <s:Label id="invalid_error_lbl" text="{this.system_message}" top="2" left="2" color="#ff0000" visible="false"/>
                <flexlib_controls:PromptingTextInput prompt="username" width="150" maxChars="100" id="txt_username" top="22" left="2"
                                                     color="#000000" enter="authenticate(txt_username.text, txt_password.text)" styleName="textInput"/>
                <s:Label text="forgot username" styleName="smallText" useHandCursor="true" mouseChildren="false" buttonMode="true"
                         click="{vs_main.selectedChild= bx_forgot_username;}" top="49" left="2"/>
                <flexlib_controls:PromptingTextInput prompt="password" width="150" maxChars="100" id="txt_password"  styleName="textInput" top="22" left="160"
                                                     color="#000000" displayAsPassword="true" enter="authenticate(txt_username.text, txt_password.text)"/>
                <s:Label text="forgot password" styleName="smallText" useHandCursor="true" mouseChildren="false" buttonMode="true" left="160" top="49"
                         click="{vs_main.selectedChild=bx_forgot_password;}"/>          
                <s:Button id="btn_login" label="Submit" click="authenticate(txt_username.text, txt_password.text)" fontFamily="Arial" fontSize="12"
                          toolTip="Login using your existing account" color="#000000" top="22" right="2"/>
                <s:Group id="loginCanvas" height="80" width="100%" left="2" bottom="2"/>
            </s:Group>  
        </s:NavigatorContent>       
    </mx:ViewStack>
</mx:Application>

Can someone plz help me with this issue.

Regards Zeeshan

Answer 1

The Gigaya Service was not working because of the Spark component. I dont have the reason why spark s:Group is not supporting gigya, but if I keep the flex3 mx:Canvas component to do the job, it works perfectly.