Ajax - php location

1

I want to add an ajax function but the software complains it cannot find the php file. Can anyone give me a specific location where I should place the php file and what should be included in the properties window. Can I test a simple echo “Hello World” php file on local host? What would be the ajax call?

Bob Briscoe

2

The local server does not support PHP. If you want to test it, you’ll need to use a more full featured server. What operating system are you using?

3

Hi James,
Win 10. I am a pretty good programmer but have not used AJAX for some time. The problem I am having is getting started. I have an nsb app running on a server with php enabled. I put a test button on my app to see if I could call the php file. I just need to get a “Hello World” simple app working and I think I could then run with it. I opened Project and added a new code file, which I called HelloWorld. In the code I made a simple php file.

image.png
image.png1385×703 38.4 KB

I have a button on my form called cmdDoAjax. I added a function called "done:
Function done()
If req.status = 200 Then 'success
lblResponse.value=req.responseText
Else 'failure
msg = "Error: Status = " & req.status
If TypeName(req.statusText)=“string” Then msg = msg & " " & req.statusText
If TypeName(req.err)=“string” Then msg = msg & " " & req.error
MsgBox msg
End If
End Function

Under the button_click I wrote:
Function cmdDoAjax_onclick()
Dim req
req=Ajax(“helloworld.php”, done)
End Function

The nsbapp keeps complaining “Missing file helloworld.php”
image.png

I have not loaded it to my server but I need to put the HelloWorld someplace where the code can find it because when I run it on my desktop I get 404 file not found from the browser.

Can you tell me how I can get this code to run. Again, I have a server that should run it but I have not tried because I do not know where to put the php file.

Many thanks,

Bob Briscoe

4

helloworld.php needs a full path including the https:// otherwise JavaScript treats it as a call to localhost and localhost is the app context so there wouldn’t be a .php file or handler for it. Make sense?

5

Hi Phil,
First, thanks for looking at this. Your statement makes perfect sense, but I cannot get this to work. As I mentioned I created a new code file by selecting add new code file from the project menu and I got this:

image.png
image.png1477×733 44.2 KB

When I go to deploy to local folder. The app complains
image.png
Looking at the code I get the message:
Failed to load resource: net::ERR_FILE_NOT_FOUND

Is it possible for you to give me a step by step on how to create the php and then where to save it. When I upload the project to the server, it loads OK except I cannot find HelloWorld.php.

I thought for starters I would make a helloworld.php with NotePad and then save it to my www folder on my server and then type in the address into the browser “https:/www.getmyshot.net/helloworld.php”

I got a reply ( note I modified the php file )

<?php echo "Hello World Response" ?>

image.png

So, It works but I thought the php file would load from the project.

When I put in the AJAX code in my project

Function cmdDoAjax_onclick()
Dim req
req=Ajax(“http://www.getmyshot.net/helloworld.php”, done)
End Function

Function done()
If req.status = 200 Then 'success
lblResponse.value=req.responseText
Else 'failure
msg = "Error: Status = " & req.status
If TypeName(req.statusText)=“string” Then msg = msg & " " & req.statusText
If TypeName(req.err)=“string” Then msg = msg & " " & req.error
MsgBox msg
End If
End Function

I get this error:
Uncaught ReferenceError: req is not defined
at Object.done (code.js:95)
at i (jquery2.js:2)
at Object.fireWith [as rejectWith] (jquery2.js:2)
at z (jquery2.js:4)
at XMLHttpRequest. (jquery2.js:4)
www.getmyshot.net/helloworld.php:1 Failed to load resource: net::ERR_FAILED
index.html:1

Uncaught ReferenceError: req is not defined
at Object.done (code.js:95)
at i (jquery2.js:2)
at Object.fireWith [as rejectWith] (jquery2.js:2)
at z (jquery2.js:4)
at XMLHttpRequest. (jquery2.js:4)
www.getmyshot.net/helloworld.php:1 Failed to load resource: net::ERR_FAILED
index.html:1 Access to XMLHttpRequest at ‘http://www.getmyshot.net/helloworld.php’ from origin ‘null’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
appstudioFunctions.js:1949 Error encountered:
Script error.
Url:
Line: 0
Column: 0
code.js:95 Uncaught ReferenceError: req is not defined
at Object.done (code.js:95)
at i (jquery2.js:2)
at Object.fireWith [as rejectWith] (jquery2.js:2)
at z (jquery2.js:4)
at XMLHttpRequest. (jquery2.js:4)
www.getmyshot.net/helloworld.php:1 Failed to load resource: net::ERR_FAILED
index.html:1 Access to internal resource at 'file:///C:/GET%20MY%20SHOT%20Development/Backup%20GetMyShot%20082121/GetMyShot.appstud

So, it seems I am just not putting the helloworld.php in the right place. Can you help?

Thanks,

Bob Briscoe

6

I don’t really use the AppStudio UI, I’m a voltbuilder user who does everything in VisualStudio Code and write JS/HTML/CSS directly.

Having said that I still recognize the signs of what you’re dealing with. Here’s what I would do.

  1. Copy the url for the helloword.php from the browser
  2. Edit your req=Ajax() call and change the http to https.
  3. You have an error message that you haven’t noticed and you need to fix this problem before anything else. The error reads: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. CORS/Content-Security-Policy (CSP) is a set of permissions you put in your header that tells the app what it’s allowed to access. There are several good threads on here addressing this plus you can google CORS/CSP. You will have to go to https as the app stores won’t allow your app without it and, frankly, it’s the right thing to do for your users and yourself.
  4. Upload your project to your server and try again.

Just to help get you started on the CORS and so you can see what you’re looking for I’m pasting a sample from a test project I have that uses google maps.

  <meta http-equiv="Content-Security-Policy" content="default-src 'self' 'unsafe-inline' 'unsafe-eval' filesystem: gap: https://*.mydomain.com/ https://maps.googleapis.com/; style-src 'self' 'unsafe-inline' https://*.googleapis.com/; font-src 'self' data: https://fonts.gstatic.com/; script-src 'self' 'unsafe-eval' 'unsafe-inline' https://maps.googleapis.com/; img-src 'self' data: https://*.gstatic.com/ https://*.googleapis.com/; connect-src 'self' https://*.mydomain.com/ ws://localhost:*;">

Reading up on CORS will give you a good afternoon of fun! LOL

7

BTW, it struck me late last night that there’s another piece of information you’ll need for the php side.

Once you set your CSP in the html file header and you make your ajax request the .php must return the correct headers.

header('Access-Control-Allow-Origin: https://www.mydomain.com');

Directly after that header you’ll have to tell javascript what type of response your php will be sending. For instance:

header('Content-type: application/json');

There are lots of other content types (jpeg, html etc).