Utilize AJAX and JavaScript to retrieve file information and facilitate file downloads

I have developed a script that intercepts Captcha form submissions. Typically, when the form is submitted, a file will be downloaded (such as exe or zip) in the usual way where it appears at the bottom of the Chrome browser and gets stored in the "downloads" directory.

However, I do not want the script to actually save the downloaded file on the user's computer. So, I modified the form submission process to handle the download using AJAX, and store the file data in a variable. Then, another function uploads this data to a PHP page.

Is there a way to retrieve information about the downloading file, such as its name and type? The file could be named 'Application.1.2.zip', but I am unsure how to get this data from the AJAX request that initiates the download. I only need this information to identify the file type and store it correctly on the second domain.

The current workflow involves downloading a file from Domain A (in any format) via AJAX, storing it temporarily, and then uploading it to Domain B using AJAX as well.

Thank you, Dan.

javascriptajax

Answer №1

One way to solve this issue is by using the Content-Disposition HTTP header. According to RFC2616 from W3C:

The Content-Disposition response-header field has been proposed as a means for the origin server to suggest a default filename if the user requests that the content is saved to a file. This usage is derived from the definition of Content-Disposition in RFC 1806 [35].

content-disposition = "Content-Disposition" ":"
                          disposition-type *( ";" disposition-parm )
disposition-type = "attachment" | disp-extension-token
disposition-parm = filename-parm | disp-extension-parm
filename-parm = "filename" "=" quoted-string
disp-extension-token = token
disp-extension-parm = token "=" ( token | quoted-string )

For example:

    Content-Disposition: attachment; filename="fname.ext"

This method allows you to handle it all in one request.

If you're working with JavaScript, you can extract the filename like this:

var disposition = httpRequest.getResponseHeader('Content-Disposition');
var filename = disposition.substring(disposition.indexOf('=') + 1);

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

Delete the span element if the password requirements are satisfied

I am implementing password rules using span elements. I aim to dynamically remove each span that displays a rule once the input conditions are met. Currently, I have succeeded in removing the span related to the minimum length requirement but I am unsure h ...

javascripthtmlangularjsregex

A blank screen of errors pops up when attempting to update through a form

Encountering a white error screen when attempting to add an item using a form in Python / Django. I'm currently debugging the issue but lacking information. Any guidance on where to look next would be greatly appreciated. Models.py from __future__ i ...

javascriptpythonhtmlcssdjango

TypeError: The function cannot be performed on the value of 0 in the Array.from

I encountered a peculiar error while attempting to utilize Array.from with Array.prototype.map. let fn = Array.from.bind(Array); // [Function: bound from] fn('test') // [ 't', 'e', 's', 't' ] ['test ...

javascriptarrays

The process of obtaining and sending a token from an HTML page while submitting a form request to a Laravel 5 application involves a few key steps

My application consists of the client side being written in HTML and Angularjs, while the server-side is using Laravel 5. Every time I submit my form, I send the models using $http to a route in my Laravel 5 app, but I continuously encounter the error: pr ...

javascriptangularjslaravel-5csrf-protection

Display a preview window once the image has been chosen

I have created an image preview div to show the selected image's thumbnail. Everything was working fine so far. But now, I want this div to be hidden when the page initially loads and only become visible when a user selects an image to upload. Here is ...

javascriptjqueryhtmlcss

Ways to extract a single digit from the total sum of a date in the format of 15-06-2015

Is there a way to extract a single digit from the sum of a number in date format, such as 15-06-2015? My goal is to convert the date format 15-06-2015 into a single-digit value by adding up the numbers. For instance: In the case of 15-05-2015, the output ...

javascriptnode.js

Loading an ASP.net page on the client side

Can someone tell me the event for pageload on clientside? function onPageLoad() { setSelectedIndexTo(1); } I attempted to do this, however no changes occur. Appreciate any help. Thanks! ...

javascriptasp.netajaxclient-side

Exploring the concept of chained ajax requests technique

As I come across numerous queries related to users needing to perform nested ajax calls, the debate arises whether it is a wise decision to nest them or not. The majority suggests breaking down the process into several functions, like so: function firstC ...

ajaxnested

The CSS_MODULES encountered a module build error when utilizing the extract-text-webpack-plugin

While processing CSS with CSS modules in a production environment, I encounter an error, but everything works fine in the development environment. Here is the configuration for webpack.base.js: const path = require("path") const webpack = require("webpac ...

javascriptcssreactjswebpackcss-modules

Encountering an Axios Error 404 while attempting to save my information to the MongoDB database

I am encountering an Axios error 404 when trying to register details in a MongoDB database. The error message I am getting is - "Failed to load resource: the server responded with a status of 404 (Not Found)." You can view the Error 404 Image for reference ...

javascriptreactjsmongodbaxios

Implementing a JavaScript function that directs to the current page

I have set up my index page with a link that looks like this: <li onClick="CreateUser()"> <a href="#CreateUser">CreateUser</a> </li> When the "Create User" list item is clicked, the main page content is populated as follows: fun ...

javascripthtmlcss

How can I prevent overwriting previous input data in LocalStorage using Draftjs?

I have implemented a draftjs rich text editor to store my text input in local storage. The current functionality allows me to enter text and save it to local storage by clicking the save button. See the code snippet below: import React from "react"; impor ...

javascriptreactjslocal-storagestatedraftjs

What is the best way to enable a link upon clicking while simultaneously disabling the others using JavaScript?

When I click on a link, I want to handle just that one element. However, when I click on another link, the active class is not being removed from the previous ones. Can anyone offer assistance with this issue? Here's my code: let parentT = document.qu ...

javascriptclickaddeventlistenertargethandle

Obtaining data from a callback function within a NodeJS application

There is a function in my code that performs a backend call to retrieve an array of names. The function looks something like this: module.exports.getTxnList = function(index, callback) { ....some operations ..... .... callback(null, respon ...

javascriptnode.jsfunctioncallback

Tips for closing print window dialog during Protractor testing

Currently, I am performing end-to-end testing using protractor. During a specific test, I need to verify if the print button is successfully creating a PDF. When the test clicks on the button, it triggers a print window dialog as shown below: https://i.st ...

javascriptjqueryangularprotractor

Error: Chrome is reporting an "Unexpected token :" while Firefox is showing a "SyntaxError: missing ; before statement" issue

Here's the code snippet in question: function getCategoryResponse() { var appid = "1"; $.ajax({ type: 'GET', url: 'http://itunes.apple.com/WebObjects/MZStoreServices.woa/ws/genres?id=36&callback=myCallbackFu ...

javascriptjqueryajax

What is the best way to create a percentage glyphicon star icon that reflects a decimal average rating?

I have an average rating of 4.3 and I need to create a logic to display this as 4.3 stars (4 whole stars and the 5th star partially filled). The maximum rating is out of 5. Despite referring to examples on Stack Overflow and creating a JSFiddle, I am unabl ...

javascriptangularjshtmltwitter-bootstrap-3woff

Using various hues for segmented lines on ChartJS

I am working with a time line chart type and I want to assign colors to each step between two dots based on the values in my dataset object. In my dataset data array, I have added a third item that will determine the color (if < 30 ==> green / >30 ==> red ...

javascriptchart.js

Whenever there is a click event triggered within the map function, it will affect every element within the collection

I am struggling to make changes to a specific item in the map function when clicked. Can someone assist me with achieving this functionality? const Product = ({categories}) => { const [active,setActive] = useState(true) function activeCat ...

javascriptreactjsreact-hooksnext.jsjsx

Save multiple form values within a single cookie

As someone who is new to JavaScript, I am seeking some guidance. I came across a code snippet online that allows for saving form input values in separate cookies: function storeValues(form) { setCookie("field1", form.field1.value); setCookie( ...

javascript