Community
Showing results for 
Search instead for 
Do you mean 
Reply

Simple implementation of API sample

Accepted Solution Solved
Copper Contributor
Posts: 42
Country: United States
Accepted Solution

Simple implementation of API sample

I'm pretty new to REST, JSON, and AJAX.  I'm trying to implement a sample from the Web API, but I'm not able to get so much as a response - success, failure, or otherwise.  My test is a simple html page with a button that calls a function with the following:

 

$.ajax({
   type: "GET",
   dataType: "json",
   url: "http://localhost/Act.Web.API/api/Contacts/<Contact ID here>",
   success: function () {
      alert("success!");
   },
   error: function () {
      alert("error!");
   },
   headers: {
      "Authorization": "Bearer <key goes here>"
   }
});

 

When I click the button, nothing happens.  I confirmed the function is called, but I get neither success nor error.  I assume I'm doing something wrong, but I can confirm the ContactID and the bearer key work for the API sample page.  Could someone provide a simple sample of a script which uses GET api/Contacts/{id}?

 

Thanks.


Accepted Solutions
Solution
Accepted by topic author bconner26
‎01-28-2016 11:32 AM
Employee
Posts: 236
Country: USA

Re: Simple implementation of API sample

[ Edited ]

I don't know why I didn't catch this before, but if you are running js in a browser, could very well be a CORS issues.

 

Basically, the js you are executing isn't from the same origin as the API, and browsers don't like that (prevents malicious js).   Our API needs to support CORS requests from the browser, which it does, and we need to trust the domain where your js is hosted.  Which we let you support.

 

In a production environment, you can do that via our Web API configuration file.  Or you can do that dynamically via API (we have a CORS endpoint).

 

In a development/test enviornment, you can tell your browser to knock if off (effectively allow cross domain requests without CORS)- I would recommend doing that first to see if that's the issue.  Every browser is difference of course.  Here's how to do it in Chrome:

http://stackoverflow.com/questions/3102819/disable-same-origin-policy-in-chrome

 

If you are just trying to play around with the API, I would recommend using something like Postman, a Chrome add-in, rather than js.  You won't have these issues Smiley Happy  If you are trying to develop a js app however, welcome to the world of CORS Smiley Happy

View solution in original post


All Replies
Employee
Posts: 236
Country: USA

Re: Simple implementation of API sample

Is it possible your token expired?  They expire hourly.

Copper Contributor
Posts: 42
Country: United States

Re: Simple implementation of API sample

Thanks for the reply.  I confirmed that the token was good by running the online sample immediately before testing it with my page.

Solution
Accepted by topic author bconner26
‎01-28-2016 11:32 AM
Employee
Posts: 236
Country: USA

Re: Simple implementation of API sample

[ Edited ]

I don't know why I didn't catch this before, but if you are running js in a browser, could very well be a CORS issues.

 

Basically, the js you are executing isn't from the same origin as the API, and browsers don't like that (prevents malicious js).   Our API needs to support CORS requests from the browser, which it does, and we need to trust the domain where your js is hosted.  Which we let you support.

 

In a production environment, you can do that via our Web API configuration file.  Or you can do that dynamically via API (we have a CORS endpoint).

 

In a development/test enviornment, you can tell your browser to knock if off (effectively allow cross domain requests without CORS)- I would recommend doing that first to see if that's the issue.  Every browser is difference of course.  Here's how to do it in Chrome:

http://stackoverflow.com/questions/3102819/disable-same-origin-policy-in-chrome

 

If you are just trying to play around with the API, I would recommend using something like Postman, a Chrome add-in, rather than js.  You won't have these issues Smiley Happy  If you are trying to develop a js app however, welcome to the world of CORS Smiley Happy

Copper Contributor
Posts: 42
Country: United States

Re: Simple implementation of API sample

[ Edited ]

Thanks again Xavier.  I followed the instructions from Stack Overflow and got a Chrome browser with disabled security running; however, the behavior is the same.  The function is definitely being called, but I'm getting neither success nor error.  I made sure to update my token.

 

I open Chrome via command prompt to disable security, navigate to the file, and click the button.  Here's the entire HTML page, which is on my local file system.  For testing, I'm hard-coding the ID and key.

 

<html>
<body>
<button type="button" onclick="getContact()">Get a Contact</button>
<script>
function getContact() {
   alert("Getting contact");
   $.ajax({
      type: "GET",
      dataType: "json",
      url: "http://localhost/Act.Web.API/api/Contacts/<id goes here>",
      success: function () {
         alert("success!");
      },
      error: function () {
         alert("error!");
      },
      headers: {
         "Authorization": "Bearer <token goes here>"
      }
   });
}
</script>
</body>
</html>

 

Edit:

I ran in IE11 with a debugger and discovered I'm getting an error:

JavaScript runtime error: Unable to get property 'ajax' of undefined or null reference.

 

I'm looking into this.  So far, no luck.

 

Edit 2:

I got it.  I needed to add this line to my page:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

 

Thanks for your help, Xavier.

Copper Contributor
Posts: 89
Country: Netherlands

Re: Simple implementation of API sample

Xavier,

 

how can I enable CORS? I've put the following in my C:\Program Files (x86)\ACT\Act.Web.API\web.config under 'system.webServer' but it does not work:

 

<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
</customHeaders>
</httpProtocol>

 

I get 'Response for preflight has invalid HTTP status code 401' .

 

When I leave the above out (the vanilla Act! web API web.config), I get:

 

'Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://actwebapi.tendenznoord.nl' is therefore not allowed access. The response had HTTP status code 401.'

Greetings,

ACT Certified Consultants
TendenZ
the Netherlands
Employee
Posts: 236
Country: USA

Re: Simple implementation of API sample

Good question.   We actually just improved this.

 

In web.config for Web API, you should see a EnabledCorsOrigins where you can add the domain of the trusted js source.  

 

Starting in Web API .42 and later, we'll create a separate web.customer.config, for you to modify.  The above config will be for us to replace.

Copper Contributor
Posts: 89
Country: Netherlands

Re: Simple implementation of API sample

Hi Xavier,

 

thanks for your answer.

 

My web.config didn't have that CORS entry yet, so I just downloaded/installed the newest API from the website.

 

But now, when hitting the Test button, I get this 500 message back from the server that it can't find the Admin.xml file, which didn't bother the previous API:

 

{
"message": "An error has occurred.",
"exceptionMessage": "Kan een gedeelte van het pad C:\\Program Files (x86)\\ACT\\Act for Windows\\PadFiles\\Admin.xml niet vinden.",
"exceptionType": "System.IO.DirectoryNotFoundException",
...
}

 

To clarify my situation: My CORS problem is on my local development PC, where the API itself works. The other problem you replied to is on our server.

 

 

Greetings,

ACT Certified Consultants
TendenZ
the Netherlands
Employee
Posts: 236
Country: USA

Re: Simple implementation of API sample

.  Can you verify that path exists?  

 

Web API will look in HKLM\Software\\Act\\Install and get the value out of InstallPath, and append PadFiles\\Admin.xml to look for admin.xml file.

Copper Contributor
Posts: 89
Country: Netherlands

Re: Simple implementation of API sample

Hi Xavier, no, the path does not exist. I have to confess I have stille v17 on my development PC. But before the API upgrade this was not a problem.

Can it be that I just have to upgrade to v18 to get this working?

Greetings,

ACT Certified Consultants
TendenZ
the Netherlands