Develop Reference

How do I convert an ObjectURL to a DB Insertable BLOB

Sending PHP the retval of the Object URL created from an image (blob:http://...) and using PHP's base64_encode() along side with file_get_contents() returns an error claiming that there is no stream or file.

How about send url of image. then use file_get_contents('http://...') to get the image file content.
For example, your image url is http://example.com/test.jpg
JS
// if image is a link
axiso.post(url, {image: "http://example.com/test.jpg"})
// if image is file select from local, upload file
let data = new FormaData();
formData.append("image", this.files[0]);
axiso.post(url, data, {headers: {'Content-Type': 'multipart/form-data'}})
PHP
// get file content from image link
file_get_contents('http://example.com/test.jpg')
// get content from upload file
$name= "image";
file_get_contents($_FILES[$name]);

New window and incorrect filename when saving data as CSV file

I am getting some CSV data from an Ajax request. I am trying to use FileSaver.js (https://github.com/eligrey/FileSaver.js/) to enable the end-user directly download this data as a CSV file.
This is the code used in my Ajax request handler.
jQuery.post(urlPrefix + "/api/ReportData",
dataToPost,
function (data, status) {
var blob = new Blob([data], { type: "text/csv" });
var fileName = "";
fileName += "Data-Export";
fileName += ".csv";
saveAs(blob, fileName);
});
This code is called from a button click event. Whenever the code executes, a new tab is opened, and the file is saved without a csv extension. In fact, the downloaded file has no extension at all. See the attached screenshot for details. The (7) is due to this being my seventh download.
The actual file that is saved is a valid file. If I manually set its extension to csv, I can use it properly. But I want to know how to use FileSaver to generate appropriate extension, and also download the file without opening a new tab.
What I have already tried
Export to CSV using jQuery and html

I found out this link https://code-maven.com/create-and-download-csv-with-javascript where it is possible to create a hidden anchor tag and download the file.
My new code is below
jQuery.post(urlPrefix + "/api/ReportData",
dataToPost,
function (data, status) {
var hiddenElement = document.createElement('a');
hiddenElement.href = 'data:text/csv;charset=utf-8,' + encodeURI(data);
hiddenElement.target = '_blank';
hiddenElement.download = 'Exported-Data.csv';
hiddenElement.id = "customTemporaryAnchor";
hiddenElement.click();
jQuery("#customTemporaryAnchor").remove();
});
When this code is executed, the file downloads with proper extension, and without any popup or new tab.

How to check if the PDF is blank in Angular JS?

Here is the code that loads the pdf file and download it:
$http.get('/retrievePDFFile', {responseType: 'arraybuffer'})
.success(function (data) {
var file = new Blob([data], {type: 'application/pdf'});
var fileURL = URL.createObjectURL(file);
window.open(fileURL);
});
For some reason, I want to check if the pdf is not blank before it gets downloaded. I don't want to download an empty pdf.
Or someone can tell me, how to convert PDF Stream to json or text, would be great.

In node/js, how can I display a text file that I fetched in the browser window?

I have a protected API that fetches the contents of a file. By protected I mean, I need to send in Authorization headers before the API will allow me to fetch the file contents.
How do I display this in a browser window?
Currently, my nodejs backend is returning the contents with Content-Type:text/html
On the frontend, my current code looks like this
$http.get(downloadUrl)
.then(function(resp) {
var data = resp.data;
var blob = new Blob([data], { type: "text/html" });
let objectUrl = (window.URL || window.webkitURL).createObjectURL( blob );
let anchor = document.createElement("a");
anchor.href = objectUrl;
anchor.download = 'source.html';
anchor.click();
window.URL.revokeObjectURL(objectUrl);
This just download the file though. I just want to display it, preferably in a new window.
Edit I believe this is a duplicate of this question and there is no front-end-only solution to it. It requires the backend to play a part, such as implementing a "Holder-Of-Key Authentication Scheme"

PDFjs custom file name with blob

I am using pdf js out of the box.
The problem is that I am using a blob "blob:http://localhost:9001/12fc5fc1-bd5f-4af1-a434-0e38cb55ead"
Because of this, the url doesnt contain ".pdf" so when viewer.js parses it, it dowloads as "document.pdf"
If there anyway to use a custom file name in this situation?
Thanks

Well, there are a couple of problems here:
1) When you use Blob you are pointing to an address of memory of your browser, thats the main reason you get that name.
2) to get a pdf, you should set your blob with the type of pdf, here is an example:
var blob = new Blob([data], {type: 'application/pdf'});
var url = window.URL.createObjectURL(blob);
you will get that extrange url but with a pdf extention.
The same you can do with zip or other type of file. Hope this answer helps!