XMLHTTPrequest And CrossWalk Problem

[kristina_k_]

Hi
I develop an application (transformer.html) with XDK ( ThreeJs and WebGL )   to control another application. The communication is established via a WebService ( VB ASP.Net ). The first version of this transformer.html had NO WebGL neither crosswalk. In debug and emulator-Mode all is fine . Also compiled as a legacy hybrid mobile APK and published to my Samsung Galaxy Tab 3 OK!..The Problems POPup when i implement CrossWalk AND XMLHTTPrequest in my APP.

The same origine police is NO problem. I placed this on webserver side ( in web.config ).....

<webServices>
      <protocols>
        <add name="HttpGet"/>
        <add name="HttpPost"/>
      </protocols>
    </webServices>

As said - the constallation  Transformer-APP on Tablet   --  WebService ---  TargetWebApplication   is running perfect in my local network!

THE Problem:

the problem i run in came up with implementing a simple WebGL-Grafik. ALL is running perfect in Simulation and debug..Also when i just run this in a firefox browser.  BUT when i build an APK this combination ( CrossWalk & XMLHTTPrequest ) fails!

i tried the whole weekend and currently it seem::

XMLHTTPrequest ( or even the POST via jQuery !! ) work fine under Adroid Legacy build. I could make the APK running BUT there was NO Crosswalk WebGL graphic visible on my APP. So HTTP Post was OK BUT NO CROSSWALK. I´m wondering if it is possible to build a legacy App with crosswalk. Even the XDK own Crosswalk-DEMO I was NOT able to build as a hybrid Legacy APK!?

CrossWalk was OK on my APP when i build with CrossWalk for android - BUT in this case HTTPRequest seem not possible. My connection to the webService fails ....i got a 404...But as said all communication should be there ..as in other mode ( legacy, emulation, browser..whatever ..) its working.

 So - the moment it seem to me that the combination of HTML POST and Crosswalk seem not possible.

i extracted the issue in this smal code example: it show a webGL cube and ( scroll bit down ) a button. This button fire the XMLHTTPREQUEST. it has some console.log to catch the error messages..

my Setup:

- XDK1816 ( latest release I got automatically! )
- Samsung Galaxy TAB 3
- I placed the  complete XDK-Project here as an attachment....Not sure if this is the best way to share - i will in parallel provide THIS transformer-Version on my private website:  www.pimpyourparty.de

if you need more info from my setup please let me know

thanks in advance for any help or hint

Kristina

[kristina_k_]

some little remark..the code will be available and running for some time on the www.pimpyourparty.de in some hours ( this night )!

[kristina_k_]

just want to alert - also with the latest version  XDK 1826  the topic from above does NOT work

[PaulF_IntelCorp · Accepted solution]

Can you provide the complete project directory contents, not just the www directory, I think there may be some issues in your project settings which are stored in the <project-name>.xdk file in the root directory of the project. My suspicion is you do not have the proper white list setting on the Build Settings section of the Projects tab (the "Domain list" section).

For security reasons, this default white list is blank.
 

[kristina_k_]

Hi Paul

Thanks for your reply

After 2 nights  - i got the xdk crosswalk demo now running with my webservice POST:

there are still some questions but this is what i found:

in the intelxdk.config.xxxx.xml  i need : <access origin="*"/>
the changes i made in manifest.json seem to be ignored ( i tried different settings - but without success )
it seem that XDK is overloading the native XMLhttpRequest under cordova(?) ..i saw this in the debugger

some FAQ on my side:

does it matter if i use UI: jquery or AppframeWork?
May i have to open a pure HTML5 or in combination with Cordova?
following your hint i can adapt the myAPP.xdk  BUT is there a Flag in der XDK Gui somewhere  i can set this Option?
 

I´m just following your hint and check the myAPP.xdk file

from the workung demo:

{
  "project": {
    "projectSettingsVersion": "1.2",
    "creationData": {
      "type": "Demo",
      "projectTypeName": "com.intel.xdk.projecttype.webapp",
      "src": "https://edge-intel.s3.amazonaws.com/jsapp/production/release-2014-ww51/sample-webgl/sample.zip",
      "projectGuid": "9c4d6e0e-4c4c-486c-bf7c-bc7d57bce998",
      "lastModifiedDate": 1425844837863,
      "creationDate": 1423528155615
    },
    "sourceDirectory": "www",
    "cordovaPluginsDirectory": "plugins",
    "startFile": "index.html",
    "projectFiles": {},
    "projectDirectories": {},
    "libraries": [],
    "cordovaPlugins": [],
    "serviceMethods": [],
    "buildConfigurations": {
      "Android": {
        "platform_": "android",
        "runtime_": "W3C on Cordova",
        "name_": "Android",
        "preferences_": {
          "android-minSdkVersion": "10",
          "android-targetSdkVersion": "19",
          "android-installLocation": "auto"
        },
        "isActive_": true,
        "appName_": "ThreejsWebGL",
        "appID_": "xdk.sample.threejswebgl",
        "appAccess_": [
          {
            "origin": "*"
          }
        ],
        "icons_": [],
        "splashes_": [],
        "addlPermissions_": "",
        "excludedLibraries_": "",
        "iosProvs_": [],
        "cordovaCLIVersion_": "4.1.2",
        "crosswalkVersion_": "10",
        "appVersion_": "0.0.1",
        "appDescription_": "A sample that uses the three.js library with 3D WebGL Renderers & touch.",
        "appVersionCode_": "1"
      },
      "Android-Crosswalk": {
        "platform_": "android",
        "runtime_": "W3C on Crosswalk",
        "name_": "Android-Crosswalk",
        "preferences_": {
          "android-minSdkVersion": "14",
          "android-targetSdkVersion": "19",
          "android-installLocation": "auto"
        },
        "isActive_": true,
        "appName_": "ThreejsWebGL",
        "appID_": "xdk.sample.threejswebgl",
        "appAccess_": [
          {
            "origin": "*"
          }
        ],
        "icons_": [],
        "splashes_": [],
        "addlPermissions_": "",
        "excludedLibraries_": "",
        "iosProvs_": [],
        "cordovaCLIVersion_": "3.5",
        "crosswalkVersion_": "10",
        "appVersion_": "0.0.1",
        "appDescription_": "A sample that uses the three.js library with 3D WebGL Renderers & touch.",
        "appVersionCode_": "1"
      },
      "iOS": {
        "platform_": "ios",
        "runtime_": "W3C on Cordova",
        "name_": "iOS",
        "preferences_": {
          "ios-target": "6",
          "ios-configuration": "adhoc"
        },
        "isActive_": false,
        "appName_": "ThreejsWebGL",
        "appID_": "xdk.sample.threejswebgl",
        "appAccess_": [
          {
            "origin": "*"
          }
        ],
        "icons_": [],
        "splashes_": [],
        "addlPermissions_": "",
        "excludedLibraries_": "",
        "iosProvs_": [],
        "cordovaCLIVersion_": "3.5",
        "crosswalkVersion_": "stable",
        "appVersion_": "0.0.1",
        "appDescription_": "A sample that uses the three.js library with 3D WebGL Renderers & touch."
      },
      "Windows8": {
        "platform_": "windows8",
        "runtime_": "W3C on Cordova",
        "name_": "Windows8",
        "preferences_": {},
        "isActive_": false,
        "appName_": "ThreejsWebGL",
        "appID_": "xdk.sample.threejswebgl",
        "appAccess_": [
          {
            "origin": "*"
          }
        ],
        "icons_": [],
        "splashes_": [],
        "addlPermissions_": "",
        "excludedLibraries_": "",
        "iosProvs_": [],
        "cordovaCLIVersion_": "3.5",
        "crosswalkVersion_": "stable",
        "appAuthor_": "Intel XDK",
        "appVersion_": "0.0.0.1",
        "appDescription_": "A sample that uses the three.js library with 3D WebGL Renderers & touch."
      },
      "WebApp": {
        "platform_": "webapp",
        "runtime_": "W3C",
        "name_": "WebApp",
        "preferences_": {},
        "isActive_": false,
        "appName_": "ThreejsWebGL",
        "appID_": "xdk.sample.threejswebgl",
        "appAccess_": [
          {
            "origin": "*"
          }
        ],
        "icons_": [],
        "splashes_": [],
        "addlPermissions_": "",
        "excludedLibraries_": "",
        "appVersion_": "0.0.1"
      },
      "Firefox": {
        "platform_": "firefoxos",
        "runtime_": "W3C on Firefox OS",
        "name_": "Firefox",
        "preferences_": {},
        "isActive_": true,
        "appName_": "ThreejsWebGL",
        "appID_": "xdk.sample.threejswebgl",
        "appAccess_": [
          {
            "origin": "*"
          }
        ],
        "icons_": [],
        "splashes_": [],
        "addlPermissions_": "",
        "excludedLibraries_": "",
        "appVersion_": "0.0.1"
      },
      "Chrome": {
        "platform_": "chromeos",
        "runtime_": "W3C on Chrome OS",
        "name_": "Chrome",
        "preferences_": {},
        "isActive_": false,
        "appName_": "ThreejsWebGL",
        "appID_": "xdk.sample.threejswebgl",
        "appAccess_": [
          {
            "origin": "*"
          }
        ],
        "icons_": [],
        "splashes_": [],
        "addlPermissions_": "",
        "excludedLibraries_": "",
        "appVersion_": "0.0.1"
      },
      "Facebook": {
        "platform_": "facebook",
        "runtime_": "W3C on Facebook",
        "name_": "Facebook",
        "preferences_": {},
        "isActive_": false,
        "appName_": "ThreejsWebGL",
        "appID_": "xdk.sample.threejswebgl",
        "appAccess_": [
          {
            "origin": "*"
          }
        ],
        "icons_": [],
        "splashes_": [],
        "addlPermissions_": "",
        "excludedLibraries_": "",
        "appVersion_": "0.0.1"
      }
    },
    "gameAssetDirectory": "asset",
    "gameMetadata": {},
    "projectTags": []
  }
}

from my non-working myAPP:

{
  "project": {
    "projectSettingsVersion": "1.2",
    "creationData": {
      "type": "App Designer",
      "projectTypeName": "com.intel.xdk.projecttype.jsapp",
      "src": "appDesigner",
      "projectGuid": "0b387374-c534-4157-9981-442ea5a0858c",
      "lastModifiedDate": 1426290619357,
      "creationDate": 1425851131096
    },
    "XDK-app-designer": "true",
    "sourceDirectory": "www",
    "startFile": "index.html",
    "projectFiles": {},
    "projectDirectories": {},
    "libraries": [],
    "serviceMethods": [],
    "cordovaPluginsDirectory": "plugins",
    "cordovaPlugins": [],
    "buildConfigurations": {
      "Android": {
        "platform_": "android",
        "runtime_": "Cordova 3.x",
        "name_": "Android",
        "preferences_": {
          "android-minSdkVersion": "10",
          "android-targetSdkVersion": "19",
          "android-installLocation": "auto"
        },
        "isActive_": true,
        "appName_": "CU9Mini",
        "appID_": "xdk.intel.blank.ad.template",
        "appAccess_": [],
        "icons_": [],
        "splashes_": [],
        "addlPermissions_": "",
        "excludedLibraries_": "",
        "iosProvs_": [],
        "cordovaCLIVersion_": "4.1.2",
        "crosswalkVersion_": "10",
        "appVersion_": "0.0.1",
        "appAuthor_": "Intel XDK",
        "appDescription_": "Template to develop a packaged mobile web app using the App Designer UI editor.",
        "appVersionCode_": "1"
      },
      "Android-Crosswalk": {
        "platform_": "android",
        "runtime_": "Crosswalk with Cordova 3.x",
        "name_": "Android-Crosswalk",
        "preferences_": {
          "android-minSdkVersion": "14",
          "android-targetSdkVersion": "19",
          "android-installLocation": "auto"
        },
        "isActive_": true,
        "appName_": "CU8",
        "appID_": "xdk.intel.blank.ad.template.crosswalk",
        "appAccess_": [],   I din´t have
        "icons_": [],
        "splashes_": [],
        "addlPermissions_": "",
        "excludedLibraries_": "",
        "iosProvs_": [],
        "cordovaCLIVersion_": "4.1.2",
        "crosswalkVersion_": "10",
        "appVersion_": "0.0.1",
        "appAuthor_": "Intel XDK",
        "appDescription_": "Template to develop a packaged mobile web app using the App Designer UI editor.",
        "appVersionCode_": "1"
      },
      "iOS": {
        "platform_": "ios",
        "runtime_": "Cordova 3.x",
        "name_": "iOS",
        "preferences_": {
          "ios-target": "6",
          "ios-configuration": "adhoc"
        },
        "isActive_": false,
        "appName_": "CU8",
        "appID_": "xdk.intel.blank.ad.template",
        "appAccess_": [],
        "icons_": [],
        "splashes_": [],
        "addlPermissions_": "",
        "excludedLibraries_": "",
        "iosProvs_": [],
        "cordovaCLIVersion_": "4.1.2",
        "crosswalkVersion_": "10",
        "appVersion_": "0.0.1",
        "appAuthor_": "Intel XDK",
        "appDescription_": "Template to develop a packaged mobile web app using the App Designer UI editor."
      },
      "Windows8": {
        "platform_": "windows8",
        "runtime_": "Cordova 3.x",
        "name_": "Windows8",
        "preferences_": {
          "windows-publisher-display-name": "",
          "windows-publisher-id": ""
        },
        "isActive_": false,
        "appName_": "CU8",
        "appID_": "xdk.intel.blank.ad.template",
        "appAccess_": [],
        "icons_": [],
        "splashes_": [],
        "addlPermissions_": "",
        "excludedLibraries_": "",
        "iosProvs_": [],
        "cordovaCLIVersion_": "4.1.2",
        "crosswalkVersion_": "10",
        "appVersion_": "0.0.0.1",
        "appAuthor_": "Intel XDK",
        "appDescription_": "Template to develop a packaged mobile web app using the App Designer UI editor."
      }
    },
    "gameAssetDirectory": "asset",
    "gameMetadata": {},
    "projectTags": []
  }
}

Now i guess i will manage this :-)  

thanks a gain for help and answer

greets
kristina

[PaulF_IntelCorp]

On the Projects tab you will find a "Build Settings" section. In "Build Settings" you will find a section named "Domain List" where you can enter the domains you wish to provide access to (or use * or all domains). This defaults to blank for security reasons. We do not recommend using * but and explicit domain list.

[kristina_k_]

Hallo Paul

Finally it was this little * at the right place :-)
It was worth the time. I read tons of info considering this HTTP stuff...so it was a brilliant learning curve ;-)

later this weekend i will summarize and also state this in stackOverflow..as i had also there a little helpeMe placed.

For now i am very HAPPY

Thanks again for your time and effort

Kristina