How can I perform a cross-domain XMLHTTPREQUEST to communicate with an FTP server using the appropriate syntax?

I am currently using a webDav CORS plugin to manage files on a webDav server through POST/PUT/GET/REMOVE/ALLDOCS requests.

Now, I am attempting to achieve the same functionality for FTP but am facing difficulties with the xmlhttprequest syntax (I keep receiving error code 0).

According to this page on Mozilla, it is possible to utilize xmlhttprequests for file transfers and FTP as well. However, I have not been able to locate a functional example or tutorial.

Here is my current attempt, which results in an access to restricted URI denied error:

function reqListener () {
  console.log(this.responseText);
}

var oReq = new XMLHttpRequest();
oReq.onload = reqListener;
oReq.open("GET", "ftp://<username>:<passeword>@mydomain.de/folder/test.txt", true);
oReq.send();

I also tried a standard Ajax request:

$.ajax({
  url: "ftp://sharedspace.domain.provider.com/folder/test.txt",
  type: "GET",
  async: true,
  dataType: "text",
  crossdomain : true,
  headers : {
    user: "<username>",
    password: "<password>"
  },
  success: function(e){
    console.log("success");
    console.log(e);
  },
  error: function(e){
    console.log("error");
    console.log(e);
  },
}); 

However, this method also fails and returns a status code of 0.

Question:
What is the correct syntax for performing a cross-domain XMLHTTPREQUEST for transferring files via FTP?

Thank you!

EDIT:
The most helpful resource I encountered was this page here, although it only provides scattered information that I struggled to piece together.

EDIT
Another potentially useful link

Answer №1

In the world of web development, it is crucial to understand that most major browsers do not support file and ftp requests via xmlHttpRequest, despite what the Mozilla MDN docs may suggest. This limitation underscores the importance of serving web projects from a server environment, even if it is running on the same machine. The file:// protocol simply does not work for testing or developing xmlHttpRequest functionality.

Microsoft's Internet Explorer explicitly states that it only supports http/https protocols for xmlHttpRequest. Similarly, the W3C specification for xmlHttpRequest emphasizes that it is designed exclusively for HTTP/HTTPS requests. While some implementations may offer additional protocol support beyond HTTP and HTTPS, such functionality falls outside the scope of the specification.

When it comes to Cross-Origin Resource Sharing (CORS), this feature is restricted to HTTP/HTTPS requests due to its reliance on HTTP headers as outlined in the W3C spec. Unlike HTTP, FTP lacks an equivalent mechanism for handling headers, making it incompatible with CORS functionality.

Answer №2

oReq.open("PUT", "ftp://`<user123`>:`<pass123`>@mydomain.com/folder/sample.txt", true);

req.setRequestHeader('Content-Type', "text/plain");

req.send("Sample content for sample.txt. It will replace the existing content");

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Angular 1.5 component causing Typescript compiler error due to missing semi-colon

I am encountering a semi-colon error in TypeScript while compiling the following Angular component. Everything looks correct to me, but the error only appears when I insert the this.$routeConfig array: export class AppComponent implements ng.IComponentOp ...

Divide the division inside the box by clicking on it

I am looking to create a unique div with a random background color and a width of 100px. Additionally, I want to have a button that, when clicked, will split the original div into two equal parts, each with its own random background color. With each subs ...

Anticipate the completion of Subject callback execution

Take a look at the code snippet below: const mA = async () => { try { const subscription = myEmitter.subscribe(url => getD(url)); const la=()=>{...}; return la; } catch (error) { throw error; } }; ...

The created hook does not execute when navigating to the same route with a different query parameters

One of my components has a created hook set up as follows: created() { if (this.$route.query.q) { //fetchdata } } But, when I try to change the URL within the same component using $router.push(`?q=${search}`), the URL updates but the creat ...

Is it possible to use jQuery to set a value for a form control within an Angular component?

I'm currently working on an Angular 5 UI project. In one of my component templates, I have a text area where I'm attempting to set a value from the component.ts file using jQuery. However, for some reason, it's not working. Any suggestions o ...

Ensuring a radio button is pre-selected by default in React by passing in a prop

Assume I have a React function similar to this function Stars({handleStarClick, starClicked}) { if (starClicked === 3) { document.getElementById('star3').checked = true } return ( <div className="rate"> ...

Looking to include a data-* attribute within a div element for the utilization of a third-party JavaScript library like React or Next.js?

let speed = '{ "speed": 0.2 }'; <div className="section jarallax h-100vh" data-jarallax={speed} style={{backgroundImage: "url('/images/header-bg.jpg')"}} id="home"> </div> <Script src="./js/parallax.js" strate ...

Is there a missing X-AppEngine-Region in the headers of the AppEngine application?

I've been trying to access the Region and Country in my request, but it seems like the X-AppEngine-Region and X-AppEngine-Country headers are missing. Sometimes I see headers like alt-svc content-length content-type date etag server status via ...

Is there a way to compel Google Maps to load within my Angular application by implementing an Angular Directive?

I am encountering an issue where my Google Map fails to display most of the time. It seems that the map is not fully rendered when the rest of my data is populated in my Angular view. Is there a way to force the map to load? I have done some research and ...

What is the method for automatically verifying elements within nested ng-repeats?

My div contains ng-repeat elements that are interconnected. Each ng-repeat element has checkboxes, and I want to automatically check the related elements in other ng-repeats when a top ng-repeat element is checked. Here is the actual representation of the ...

Is there a way to personalize the header outline of the mui-material datagrid?

Can someone help me modify the appearance of the Mui Datagrid outline to something different than its default setting? I'm having trouble uploading my code. Are there any reference materials or sample code snippets available for this modification? ...

Is your Vue.js chart malfunctioning?

I have been experimenting with chart.js and vue.js. The component I created is called MessageGraph, and it is structured like this (with data extracted from the documentation): <template> <canvas id="myChart" width="400" height="400">< ...

Finding repeating elements in an array of objects

Is there a way to identify duplicates in an array based on type, name, and size, increment the amount, and then remove the duplicate entries? [ { "name": "Pizza with pepper", "imageUrl": "...", ...

The user values in jQuery alert function are correct, but the saveorupdate function fails to save null values in the database table

While using the alert function in jQuery, the user input values are alerted correctly, but for some reason they are being stored as null in the database table. Can anyone help me identify what might be causing this issue or what I might be doing wrong? I& ...

What is the method to display Post values to the user without necessitating a page reload?

Currently, I am attempting to utilize Ajax to send the user's inputted data from a JSP page. Through Ajax, I have successfully transmitted the variable "vars" to the Jsp page. The output upon registration includes: Registration is Successful. Welcome ...

"Exploring the differences between request.body, request.params, and request.query

I am working with a client-side JS file that includes: agent = require('superagent'); request = agent.get(url); Afterwards, the code looks something like this: request.get(url) //or request.post(url) request.end( function( err, results ) { ...

Node Express and React Axios have implemented a CORS policy that restricts access to XMLHttpRequest

Currently, my node server is running on localhost port 5500 and react is on localhost port 3000. I am using Axios to send requests to the node backend. Interestingly, when I set axios.defaults.withCredentials = true, I encounter an error. However, if I swi ...

The concept of matryoshka logic applied to data manipulation

"mainData"{ entities:[] }, "data2":{ entities:[ { name:"mainData": //entites }, { name:"mainData": //entites }, { name:"m ...

Facing issues when attempting to link two databases using Express

Encountering an issue while attempting to use two Oracle databases simultaneously. My startup function only executes the first connection try-catch block, but displays the console log connection message of the second try-catch block without actually estab ...

How to extract a variable value from a different HTML page using jQuery

I have an HTML page named "page1.html" with the following content: <div> <div id="content"> content </div> <script type="text/javascript"> var x=5; var y=2; </script> <div id="ot ...