Tips for adjusting the file name and extension when saving a text file from a data URI

When I try to download data using a Data URI (this method works in Chrome and Firefox), I use the following code:

url1 = "data:attachment/plain;base64,encodeuri(<base64data-xyz>)"

By specifying the MIME type as attachment, it forces the file to download. If any other MIME type like text/html is used, the content will open in a new tab. Since I wanted to download the file, I used attachment/plain-xyz as the MIME type.

I attempted to use the download attribute, but each time the downloaded file is named "download" without an extension. It ends up being saved in my downloads folder as ".FILE," when I actually need it to be saved as "variable.txt."

Please advise on how to change the downloaded file name from "download.FILE" to something like "variable.txt." I have tried all attributes such as data, download, data-downloadurl, contentdisposition, and even attempting to set pom attributes, with no success.

Your assistance in converting the downloaded file content to a file with a specified filename and .txt extension would be greatly appreciated.

javascriptangularjs

Answer №2

// To sanitize the file name:
$file_name = preg_replace('/[^a-zA-Z0-9\-\_\.]/i', '', $_POST['file']);

// Setting up headers for download:
header("Cache-Control: ");
header("Content-type: text/plain");
header('Content-Disposition: attachment; filename="' . $file_name . '"');

For more information on content disposition, you can check out this link: [

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

Issue with implementing setTimeout on await fetch() result

I'm trying to figure out how to add a setTimeout to my request response when using await fetch. Currently, each response is being sent to a DIV in the HTML, but I want to introduce a delay of 5 seconds before each response appears. I attempted this s ...

javascriptasync-awaitfetch-api

Enhancing next-auth and i18n functionality with middleware in the latest version of next.js (13) using the app

Currently, I have successfully set up next-auth in my next.js 13 project with app router, and it is functioning as expected. My next step is to incorporate internationalization into my app following the guidelines provided in the next.js documentation. How ...

javascriptnext.jsnext-auth

Issues with triggering express.js app.post middleware

Logging to the console: app.use(function (req, res, next) { console.log(req.method) console.log('why is it not working?') }) However, the following code does not log anything: app.post(function (req, res, next) { console.l ...

javascriptnode.jsexpress

While the NPM package functions properly when used locally, it does not seem to work when installed from the

I have recently developed a command-line node application and uploaded it to npm. When I execute the package locally using: npm run build which essentially runs rm -rf lib && tsc -b and then npm link npx my-package arguments everything works sm ...

javascriptnode.jsnpmpackage

Encountering a TypeError when attempting to read the property 'name' of undefined while submitting a form in node.js

I'm currently working on a node Js project and I'm encountering an issue while saving form values to a mongoDB database. I've been troubleshooting but can't seem to pinpoint the cause of this error. The error is occurring at the router. ...

javascriptnode.jsformsexpresspost

Troubleshooting a problem with selecting options in Jquery

Looking for assistance with a jquery script. I have a select dropdown that fetches a list of options via Ajax. When a user clicks on an option, if a certain variable equals 1, an HTML div is added. If the variable changes to another value, the HTML div dis ...

javascriptjqueryajax

angular: handling duplicates in ng-repeat

Here is the JSON data: streams = [{ id: 0, codec_type: 'video', content: '1920x1040 - H.264 / AVC / MPEG-4 AVC / MPEG-4 part 10' }, { id: 1, codec_type: 'audio', content: '5.1(side) - cze - undefined' }, ...

javascriptjsonangularjsangularjs-ng-repeat

Crafting an interactive SVG element that maintains its clickability without interfering with mouseLeave events

Trying to Achieve: Changing color and displaying SVG when hovering over a row Clicking the SVG triggers a function, including external functions (not limited to ones defined inside script tags) Returning the row to its original form when mouse leaves Cha ...

javascriptcssreactjseventsreact-bootstrap

Is there a way to dynamically set the value of a React Material TextField in Auto Select mode?

Here is a React state: const [filterByInvoiceNo, setFilterByInvoiceNo] = useState( 0 ); This represents a React Material TextField: <TextField size="small" type="number" label="Invoice No&quo ...

javascriptreactjsmaterial-ui

Is there a way to create a nested object literal that will return the length of

I am working with JSON data that includes different locations (sucursales) and cars for each location. How can I write a function to calculate the total number of cars across all locations? [{"sucursal": "Quilmes", "direccion&q ...

javascriptnode.jsjsonexpressobject-literal

Displaying a division when a button is pressed

Despite my best efforts, I can't seem to get the chosen div to show and hide when the button is pressed. <button id="showButton" type="button">Show More</button> <div id="container"> <div id="fourthArticle"> <i ...

javascriptjqueryhtmlcss

Sharing data between two Angular 2 component TypeScript files

I'm facing a scenario where I have two components that are not directly related as parent and child, but I need to transfer a value from component A to component B. For example: In src/abc/cde/uij/componentA.ts, there is a variable CustomerId = "sss ...

javascriptangulartypescriptweb-frontend

Is there a way to retrieve the id of every post on my page?

Is it possible to send multiple post ids in JavaScript? I have successfully sent the first post id, but now I need to figure out how to send each individual post id. When inspecting the elements, I see something like this: <div data-id="post_1">< ...

javascriptphpajax

Generate a unique ID each time the page is loaded or refreshed

I'm currently working on a function that will display a unique ID or a different video each time the page is loaded or refreshed. My main objective is to design a splash intro popup that features a <section> with a full-screen YouTube video bac ...

javascript

Running jQuery in AngularJS partialsHow can I incorporate jQuery into AngularJS partials?

I'm currently leveraging the power of the Angular UI router to divide my web pages into partial views and load them accordingly. However, I've run into an issue where I can't seem to utilize jQuery within these partial views. My approach inv ...

javascriptjqueryangularjsangular-ui-router

The transformation of all relative URLs into absolute URLs is carried out

The issue at hand seems to be peculiar to Chrome and Firefox, as IE does not exhibit the same behavior. In my angular application, I've noticed a strange phenomenon. Once a specific view is loaded, all XHR requests made using relative paths are autom ...

javascriptangularjsxmlhttprequest

What is the best way to retrieve user input from a form within an Ajax.ActionLink?

My webpage is designed to be simple, featuring a picture and a comment section that functions as a partial view. I am looking to only refresh the partial view when a new comment is submitted. Here's what I have coded: <tr> & ...

javascriptjqueryajaxasp.net-mvcrazor

Reorganizing a list in AngularJS after adding a new item

I have made edits to the AngularJS ordering example in my Plunker. The ordering works fine initially, but when I add a new person using code to periodically update the list of contacts, the new person gets added to the bottom without re-sorting. Is there a ...

javascriptangularjs

Creating JavaScript code using PHP

In my current project, there is a significant amount of JavaScript involved. I'm finding that simply generating basic strings and enclosing them within "<script>" tags may not be the most efficient approach. What are some alternative methods fo ...

phpjavascriptmootools

Retrieve selected value from HTML input with datalist and use it as an argument in a method

I have a datalist in my HTML input where I need to pass the selected value into JavaScript / Angular. It must be passed because the datalist is being used in an HTML table with multiple entries. Most examples I've come across show how to grab the valu ...

javascripthtmlangularjs