I have an admin control panel where admin users can set a few options and then click a button to run a report. The report should return a CSV file download prompt to the user.
I am using ui-router and $resource services. The response headers/mime type are set correctly, but the CSV file is returned as text (no file download initiated) by the $resource handler.
I tried creating the download link directly, by forming a querystring from the $scope, but unfortunately my API's authentication scheme uses a custom HTTP header token and it's not possible to send that to the API (which is also on another subdomain) via an anchor tag, such as this one:
Run
Is there a way to initiate a file download prompt using an XHR request (with custom header)?
I'm using a custom header token so downloading the report via a simple link is impossible; the request has to be made via XHR. My two-part solution:
Returned the CSV data from the API directly as text, removing file attachment headers. This is the correct solution, anyway, because it keeps the REST JSON API unconcerned with file downloads, which are a browser concept.
Wrapped the API response data in a Blob, and then used https://github.com/eligrey/FileSaver.js to initiate a file download.
A drawback is this requires IE10+, but that is okay in my case.
Related
I am currently working on a application with React as frontend and Nodejs as backend.
I am using multer and minIO to store the files.
Currently:
I have a form where the user fills up some data and also has the option to upload files such as PDF/JPEG etc (multiple input fields for file).
I am using forkmik along with material UI for validation and styling.
So when a user fills up the form (data is a json object), if there is any file upload done it does a POST request to "/upload" uploads the file to the storage engine and then returns a path of where the file is stored.
Then I send one more POST request to "/" to save the user info along with the path that it returned earlier onto MongoDB.
I trying to make it as a single post request to "/" but cannot do so, this is what I have tried,
is to send the user info with content-type "multipart/form-data" along with the files, I am only able to get the "req.files" array properly while the "req.body" of the user information is shown as "[Object: null prototype] { 'values.general_information.first_name': 'Amy',
'values.general_information.last_name': 'John' }" and so on.
I am trying to receive it in a proper json format but cannot do so.
Since the data I was receiving was [Object: null prototype], in the body converted to string using JSON.stringify() and on the backend parsed the incoming data using JSON.parse(), without using react FormData and was able to make it into a single POST request using multipart/form-data as I was uploading files as well.
I have one extension api, I upload it form web/resource/REST API, affter upload, it works well. however, I used the code to upload, i used the PageAPI.createPage() to upload extension, it upload success, but it doesn' work, I check the file on server, from the server, I can't find the extension from the ${BONITA_HOME}\bonita\client\tenants\1\work, it only exist on ${BONITA_HOME}\bonita\client\tenants\1\temp, debug, the files is invode the pageAPI servlet, and invode the PageDataStore.createEngieenPage(), so my question is how can i use the REST API to add extension and deploy it?
In order to deploy a Bonita REST API extension programmatically you need to:
Call the loginservice REST API for authentication
Send the file to a temporary folder on server side using the uploadPage servlet
Register the new REST API extension by calling the portal/page REST API
I create a basic Groovy script that demonstrate that.
I had an existing POST API which was used to sent an object to server. Now I want to attach a file to the header of the same file. Is it possible to do such a thing. Can a request have multiple content-type.
I tried using ngFileUpload directive, and provide my object to data field of Upload.upload method. However, by doing this the entire data object seems to go in header and the request fails.
Any suggestions for sending file in headers and JSON in request body of a POST call??
I eventually found out that a HTTP request can have a single Content-type. This is as per the standards. However it is still possible and quite easy to send data along with a file using the FormData Object. The support for FormData though is not across all the versions of various browsers.
I'm currently using a dropbox client js script to push zip files to a folder (in test, a couple of k, in production, a couple of hundred meg) - there currently isn't a server/back end, so am posting from an arraybuffer, not a server url.
var zip = new JSZip();
zip.file("test.txt", "Hello World\n");
var content = zip.generate({type:"arraybuffer"});
// ... code to pick a dropbox folder ...//
client.writeFile(url+"/"+fileName, content, function(error){ ... etc
This all works fine - client is able to write the binary file (which Dropbox's own Saver is unfortunately unable to do). I'm trying to see if Kloudless is able to perform the same, since I also need to support google, box, etc at some point. https://github.com/kloudless/file-explorer/'s documentation about its saver says the files are an array of urls ..
explorer({
...
files: [{
"url": "http://<your image url>",
"name": "filename.extension"
},
It doesn't seem to like local storage file references using URL.createObjectURL(blob), so I'm guessing the api is telling the remote services to pull the files rather than pushing their data.
You are correct that the Kloudless API backend servers stream the file from the URL to the final destination in whichever cloud service you would like the file to be uploaded to (e.g. a folder in a Dropbox account).
If the files are present only on the client-side, I would recommend using the Kloudless Chooser to instead prompt the user to choose a folder to save the files in, and then handle uploading the file data to that destination via the client-side manually.
To do this, refer to this example configuration: https://jsfiddle.net/PB565/139/embedded/
I have set retrieve_tokens to true so that my client-side JavaScript will receive not just the metadata of the folder the user chooses to upload the data to but also the Bearer token to use to gain access to the user's account. This allows the client-side JavaScript to then make upload or multipart upload requests to Kloudless to upload the file data to that folder. The advantage of multipart uploads is that an error uploading one chunk wouldn't require the whole upload to be retried.
Be sure to add the domain you are hosting the File Explorer on to your Kloudless App's Trusted Domains (on the App Details page) so that it can in fact receive the Bearer token in the response JS callback. In my JSFiddle example, I would have to add 'fiddle.jshell.net' to my app's list of Trusted Domains to be able to receive the Bearer token to perform further requests from the client side to the Kloudless API.
I would like to get the request XML in my Web service method and would like to save it. I know I can use LoggingInInterceptor to do that. However, I do not want to use it. The reason is when I save the request XML, I would like to perform user validations, get the client name and use the client name as the File name to save it.
Is there a way I can get the request XML in my Web service method.
No, you cannot. But you can write a generic HTTP service which gets the text content of a request.