I have an API server, which can reply to me with different formats of data. I can control this via 'Accept' header.
I need to download .csv file. To do it I must make a GET query with
Accept: 'text/csv'
header
How can I do it?
I know that I can do a XHR query, but in this case I don't know how to save data to file. Or I can do a window.open, but in this case I don't know how to set Accept header (and someone tell that it is impossible).
Related
I am trying to understand what information is sent to the target URL when making a fetch request with credentials set to include like so:
fetch(url, {credentials:include})
How does the server behind the target URL know to decode the credentials to validate authentication? I understand this may vary from scenario to scenario but trying to get a general understanding of the concept.
Thanks in advance!
I'm attempting to create an HTML-file that acts as a direct link to a cached site made by proxysite. Is there any way I can send a form containing a URL, without having the user fill in any field?
Sending it via ajax like so:
var params = {
"d" : "http://www.web.site/"
};
$.ajax({
url: "https://eu1.proxysite.com/includes/process.php?action=update",
type: "POST",
data: params
});
Seems to be purposefully blocked, as it returns this error message:
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
EDIT: I realize why the above won't work. Since I don't have access to the previously mentioned website, I am looking for a possible workaround.
The reason you are receiving the "No Access-Control-Allow-Origin" header is because the receiving server needs to provide CORS headers. If you have access to the proxysite you will need to set the following headers to allow your request to go through
<?php
header("Access-Control-Allow-Origin: *");
Where the asterisk is the domain you want to allow. If you leave the asterisk in the the server will accept all requests from any local scripts on any domain.
Regarding sending the form without having the user input any fields-- Yes, it's possible to send data without user input. The way you are doing it is the correct way to send data via the jQuery Ajax method.
How can I download an XML file when I call a REST endpoint (which responds in XML format) with AngularJS?
So the flow is simple, I have created a button on the UI which makes a call to a REST endpoint (which has a response in an application/xml format) and its response should come as a download on the UI.
If I understand the question correctly (use the browser's download functionality when the user clicks the link), then this is not a question about angular really.
In order to cause a file to download you need to do two things:
Attempt to navigate the browser to the URL that returns the XML (i.e. don't make an AJAX request for it).
e.g. <a href="http://myserver.com/my/REST/endpoint>Click here</a>
Ensure the XML content is being served with headers that would force a download. If you don't do this, the browser may attempt to render the XML itself rather than downloading it. You could try either setting the Content-Type header to be applicaton/octet-stream or look into using the Content-Disposition header:
Content-Disposition: attachment; filename=someFileName.xml;
I'm totally new to file uploads....I'm using angular-file-upload which creates an XHR outside of angularjs to upload files to google cloud storage. When I try to upload I keep getting the error below. How can I resolve this?
400 Bad content type. Please use multipart.
Here's my controller setup:
var uploader = $scope.uploader = new FileUploader({
url: 'https://www.googleapis.com/upload/storage/v1/b/bucketsbuckets/o?uploadType=multipart',
headers : {
'Authorization': 'Bearer ya29.lgHmbYk-5FgxRElKafV4qdyWsdMjBFoO97S75p4vB0G0d6fryD5LASpf3JUY8Av9Yzhp9cQP8IQqhA',
'Content-Type': 'multipart/form-data'
},
autoUpload:true
});
For those who are using fetch just remove the content-type on your header.
I found this issue on github and I quote:
Setting the Content-Type header manually means it's missing the boundary parameter. Remove that header and allow fetch to generate the full content type. It will look something like this:
Content-Type: multipart/form-data;boundary=----WebKitFormBoundaryyrV7KO0BoCBuDbTL
Fetch knows which content type header to create based on the FormData object passed in as > the request body content.
^^ this one worked for me.
The problem is that the endpoint you're using is for multipart uploads, but not FORM-based multipart uploads. If you set your Content-Type to "multipart/related" instead of "multipart/form-data", you should be able to proceed.
A multipart upload to that endpoint, "www.googleapis.com/upload/storage/etc?uploadType=multipart", expects a multipart message with exactly two parts, the first part being the metadata of the object, in JSON, and the second part being the data.
More on these requirements are here: https://cloud.google.com/storage/docs/json_api/v1/how-tos/upload
If, however, you'd like to do an upload in the style of a form submission, that's also possible, but the rules are different. In this case, you'll submit a POST to "storage.googleapis.com/BUCKET/OBJECT" with a variety of appropriate form parameters: https://cloud.google.com/storage/docs/reference-methods#postobject
Now, this all assumes you're trying to do an upload as a multipart request for some reason. That might be necessary if you need to set some specific metadata properties on the object, but if not, you may be making things harder for yourself. A simple PUT to "storage.googleapis.com/BUCKET/OBJECT" will work just fine (although I'm not familiar with angular-file-upload and don't know whether it supports non-form-style uploads).
I am redirecting user using window.location.href to a page that forces a file download using the following headers:
Content-Description: File Transfer
Content-Disposition: attachment; filename="foo"
As a result, user is not taken to the page, though asked if he wishes to proceed downloading the file.
How do I tell when the response from the server is received?
The user flow that I am trying to achieve:
Display loader.
"redirect" the user (with window.location.href).
Hide loader when response is received.
From your client side code, also pass an generated ID to the server, asking it to set a cookie for you to that value.
Your server side code should pass the cookie back with the downloaded file (in the HTTP headers).
Then you can poll for the cookie in your javascript after the redirect to see when the server has responded with a successful connection.