Can't send file using XMLHttpRequest - javascript

The code is simple and it works when I append a string to the FormData:
var data = new FormData();
data.append('String', stringVar);
var request = new XMLHttpRequest();
request.open('POST', 'upload.php');
request.send(data);
But if I append a file to the FormData (data.append('File', fileVar);) I get a 503 response.
The problem doesn't happen when I'm running the code on localhost, so I know there's no problem with the code and it's from the server. Maybe I should change some PHP or Apache settings on the server, I don't know.
Any help or comments would be appreciated.

Related

JS Node send JSON on PATCH with XMLHttpRequest

I try to send a JSON on a request on POST but it's not working
The code:
let req = new XMLHttpRequest();
req.open("PATCH", "https://discord.com/api/v8/users/#me/settings", true);
req.setRequestHeader("authorization", token);
req.setRequestHeader("content-type", "application/json");
req.send(JSON.stringify({custom_status: "hello"}));
it's need to send on JSON.stringify custom_status: with the text "hello"
When i try this, it's don't give me any error / logs it's show nothing but it's not working
if someone can help me, thanks in advance

Rss will not parse

I've been experimenting with xml data but I found an xml file with a structure that I've never seen before. I tried to call it using php and log it in the console but no luck any idea as to why? When I try this method with other files there seems to be no issue, for example, if you replace the url with this one "http://news.google.com/news?ned=us&topic=h&output=rss" it works fine. Code is below
PHP
$xml = "https://w1.weather.gov/xml/current_obs/display.php?stid=KATL";
echo file_get_contents($xml);
JS
var xhr = new XMLHttpRequest();
xhr.open("GET", "metar.php");
xhr.onload = function (response) {
var res = this.response;
console.log(res);
}
xhr.send();
This is not a problem with your script, but with the resource you are requesting. The web server is returning the "forbidden" status code.
You should probably check the https and the url.

static file append in form data using angular 7 to post api http

I am trying to attach a file in formData , attaching file by uploading input type=file is working fine
But in my scenario I am having static file in assets folder so whenever Im trying to post api formData should have file: attachment in order to get access. I am trying on this more than a day still I couldn’t fix this issue.Please someone assist on this.Thanks in advance
let formData = new FormData();
formData.append('file','../../../../../assets/file.txt');
this.http.post(this.parameter, formData).subscribe(event => {
});
this returns null in formData and seems no attachment happens with this
and another way,
var request = new XMLHttpRequest();
request.open('POST', '../../../../../assets/file.txt', true);
request.send(formData);
this returns 404 not found even though path is correct.

Upload and send string as file via telegram bot

I have a string that I want to send via a telegram bot, but not as a message (it's rather long) but as a file.
However I have some problems in creating and uploading this file to Telegram (since I need to post the file using multipart/form-data as specified in the API docs https://core.telegram.org/bots/api#sending-files).
Inspired by https://stackoverflow.com/a/22858914/4869973 I tried the following:
var file = new Blob([enc_data], {type: 'text/plain'});
var formData = new FormData();
formData.append('chat_id', '<id>');
formData.append('document', file);
var request = new XMLHttpRequest();
request.open('POST', 'https://api.telegram.org/bot<token>/sendDocument');
request.send(FormData);
but I only get a generic error POST https://api.telegram.org/bot<token>/sendDocument 400 (Bad Request)
I have never used XMLHttpRequest so I'm probably messing up with its usage but I can't find any solution.
Alternatives (possibly using plain js) are welcome.
Your variable naming was wrong. You named the formdata as formData and then when you sent the request you called it FormData.
Copy and paste this code, it should work. I tested it and it does. Make sure to replace the chat_id and token with valid ones else it won't work.
var chat_id = 3934859345; // replace with yours
var enc_data = "This is my default text";
var token = "45390534dfsdlkjfshldfjsh28453945sdnfnsldfj427956345"; // from botfather
var blob = new Blob([enc_data], { type: 'plain/text' });
var formData = new FormData();
formData.append('chat_id', chat_id);
formData.append('document', blob, 'document.txt');
var request = new XMLHttpRequest();
request.open('POST', `https://api.telegram.org/bot${token}/sendDocument`);
request.send(formData);

How to create an in memory file and upload to server using client side javascript?

I have a test suite written in JavaScript running in a browser that runs on an embedded system. The test suite collects a lot of data and I want to push that to the server. I could use a simple HttpRequest, post-method, but that would require a lot of character escaping to send the content. It would much simpler to upload it to the server as a file using http-file-upload.
Is there a way to create an in memory file and use http-file-upload to push it to a server, using client-side JavaScript?
Since the browser of the embedded system is Ekioh and the system itself is a minimal one, technologies such as flash, JavaApplet, SilverLight are not available. Only pure HTML5 and JavaScript are available.
I think a post would be the better way to do this. Dealing with escaped data is a much easier, more established problem then in-memory files and pushing files to the server with client side javascript. Moreover, escaping data is done for a reason. What you're trying to do is going to welcome a lot of security vulnerabilities.
Try doing something like this.
Snippet taken from Write javascript output to file on server
var data = "...";// this is your data that you want to pass to the server (could be json)
//next you would initiate a XMLHTTPRequest as following (could be more advanced):
var url = "get_data.php";//your url to the server side file that will receive the data.
http.open("POST", url, true);
//Send the proper header information along with the request
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.setRequestHeader("Content-length", params.length);
http.setRequestHeader("Connection", "close");
http.onreadystatechange = function() {//Call a function when the state changes.
if(http.readyState == 4 && http.status == 200) {
alert(http.responseText);//check if the data was revived successfully.
}
}
http.send(data);
This worked for me. The key part is to create a file and blob. I use angular JS to do the actual http call. However, once you have a file in memory, it shouldn't be too hard to send the data using your http client.
Note: I do the http call to https://httpbin.org/post. This echoes what the server received/parsed, which is useful while iterating to figure your problem out.
function multiPartPost(bodyObj) {
const url = 'https://httpbin.org/post';
const bodyJson = JSON.stringify(bodyObj);
const blob = new Blob([bodyJson], {
type: 'application/json;charset=UTF-8'
});
const fileName = 'jsonAttrs';
const file = new File([blob], fileName, {type: "text/json;charset=utf-8"});
const formData = new FormData();
formData.append(fileName, file);
return this.$http.post(url, formData, {
transformRequest: angular.identity,
headers: {'Content-Type': undefined}
});
}

Categories

Resources