Using PHP in Web Debug

Hi!

We are trying to move our PC application to Web as well. So far we are loving PlayCanvas and it’s feature list, and getting to know it more and more. Our application is an interactive property sales application, that must use up-to-date data from an external database.

We have added jQuery to the project, and we can do PHP calls just fine. However, I have a question about this.

Is it possible to test with PHP files directly from the editor (with Debug Play) WITHOUT having to manually download the project, put it locally next to the PHP file, OR have the PHP file hosted on the web somewhere with open access?

We have our database set up properly with only read permission user etc. We also have a plan for the DB host that does not limit read or writing so if someone accidentally can access it, that will mean no extra expenses for us. Also it has DDOS protection so that’s not an issue either, it would be just easier if we could test directly here instead of having to upload the modified PHP file to the public net each time we change something.

Thank you a lot in advance!

Hi @at_3DigitStudio and welcome,

PHP can be executed by a webserver only so there is no point in adding those files to your PlayCanvas project.

But if your server is ready to accept incoming Rest calls you can do so directly from PlayCanvas. jQuery can execute in the project and call your server endpoints to get/post data.

The only thing you may need is to configure your server to accept incoming requests from the playcanvas.com domain name, which is used when you launch your app from the editor.

2 Likes

Hi!

Thank you for the quick response. I already have jQuery added to the project that gets loaded dynamically. I can access the PHP script placed on any domain. The only issue with this is as I have stated in my original post, is if I change something in the PHP file, I need to re-upload it onto the server, then I need to edit my JS files in PlayCanvas to use for example the new fields that I’m getting from the DB, then I can test everything.

So what you are saying that there is no possibility for this at the moment?

So PlayCanvas, much like a regular webpage executes fully on the client (browser), so any server side logic or code usually isn’t included with it.

You can’t execute PHP from the PlayCanvas editor, much like you can’t execute PHP in a regular HTML/CSS/JS webpage (browsers can’t run PHP!). You need to have those files uploaded to a server and a call to it has to be executed.

Now much like you can add HTML/CSS/JS in a .php file and have them execute together, potentially you could add your PlayCanvas build to it. But still you will have upload a new build to your server with each change. There is an automation API that you can use to help you with that, though I am not sure that’s what you are asking.

If I understand correctly you have a form inside a .php that you would like to add to your PlayCanvas project? HTML files can be easily added to the PlayCanvas editor, so maybe another option is to abstract your form from any .php code you are running and have a final single POST request done to your .php endpoint with that user’s data.

1 Like

Yeah I know the front-end part of PlayCanvas. I’ll outline our application below so it’s easier to see what I wish I could do.

So we have a 3D model in the scene, a building. On this model we have boxes, each of these boxes represent an apartment. I have a script attached to these buildings, that save their data (Name, Price, Size, Rooms, Floor, etc.)

Currently, I have a PHP script, that connects to a MySQL database, gets these fields, encodes it in a JSON and returns this JSON. At the moment the code looks like:

$.ajax({
        type: "GET",
        url: "http://somerandomsite.com/getdb.php",
        data: {},
        dataType: "json",
        success: function(data){}
});

The question is if it would be possible to have the PlayCanvas editor save and run this script somewhere, uploaded to the project for example, so my code would change to:

$.ajax({
        type: "GET",
        url: "/scripts/php/getdb.php",
        data: {},
        dataType: "json",
        success: function(data){}
});

instead of having to make a call to an external URL.

This way I could manage the changes in the PHP and the JS file in the same place instead of having to edit my JS via PlayCanvas, then edit my PHP locally with a code editor and re-uploading the modified PHP each time to the external URL.

Yes, got it what you mean, though the PlayCanvas server can’t host and execute PHP scripts.

So for those specific files you will have to host them externally.

1 Like

I see. Thank you for the clarification!

1 Like

To make it easier to handle the paths, you could use a global prefix.

Eg
Somewhere in a JS file

var SERVER_PREFIX = "http://somerandomsite.com/"

And the code would be:

$.ajax({
        type: "GET",
        url: SERVER_PREFEIX + "getdb.php",
        data: {},
        dataType: "json",
        success: function(data){}
});

When it comes to production, the prefix can be changed to:

var SERVER_PREFIX = "/scripts/php/"

That way it be a single change when moving from staging to production.

2 Likes

Yeah that can help a lot. Would still love to see this as a feature. :grin:

1 Like

I’m not sure what you mean by a feature? I don’t it be something we would add a feature beyond conditional builds? :sweat_smile:And it is something you can do now within a project.

Some developers use the REST API to download the build and do post processing to strip/modify code. Maybe that would work for you as well?

Being able to add PHP files to the project, the same way you can add HTML, CSS or JSON, that could execute things like connecting to a remote DB, etc. So basically when you do a debug play via the editor, you could get an incredibly basic backend running with it to test features.

It’s unlikely that PHP would be supported unfortunately. The best approach is what Leonidas has suggested which is to whitelist the launch tab full URL on where the DB is hosted and use some variables to make it easy to switch between the dev and production database servers.

2 Likes