Obtaining zip files using AngularJS

Upon entering the following URL in my browser, I am prompted to download a file:

My goal is to download this file using an AngularJS HTTP request.

I have created a factory for this purpose, but unfortunately, the download is not successful.

Even though the request receives a 200 status code, the loader continues spinning in Firebug.

app.factory('File', ['$http','GENERAL_CONFIG', function($http, GENERAL_CONFIG) {
    var API_URL = GENERAL_CONFIG.BASE_API_URL;

    API_URL = API_URL + 'filetransfer/';

    return {
        download: function(filename, type,successcallback, errorcallback){
            var apiurl = API_URL + filename + '?type='+type
            $http.get(apiurl,{
                headers: {
                    "Content-Type": "application/x-download;"
                }
            }).success(successcallback).error(errorcallback);
        }
    }
}]);

Answer №1

Although this post is dated, I wanted to provide an answer for potential current requirements.

If you are making an http request, make sure to include an extra header. Specify the responseType as "arraybuffer".

You can then convert the response into a blob object and send it to the callback like this: URL.createObjectURL(new Blob([response]));

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

CSS: Hover below the designated target to reveal an expanding dropdown menu

My initial solution involved toggling the visibility on and off when hovering. However, this approach is not optimal as the menu should smoothly transition into view. When the visibility is toggled, the user does not experience the intended transition effe ...

Using axios to pass parameters in a post request

In my webpack project, I am currently using vue-resource for ajax calls. Everything works perfectly with "get" calls, but when I try a post request, my PHP file does not receive any parameters. Even when I use var_dump($_POST), it just gives me an empty ar ...

Storing the closed state of a pop-up box in localStorage for future reference

I'm struggling to get localStorage working properly on my website (). Here's what I need to achieve: A newsletter subscription pop-up on every page - this part is functioning correctly An option for users to click 'X' to close the po ...

Graphs vanish when they are displayed in concealed sections

Looking for a way to toggle between two charts (created with charts.js) by clicking a button? Initially, I had them in separate divs, one hidden and the other visible: <div id="one"> <canvas id="myChart1" width="400" height="400"></can ...

How to send arguments to an external JavaScript file with JavaScript

In the header of my HTML document, I have included the following script: <script src="http://www.domain.com/js/widgets.js" type="text/javascript"></script> This script references: widgets.js (function () { var styleEl = document.create ...

I am interested in combining identical values within a table

I have identical values in the <td>{{key}}</td> element, and I would like to avoid displaying them repeatedly. Instead, I want to merge them into a single entry. Enter image description here <tbody ng-repeat="(key, val) in myctrl.dep"> ...

Top strategy for handling $http tasks by dividing responsibilities between a controller and service

(currently using Angular 1.5) After reading various articles - some recent, others outdated - regarding $http requests, promises, and separation of concerns, I have been experimenting with the code example below (Plunker here). I would appreciate feedbac ...

When using the v-for directive with an array passed as props, an error is

I encountered an issue while passing an array of objects from parent to child and looping over it using v-for. The error message "TypeError: Cannot read property 'title' of undefined" keeps appearing. My parent component is named postsList, whil ...

How to parse JSON in JavaScript/jQuery while preserving the original order

Below is a json object that I have. var json1 = {"00" : "00", "15" : "15", "30" : "30", "45" : "45"}; I am trying to populate a select element using the above json in the following way. var selElem = $('<select>', {'name' : nam ...

Using jQuery, Ajax, and HTML together can create dynamic

Is there a way to run JavaScript functions in an HTML file that is loaded using AJAX? The HTML file contains both text and JavaScript, but only the inline JavaScript seems to work (like onclick="dosomething();return false"). The pre-defined functions wra ...

Is it possible for a method within a class to retrieve properties from a different object within the same class?

I'm facing an issue with accessing the necessary object properties within a method. In my scenario, I have a Game class that generates a new game object. Once the object is created, I attempt to execute the draw method. This draw method requires infor ...

Difficulty with Ajax post function in CodeIgniter

I am currently working with CodeIgniter version 3.1. When attempting to use Ajax post, I encountered a 403 (Forbidden) error in the console. [POST http://localhost/test/post 403 (Forbidden)] HTML <div class="post"> <input type ...

Tips on utilizing the event.preventDefault() method within AngularJS?

Recently, I stumbled upon a technique to prevent page refreshing after submitting a form by using event.preventDefault();. As someone who is still learning Angular, I am unsure of how to incorporate this syntax into my Angular controller. Is "event" some s ...

Is there a way to modify the style within a TS-File?

I've created a service to define different colors and now I want to set separate backgrounds for my columns. However, using the <th> tag doesn't work because both columns immediately get the same color. Here's my code: color-variatio ...

Enhance filtering capabilities in ng-repeat by adding controls

After utilizing ng-repeat to display some JSON data, I have incorporated form controls to filter output data from another JSON file. Here is a simplified example: First JSON data: var technologies = [ {"id":"5", "slug":"mysql", "label":"MyS ...

What is the process for assigning default values to dynamically generated form elements?

I have been working on building a single-page application (SPA) using JavaScript and jQuery. During the process, I encountered an issue with a dynamic form. The user is able to add specific fields as needed, but if they don't generate and utilize all ...

React Hamburger Menu not working as intended

I am facing an issue with my responsive hamburger menu. It is not functioning correctly when clicked on. The menu should display the navigation links and switch icons upon clicking, but it does neither. When I remove the line "{open && NavLink ...

Managing ajax requests for lazy loading while scrolling through the middle of the window can be a challenging task. Here are some tips on

I have implemented Lazy loading in my Project. I found a reference at which explains how to make an ajax call after scrolling and image upload with slow mode without allowing scrolling until the loader is shown. The code snippet I am using is as follows: ...

What is causing the dysfunction of angular2 form when used with the HTML <form> tag?

Can someone explain the strange behavior of the <form> element in ng2 to me? I have noticed something odd and need some clarification :) To demonstrate, I have created a simple Plunker example at this link: https://plnkr.co/edit/vdrHJBNdd26y6YhPXTHD ...

"pre and post" historical context

Is there a way to create a stunning "Before and After" effect using full-sized background images? It would be amazing if I could achieve this! I've been experimenting with different examples but can't seem to get the second 'reveal' di ...