cancel
Showing results for 
Search instead for 
Did you mean: 
cancel
Showing results for 
Search instead for 
Did you mean: 

Community Tip - Help us improve the PTC Community by taking this short Community Survey! X

Rest API Service problem from javascript

3studio
3-Visitor

Rest API Service problem from javascript

Hi,

I'm trying to create a function call to a service with javascript.

This is my code:

var data = "{\n\t\"input\":{\n\t\t\"space\": \"Hki Pa A 109\",\n\t\t\"type\": \"TEMP\"\n\t}\t\n}";

var xhr = new XMLHttpRequest();

xhr.withCredentials = true;

xhr.addEventListener("readystatechange", function () {

  if (this.readyState === 4) {

console.log(this.responseText);

  }

});

xhr.open("POST", "https://server-address/Thingworx/Things/PWIMAPI/Services/GetMeasurementPoints");

xhr.setRequestHeader("accept", "application/json");

xhr.setRequestHeader("content-type", "application/json");

xhr.setRequestHeader("appkey", "my-app-key");

xhr.setRequestHeader("cache-control", "no-cache");

xhr.send(data);

If I run this in postman it returns the correct json-content, but when I run it in a HTML-file on the server I get:

Status Code:

401 Unauthorized

Have anyone had a similar problem before? Any suggestion how to solve this?

11 REPLIES 11
posipova
20-Turquoise
(To:3studio)

How are you authenticating?

No extra authentication, just with the appkey.

posipova
20-Turquoise
(To:3studio)

Appkey in the url? Is it an 8.0 instance?

If so, https://community.thingworx.com/community/developers/blog/2017/06/08/new-technical-changes-in-thingworx-800#comment-3989

"The Allow Application Key as URL Parameter option can be enabled or disabled on the ThingWorx PlatformSubsystem’s configuration page, accessible at System > Subsystems > PlatformSubsystem > Configuration."

No it's not an 8.0 instance.

I haven't tried to pass it in the URL, I would rater pass it as it in the header. I mean it's working if I use the Postman plugin (in chrome). I also have it working from a Unity3D project, but when I add it as a javascript function that is run when a webpage loades then it won't authenticate.

posipova
20-Turquoise
(To:3studio)

If you open your browser developer tools, can you see any more detailed errors in the activity?

Failed to load "My Service URL": Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin "Webpage domain URL" is therefore not allowed access. The response had HTTP status code 401.

Am I missing some header tag on my webpage?

We have an Ionic App working, the only difference between our code and yours:

xhrfetchdata.open("POST", "url" ,true);

//setting up headers

xhrfetchdata.setRequestHeader("Content-Type", "application/json");

xhrfetchdata.setRequestHeader("Accept", "application/json");

xhrfetchdata.setRequestHeader("x-thingworx-session", "true");

xhrfetchdata.setRequestHeader("appKey", token);

Is your URL also a https or is it a http?

https of course.

pkg
5-Regular Member
5-Regular Member
(To:CarlesColl)

i am Also facing the similar error. please help..

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

 

My code 

<!DOCTYPE html>
<html>
<body>
<h2>Calling ThingWorx Restful Api using XMLHttpRequest Object</h2>

<div id="demo">
<button type="button" onclick="loadXMLDoc()">Call Thingworx Restful Service</button>
</div>
<script>
function loadXMLDoc() {
var xmlhttp;
var Data = JSON.stringify({
"ExtendFlag": "173"
});

var url = "URL";
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
//xmlhttp.setRequestHeader("Authorization","Basic "+btoa("Username"+":"+"Password"));

} else {
// code for older browsers
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("demo").innerHTML =
this.responseText;
}
};
xmlhttp.open("PUT", url, true);
xmlhttp.withCredentials = true;
xmlhttp.setRequestHeader("x-thingworx-session", "true");
xmlhttp.setRequestHeader("Access-Control-Allow-Credentials", "true");
xmlhttp.setRequestHeader("Access-Control-Allow-Methods", "GET");
xmlhttp.setRequestHeader("Access-Control-Expose-Headers","appkey, Content-Type");
xmlhttp.setRequestHeader("Access-Control-Allow-Origin", "*");
xmlhttp.setRequestHeader("appkey", "APPKEY");
xmlhttp.setRequestHeader("Content-type", "application/json");
xmlhttp.setRequestHeader("Accept", "application/json");
xmlhttp.setRequestHeader("cache-control", "no-cache");

xmlhttp.send(Data);
}
</script>

</body>
</html>

 

I am using this stand alone Page. 

ThingWorx version - 7

Tomcat version - tomcat 8

@CarlesColl

Try, append method=POST in your URL.

POST - to execute/invoke tx services via url.

Top Tags