如何使用 POST 或 GET 发送带有负载的 PUT 请求？

Question

I need to send a PUT request with a payload to an API (Philips Hue Bridge), but I have some limitations in javascript. I can only use:

XMLHttpRequest methods:

open(method, url [, async = true [, username = null [, password = null]]])
Sets the request method, request URL, and synchronous flag. Supported request method : GET, POST

send(data = null)
Initiates the request. The optional 'data' argument allows only UTF-8 encoded string type. The argument is ignored if request method is GET.

abort()
Cancels any network activity.

This limitation comes from the Tizen Wearable Web Widget Specification

Philips Hue Bridge API expects:

URL: http://hostname/api/username/lights/lightKey/state

Method: PUT

Payload example: {"on": true}

What I tried:

var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://hostname/api/username/lights/lightLey/state?on=true');
xhr.send();
Response: 400 (Bad request)

var xhr = new XMLHttpRequest();
xhr.open('POST', 'http://hostname/api/username/lights/lightLey/state?on=true');
xhr.send();
Response: 400 (Bad request)

Also tried GET and POST with following URL endings:
../state?{on=true}
../state?{on:true}
../state?{"on"=true}
../state?{"on":true}
Response: 400 (Bad request)

Again, I cannot use any additional libraries or commands besides the XMLHttpRequest methods mentioned above.

How can I solve this?

Answer 1

below is the sample code. you can try this way in your code.

var http = new XMLHttpRequest();
var url = 'your_URL.php';
var params = 'on=true';
http.open('PUT', url, true);

//Send the proper header information along with the request
http.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

http.onreadystatechange = function() {//Call a function when the state changes.
    if(http.readyState == 4 && http.status == 200) {
        alert(http.responseText);
    }
}
http.send(params);

Answer 2

Changing the method property to PUT should do the trick.

var xhr = new XMLHttpRequest();
xhr.open('PUT', 'http://hostname/api/username/lights/lightLey/state?on=true');
xhr.send();