Submitting code snippets to database using XMLHttpRequest - javascript

In my website, I send data to a database using XMLHttpRequest. I tried submitting code snippets and simple Spanish language characters, but when I check the received data, I only see what comes after those code snippets or characters, like this:
Data sent:
Hello <?xml version="1.0" encoding="utf-8"?>
Data received:
Hello
So, is there any way to submit code snippets or special characters using XMLHttpRequest? If there isn't, which is the best way besides php?
Here is my XMLHttpRequest code:
//call the function for the XMLHttpRequest instance
//create the variable that will contain the instance of the XMLHttpRequest object (initially with null value)
var xmlHttp;
if(window.XMLHttpRequest) {//for Forefox, IE7+, Opera, Safari, ...
xmlHttp = new XMLHttpRequest();
}else if(window.ActiveXObject) {//for Internet Explorer 5 or 6
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
//create pairs index=value with data that must be sent to server
var data = "title="+title+"&desc="+desc;
//sets the request
xmlHttp.open("POST","http://mywebsite.com/database.php",true);
//adds a header to tell the PHP script to recognize the data as is sent via POST
xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
//sends the request
xmlHttp.send(data);
//Check request status
//If the response is received completely, will be transferred to the HTML tag with tagID
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
document.getElementById("div").innerHTML=xmlHttp_refresh_es_ES.responseText;
}
}

Always encode your data before sending it, that way spaces and special characters shouldn't be an issue (as long as it's UFT8)
var data = "title=" + encodeURIComponent(title) + "&desc=" + encodeURIComponent(desc);

Related

"request sent by the client was syntactically incorrect" when making REST call to Jira

I'm using HTML macros in confluence to automate some tasks in Jira. I tried the following REST call in the code below to add a comment to a ticket and I get the error: 400: Bad Request. The request sent by the client was syntactically incorrect.
I can't see any issues with my JSON or code. This pretty much fails for other operations I've tried such as creating/updating tickets.
xmlhttp = new XMLHttpRequest();
var url = "http://<CONFLUENCEURL>.com:8090/plugins/servlet/applinks/proxy?appId=<APPID>&path=http://<JIRAURL>:8080/rest/api/2/issue/TEST-3/comment";
xmlhttp.open("POST", url, true);
xmlhttp.setRequestHeader("Content-type", "application/json");
xmlhttp.setRequestHeader("Accept", "application/json");
xmlhttp.onreadystatechange = function () { //Call a function when the state changes.
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
alert(xmlhttp.responseText);
}else{
console.log(xmlhttp.responseText);
}
}
var parameters = {
"body" : "Hello world!"
};
function addComment() {
xmlhttp.send(JSON.stringify(parameters));
}
I eventually created an identically ordered JSON object, turns out that the parser the server side uses does not follow the JSON specification in that it expects the correct order.
As in, the fix would be to follow the JSON specification server side, or replicate identically the structures being sent to the server.

What does XMLHttpRequest do in that code

I'm a beginner in Javascript , and I want to understand what the method XMLHttpRequest does.
This is the code that I was reading, and I was wondering if someone could explain what it is doing:
var xhttp;
xhttp=window.XMLHttpRequest?new XMLHttpRequest:new ActiveXObject("Microsoft.XMLHTTP"),xhttp.open("GET","script.php",!0),xhttp.send();
Hi I am not really good in explanations, but I will try to explain this in details as I see and understand this.
The XMLHttpRequest is an object. It is used for exchanging of data with a server. So with its use you can send some data to the script on the server(request) and get some data back from it(response). That response data can be displayed instantly on the page without page reloading. So this process call AJAX.
I would read your provided code as
//define a variable
var xhttp;
/*assign a XMLHttpRequest object to this variable
check if the global object window has a XMLHttpRequest object already
if not and user have a newer browser, create one (new XMLHttpRequest - for IE7+, Firefox, Chrome, Opera, Safari browsers) or user have an older browser (ActiveXObject("Microsoft.XMLHTTP") - for IE6, IE5 browsers)
xhttp.open method specifies the type of request(method GET, Script on server, asynchronous)
xhttp.send method sends the request to a server*/
xhttp=window.XMLHttpRequest?new XMLHttpRequest:new ActiveXObject("Microsoft.XMLHTTP"),xhttp.open("GET","script.php",!0),xhttp.send();
But you have to check the readyState property of the XMLHttpRequest object as well
xmlhttp.onreadystatechange = function() {
//4: request finished and response is ready
//200: "OK"
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
//display of returned data from the server
//it is available in this property - xmlhttp.responseText
}
}
The whole peace of code should look like:
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest(); // code for IE7+, Firefox, Chrome, Opera, Safari
} else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); // code for IE6, IE5
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
//display of returned data from the server
//jquery example
$('div').html(xmlhttp.responseText);
}
}
xmlhttp.open("GET", "script.php", true);
xmlhttp.send();
Hopefully this helped, good luck!
It's a reference to an AJAX request.
See more at the MDN site.
In a nutshell, it is sending a GET request to script.php.
An XMLHttpRequest is a JavaScript object made for making AJAX request. I am not fully sure that code is correct. Usually you make an instance of the XMLHttpRequest object. Then you check the window ready state to make the request. Finally you make the request. This is an example of that:
var xmlhttp;
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
callback(xmlhttp.responseText);
}
}
xmlhttp.open("GET", url, true);
xmlhttp.send();
I hope that helps!
Happy coding!

JSON URL not working with Parameters

I have written the following code to read a JSON document from an external URL. This worked fine when the URL was the following:
http://localhost/EWSimpleWebAPI/odata/Users?
But NOT when I modified the URL as the following:
http://localhost/EWSimpleWebAPI/odata/Users?$filter=USER_NAME%20eq%20%27corpnet\anuwlk%27&$select=PROFILE
Javascript
var xmlhttp = new XMLHttpRequest();
var url = "http://localhost/EWSimpleWebAPI/odata/Users?$filter=USER_NAME%20eq%20%27corpnet\anuwlk%27&$select=PROFILE";
xmlhttp.open("GET", url, true);
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
myFunction(xmlhttp.responseText);
errorAlert("Status OKAY");
} else{
errorAlert("Status Not OKAY")
}
}
xmlhttp.send();
I'm retrieving the JSON Document thru a Web API using OData. OData accepts parameters in the URL and it worked fine in POSTMAN. I'm developing a Google Chrome extension and I'm not sure if it supports this URL with Parameters.
It would be best to use some function ( encodeURIComponent(str) and encodeURI(str) come to mind) to encode the parameters correctly.
As wOxxOm commented, your issue seems that one of the parameter has an unescaped character \.

Using XmlHttprequest to send XML via POST to PHP on same server - 405 Method Not Allowed

Goal: To send XML using XmlHttpRequest as text/xml via POST to PHP file. PHP file then does magic and saves to an XML on the server. A component on an HTML page will be updated with data from the XML.
Problem: I saw success with this when testing with the php web server, which I initiated in command line with php -S 127.0.0.1:8000 but when tested on a Microsoft-IIS server, I got a "405 Method Not Allowed" response. When tested on an Apache server, I get a "200 OK" response, but server XML file is unchanged.
The Javascript code that sends the XML to PHP is something like this:
var xHttp;
if (window.XMLHttpRequest) {
xHttp = new XMLHttpRequest();
} else {
xHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xHttp.onreadystatechange = function() {
if (xHttp.readyState == 4 && xHttp.status == 200) {
update();
}
}
xHttp.open("POST", appLocation, true);
xHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xHttp.setRequestHeader("Content-Type", "text/xml");
xHttp.send(xmlDoc);
In the above code, xmlDoc is the XML I want to send and appLocation is the location on the server where the PHP file is. update() is a function I wrote to update a component on an HTML page with data from the XML file that is saved by PHP. From this, I would know that the XML has successfully changed.
The PHP looks like:
$xml = file_get_contents("php://input");
$xmlDoc = simplexml_load_string($xml);
// Magic ***
$xmlDoc -> asXml("some-file-on-server.xml");
If I can be successful on either one Apache or Microsoft servers, I would be content.
Thanks in advance! Hopefully this is detailed enough. I found a number of duplicates but nothing that quite helped me solve my problem.

Is there any data limit size for ajax xmlhttprequest post method my xhr get cut off?

I am trying to send some html data to php script using ajax xmlhttprequest post method. But for some reason My XHR POST REQUEST is cut off and not all data get transferred to my doit.php script. However the same html data from textarea form get passed to doit.php script correctly via normal form post method! could you guys help me overcome this problem and be able to pass this html data via xhr request ?
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("POST","http://www.mysite.com/doit.php?Name=test&Id=12345",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("outputtext="+siteContents);
I think you should also encodeURIComponent() your siteContents string:
xmlhttp.send("outputtext=" + encodeURIComponent(siteContents));
That's because POST variables are delimited by an ampersand (&). The problem probably is that your string is also containing an ampersand which will be interpret as the beginning of a new POST variable.
You could easily check this if you output all received POST variables in your PHP script:
var_dump($_POST);
This looks like a GET request to me, because of the question mark and name/value pairs in the URL:
http://www.mysite.com/doit.php?Name=test&Id=12345
Here's how to make a POST request with AJAX:
http://www.javascriptkit.com/dhtmltutors/ajaxgetpost2.shtml

Categories