i need to post document.body.innerHTML to my domain's proxy. There is working PM2 and before it I used GET and it looked like:
var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://domain.ru/pmproxy?info='+document.body.innerHTML+'&location='+document.location+1);
xhr.send();
Now, because there is a limit of letters I need to us POST. How can I turn this into POST?
First make sure the receiving server method accepts post and if you want to send data in xhr post you can do like this
xhr.send("info='+document.body.innerHTML+'&location='+document.location+1")
or if a server accepts a json object then you can use xhr.send(document.getElementById('#form).serialize());
You should convert it to this:
var xhr = new XMLHttpRequest();
xhr.open('post', 'https://domain.ru/pmproxy');
xhr.send('info='+document.body.innerHTML+'&location='+document.location+1);
Also, I suggest you clean both parameters, so you can avoid problems in the future:
xhr.send('info='+encodeURIComponent(document.body.innerHTML)+'&location='+encodeURIComponent(document.location+1));
Furthermore, I don't really know why you're using document.location+1, but you can use document.location.href and save the +1 so your code looks cleaner:
xhr.send('info='+encodeURIComponent(document.body.innerHTML)+'&location='+encodeURIComponent(document.location.href));
Related
I'm using javascript's XMLHttpRequest to receive data from Github API and I am trying to use the custom media type specification but can't get it to work. Setting the Accept header doesn't change the format of the response at all. The result I get is always the default (JSON).
This is the code I'm using to make the request:
var url = "https://api.github.com/repos/mrdoob/three.js/issues/comments/241553390";
var xhr = new XMLHttpRequest();
xhr.open('GET', url);
xhr.setRequestHeader("Accept", "application/vnd.github.v3.raw");
xhr.setRequestHeader("Content-Type","application/vnd.github.v3.raw");
xhr.onload = function(ev) {
console.log("Response:", ev.target.response);
console.log("Headers:", xhr.getAllResponseHeaders());
};
xhr.send();
The response JSON contains a "body" attribute.
I tried changing the version from raw to other types and noticed that only the "body" attribute changes. Did I understand your question wrong? What other types of response does GitHub API support?
xhr.setRequestHeader("Accept", "application/vnd.github.v3.html"); results in "body_html" while xhr.setRequestHeader("Accept", "application/vnd.github.v3.html"); results in "body"
JSFiddle here - https://jsfiddle.net/3yqutj29/4/
You are requesting comments, which are all returned as JSON which you can use the media type to specify the body markdown. See: https://developer.github.com/v3/media/#comment-body-properties
The application/vnd.github.v3.raw is used for requesting a binary blob.
I found this tool called "sql.js" that can access sqlite database directly from javascript. But in order to use it, the user-side has to have the sqlite database file first. In my situation, the database is maintained at the server-side. So here is my question: how do I move the sqlite database file from the server-side to the user-side-javascript so that user-side can make use of this "sql.js" to access the database? Is it possible to do in an Ajax call? Any sample code would be really appreciated!
Think this example in the docs wasn't added at the time the question was asked:
<script src='js/sql.js'></script>
<script>
var xhr = new XMLHttpRequest();
xhr.open('GET', '/path/to/database.sqlite', true);
xhr.responseType = 'arraybuffer';
xhr.onload = function(e) {
var uInt8Array = new Uint8Array(this.response);
var db = new SQL.Database(uInt8Array);
var contents = db.exec("SELECT * FROM my_table");
// contents is now [{columns:['col1','col2',...], values:[[first row], [second row], ...]}]
};
xhr.send();
</script>
Bear in mind that if your database is large, SQL.js probably isn't suitable.
(Partly because you'll have to transfer the database to the user, and partly because SQL.js is memory hungry, so you may be better running the queries on the server anyway.)
I've just started to learn how to use APIs, but I'm having a little bit of trouble understanding exactly how to utilize them.
I was able to write the following code thanks to some online documentation, but I have some questions about how to add to it:
var xhr = new XMLHttpRequest();
xhr.open("GET", "http://api.openweathermap.org/data/2.5/weather?q=London&mode=xml", false); xhr.send();
console.log(xhr);
Now, when I run this code in my browser and I open the console, I get a dropdown with a whole bunch of stuff under it. First of all, how can I get the code to display JUST the response? I want the console to display just the XML to show when I run my code. Second of all, how do I parse the XML? Is there any way to get a value from an XML element and assign it to a JavaScript variable?
Thanks!
What you are printing is the XMLHttpRequest object itself, while what you actually want is the response from the request you've made. To get the response, you use
xhr.responseXML;
Which is a object of the type document. (See the MDN docs).
To exhibit the code, you can just
console.log(xhr.responseXML);
But to actually work with the response, you'll probably want to do as Josh suggested, and request from the API a JSON-formatted response (instead of a XML-formatted one).
You will probably want to do that asyncronously, too (see this). The page has a more robust example. Let's adapt it to show London's temperature:
var xhr = new XMLHttpRequest();
xhr.open("GET", "http://api.openweathermap.org/data/2.5/weather?q=London&mode=json", true);
xhr.onload = function (e) {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
console.log(xhr.responseText);
var response = JSON.parse(xhr.responseText);
console.log("Temperature(K): " + response.main.temp);
} else {
console.error(xhr.statusText);
}
}
};
xhr.onerror = function (e) {
console.error(xhr.statusText);
};
xhr.send(null);
Being async means that the xhr.onLoad function will be executed as soon as the response is received. Thus all of your code will be executed sequentially, and only when the response is received the onLoad will be executed.
You can get the response as a Document object.
Using your code above, you can reference xhr.responseXML and use the Document documentation to learn how to grab what data you need.
That dropdown is probably your browser formatting the response object in an interactive way for you.
xmlDoc=xhr.responseXML; will give you the actual resulting text
Alternatively: you could request a JSON object to make working with the data much easier.
var xhr = new XMLHttpRequest();
xhr.open("GET", "http://api.openweathermap.org/data/2.5/weather?q=London&mode=json", false); xhr.send();
var data= JSON.parse(xhr.responseText); //data is now a javascript object full of the API data
Note how the url now reads mode=json now.
var txt = http.responseText; -> it doesnt work in Chrome...
how i can change this line?
You should call method send at the end:
var http = new XMLHttpRequest();
var url = "http://example.com/logScore.php";
var params = "GameID=5&User="+name+"&Score="+score+"";
http.open("GET", url+"?"+params, true);
http.onreadystatechange = function() {//whatever you want}
http.send();
Without calling send request will not be send.
Doing AJAX and having it work X-Browser with vanilla-JS is a pain in the ass. I definitely recommend a library (like jQuery) to do this for you. Please see this answer for how to do it with plain JS:
Easiest way to retrieve cross-browser XmlHttpRequest
Is there a method in javascript to load a page without actually show that page?
I want to load a php page which will handle the database insertion tasks.
Use AJAX to get/send data to the serverside?
Yes there is, you can use the XMLHttpRequest for this.
here is a example
function done() {
console.log(this.responseText); // The response from the server
};
var XHR = new XMLHttpRequest();
XHR.onload = done; // Set the onload function
XHR.open("get", "something.php", true); // Type & File
XHR.send(); // Send the request
Here is some documentation on that MDN XMLHttpRequest