How do I get AJAX to work after exporting projects?

Get help using Construct 2

Post » Mon Jan 30, 2017 3:22 pm

Hi!

I am trying to export a project, but I am having some problems with the AJAX. "Post to URL" and "Request URL" actions don't work in the exported version (I did already export to HTML5 and Cordova). I think this is strange, because "Request project file" action works perfectly. I have already checked it on multiple devices and with different Internet connexions, but it simply doesn't execute this two actions. Any clue?

Also, if anyone could help me with this problem it would be great.

Thank you for your help! :)
B
20
S
6
Posts: 143
Reputation: 1,666

Post » Mon Jan 30, 2017 6:26 pm

Are your post/request URLs online? If so, it is probably a cross-domain issue.

Making AJAX requests cross-domain or in preview
By default, browsers block AJAX requests across domains. This means, for example, a game on scirra.com can request other pages on scirra.com, but cannot request pages on facebook.com. This is an important security feature of web browsers (it is not specific to Construct 2 or its AJAX object).

Also, when previewing in Construct 2 the game runs on localhost. This counts as a different domain to the rest of the internet, so typically AJAX requests to any web page will fail during preview, unless the server explicitly allows cross-domain requests.

If you want AJAX requests to your server to work from any domain, or in preview, you can configure it to send the following HTTP header:

Access-Control-Allow-Origin: *

This will enable AJAX requests from any domain, but you should still be aware of the possible security implications of this. For more information on cross-domain requests see HTTP access control on MDN.


If it is a local post/request, check your file pathing.

Using file paths correctly
Never hard-code paths (such as using an action to write to a fixed file path like "C:\MyGame\MyFile.txt"). This unfriendly to users, and is often perceived as unprofessional, untidy, or filling the user's system with junk. Not only that but in many cases it simply will not work, since not all users have permission to read or write to folders outside of their user directory.

It is tempting to solve this by writing files to the application's folder. However this also may not work; on many versions of Windows, the Program Files folder requires administrator permission to write to, although you can read from it.

The solution is to write to the user's folder, which you almost certainly have write permission for. This is provided by the UserFolder expression. The correct way to determine a file path in the user's folder is like this:

NWjs.UserFolder & "myfile.txt"

If you only need to read files, and don't need to write them, you can safely use the application folder (NWjs.AppFolder) instead.
Mistakes were made.
B
51
S
25
G
107
Posts: 1,581
Reputation: 60,458

Post » Tue Jan 31, 2017 12:05 pm

I have tried but I still have the same problem. I have a sample capx and I exported it to a HTML5 version.

The project requests a PHP on a server that gets some values from a database. As you can see, when you run the capx, you can successfully see those values. If you run it on the exported version, there is an error. The requested PHP opens with
Code: Select all
<?php
header('Access-Control-Allow-Origin: *');
B
20
S
6
Posts: 143
Reputation: 1,666

Post » Tue Jan 31, 2017 5:08 pm

oosyrag wrote:If you want AJAX requests to your server to work from any domain, or in preview, you can configure it to send the following HTTP header:

Access-Control-Allow-Origin: *

You can add this in preview now!? How does one go about setting this?

ChesVCF wrote:I have tried but I still have the same problem. I have a sample capx and I exported it to a HTML5 version.

The project requests a PHP on a server that gets some values from a database. As you can see, when you run the capx, you can successfully see those values. If you run it on the exported version, there is an error. The requested PHP opens with
Code: Select all
<?php
header('Access-Control-Allow-Origin: *');

Make sure you can access the URL in a normal browser first, i.e. just type in the AJAX url into your browser and see what happens. You can always use the net tab of the debug tools to track the AJAX request and see why it failed.

Image
These are the requests from your live HTML5 app, and none of them failed. So all of the calls here are working fine. Is your C2 interpreting the reply appropriately?

Second observation, and probably why it is not working. Your "Access-Control-Allow-Origin: *" header never made it into your response headers. So your PHP is bad.
Image
https://www.ravenheart.ca/home
Company name changed to avoid Facebook-type shenanigans

"Someone once told me I bite off more than I can chew...

I told them I would rather choke on greatness than nibble on mediocrity."
B
22
S
6
G
1
Posts: 1,415
Reputation: 4,824

Post » Tue Jan 31, 2017 6:28 pm

gumshoe2029 wrote:Make sure you can access the URL in a normal browser first, i.e. just type in the AJAX url into your browser and see what happens.

I did, and it works perfectly.
gumshoe2029 wrote:Second observation, and probably why it is not working. Your "Access-Control-Allow-Origin: *" header never made it into your response headers. So your PHP is bad.

I think the PHP is good because it works in the preview, on every browser I tried and on the Intel XDK's simulator. I used the net tab of the debug tools and I found this
Image
I'm going to upload the PHP to a https server and check if it works in HTML5 (hopefully!)
B
20
S
6
Posts: 143
Reputation: 1,666

Post » Tue Jan 31, 2017 6:38 pm

Yes! It works!
B
20
S
6
Posts: 143
Reputation: 1,666

Post » Tue Jan 31, 2017 7:01 pm

Anyway, I'm sure there has to be a way to allow exported projects to request not only https URL's but also http URL's. By default, http are blocked.
B
20
S
6
Posts: 143
Reputation: 1,666

Post » Tue Jan 31, 2017 7:05 pm

gumshoe2029 wrote:
oosyrag wrote:If you want AJAX requests to your server to work from any domain, or in preview, you can configure it to send the following HTTP header:

Access-Control-Allow-Origin: *

You can add this in preview now!? How does one go about setting this?

From what I understand, it is a server/host side setting that can be configured into your web service (apache). Basically it means, from your server's point of view, that if a website or program that ISN'T on the same server requests a file, that it is OK to send it.

When you preview, your domain is basically local host, which is a different domain than your web host at http://www.****.com. So your request won't go through by default, unless your web host is specifically configured to allow it.
Mistakes were made.
B
51
S
25
G
107
Posts: 1,581
Reputation: 60,458

Post » Tue Jan 31, 2017 7:06 pm

ChesVCF wrote:Anyway, I'm sure there has to be a way to allow exported projects to request not only https URL's but also http URL's. By default, http are blocked.


It should be a setting on your host rather than anything you do in your project.
Mistakes were made.
B
51
S
25
G
107
Posts: 1,581
Reputation: 60,458

Post » Tue Jan 31, 2017 7:16 pm

oosyrag wrote:It should be a setting on your host rather than anything you do in your project.

Yes, on HTML5 games the setting will probably be on the host, but what if you want to export to Android? I'm sure there is a way to allow http connexions, but I imagine you have to change something in the apk's code and explicity allow such connexions.
B
20
S
6
Posts: 143
Reputation: 1,666


Return to How do I....?

Who is online

Users browsing this forum: Lancifer, nahima and 13 guests