Retrieving cached data using $http in AngularJS

When making a request to an API using $http in AngularJS, I am receiving cached results. Below is the AngularJS code snippet:

$scope.validate = function(){

    var encodedUserNameAndPassword = Base64.encode($scope.username + ':' + $scope.password);
    var decode = Base64.decode(encodedUserNameAndPassword);
    $http.defaults.headers.put = {
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
    'Access-Control-Allow-Headers': '*' 
    };
            $http.defaults.headers.common['Authorization'] = 'Basic ' + encodedUserNameAndPassword;
$http({method: 'GET', url: 'http://127.0.0.1:5000/user/jim',cache:false}).
        success(function(data, status, headers, config) {
           console.log(data);
        }).
        error(function(data, status, headers, config) {
            alert(data);

        });
}

I am unsure of what I might be overlooking. Any assistance would be greatly appreciated.

Answer №1

Avoid making modifications to the $http provider within the controller. Instead, handle it at the configuration level of Angular.

var myApp = angular.module('myApp',[]);
myApp.config(['$httpProvider', function($httpProvider) {
    // Initialize 'get' if not already done
    if (!$httpProvider.defaults.headers.get) {
        $httpProvider.defaults.headers.common = {};
    }
    $httpProvider.defaults.headers.common["Cache-Control"] = "no-cache";
    $httpProvider.defaults.headers.common.Pragma = "no-cache";
    $httpProvider.defaults.headers.common["If-Modified-Since"] = "0";
}]);

Internet Explorer tends to cache GET requests most of the time.

When making your $http call, include the following parameters:

$http({method: 'GET', 
       url: 'http://127.0.0.1:5000/user/jim',
       headers: {
          'Authorization': 'Basic '+ encodedUserNameAndPassword}
          }
}).
success(function(data, status, headers, config) {
   console.log(data);
}).
error(function(data, status, headers, config) {
   alert(data);
});

I hope this information proves valuable to you.

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

Npm publish seems to be stuck without generating any output

I'm having trouble trying to publish a package that I created. The files can be found at this Github Repo. When I run the command npm publish, it just seems to hang without any errors or output. I've attempted logging in using npm login and npm a ...

The accuracy of real-time visitor numbers in Google Analytics is often unreliable

My website uses Google Analytics to track the page chat.php. The code snippet is correctly placed on the page according to the documentation. Within this page, there is a Flash object that connects users to an IRC chat room. Currently, there are 50 unique ...

Choosing between Vue.prototype, Vue.use, and import for each fileWhen it comes

Discover various techniques for implementing a global function in a Vue.js project: time.js // Option 1: if using Vue.use() export default { install: Vue => { Object.defineProperty(Vue.prototype, "time", { return new Date().getT ...

Finding the main page URL using PHP within a JavaScript include: A comprehensive guide

I am facing an issue where I have a page with a header include that needs the phone number to change only if the filename of the current page contains a specific word. Typically, for a change outside of an include, the following code would suffice. <? ...

Set a value after checking with ng-if

I am currently working on creating a table using ng-repeat. Here is the code I have so far: <table class="tab2" > <thead> <tr> <th>Currency: USD '000s</th> ...

In Vue, reactivity does not extend to nested child objects

I am dealing with JSON data structured like this- items: { id: 1, children: [{ id: 2, parentId: 1, children: [{ id: 3, parentId: 2 }] }] } level-1 children represent parent items that all possess a parent_id of 1 (the roo ...

Toggle the visibility of multiple divs by clicking on other divs

I have implemented a script on my webpage to toggle the visibility of certain divs by clicking on anchor tags. I found a solution that seems perfect for my needs, but unfortunately it is not working when I try to integrate it into my own website. I suspec ...

Tips for transferring the clicked value to the next page

Recently, I started working with Ionic and developed an application using it. Now, I am facing a challenge where I need to pass the value from the first page to the second page. To illustrate this more clearly, I have attached two photos. Here is the imag ...

Retrieve the jquery.data() of an element stored in an HTML file using JavaScript or jQuery

I have a dilemma with storing HTML in a database for later retrieval. Imagine the HTML being a simple div, like this: <div id="mydiv">This is my div</div> To store related information about the div, I use jQuery.data() in this manner ...

authorization for certain express routes using passport.js

Securing certain express routes with Passport.js authentication Steps for authenticating specific routes in Passport.js Looking for a method to authenticate particular routes using Passport.js Your assistance is greatly appreciated... ...

Eliminating divs and preserving content

Is there a way to remove certain DIV elements using jQuery or pure JavaScript without affecting the content within them? Here is an example structure: <div class="whatever_name"> <div class="whatever_name"> <h2>subtitle</h2&g ...

The $injector encountered an unknown provider, cFilterProvider <- cFilter, please check your dependencies

I'm currently learning angular.js on CodeAcademy, but I've hit a roadblock with one of the exercises. Unfortunately, I keep encountering a JavaScript error that I can't seem to find a solution for even after searching online. index.html &l ...

Transferring documents using JavaScript

I have been using the following method to upload files to my Laravel backend: setFile(id, e) { let self = this; let reader = new FileReader(); reader.readAsDataURL(e.target.files[0]); reader. ...

Halt the adhesion of the Bootstrap column when it hits the div section

I have a simple bootstrap row containing two columns: <div class="row"> <div class="col-xs-7"> <p>Walking together</p> </div> <div class="col-xs-5" id="stay"> <p>Joyful journey</p> </div ...

Using Jquery and CSS to add a class with a 1-second delay when the mouse enters

I have successfully implemented the addClass function in my code, but I'm encountering issues when attempting to use delay or setTimeout functions. It's important to note that I'm avoiding the use of webkit attributes in CSS. If anyone has ...

Exploring the integration of Vue.js and Requirejs for efficient development

After creating a new Vue.js project with vue-cli and building it using the command: vue build --target lib --name myWidget src/main.js I needed to utilize Requirejs for loading: <script> requirejs.config({ paths: { ...

When you hover over an image, its opacity will change and text will overlay

I am looking for a way to decrease the opacity and overlay text on a thumbnail image when it is hovered over. I have considered a few methods, but I am concerned that they may not be efficient or elegant. Creating a duplicated image in Photoshop with the ...

Discover how to capture a clicked word within the Ionic Framework

I've been working on an app using the Ionic Framework. I am trying to figure out how to detect when a word is pressed in my application. One solution I tried involved splitting the string into words and generating a span with a click event for each on ...

Step-by-step guide on displaying SVG text on a DOM element using Angular 8

I have a FusionChart graph that I need to extract the image from and display it on the same HTML page when the user clicks on the "Get SVG String" button. I am able to retrieve the SVG text using this.chart.getSVGString() method, but I'm unsure of ho ...

Oops! Issue: The mat-form-field is missing a MatFormFieldControl when referencing the API guide

I included the MatFormFieldModule in my code like so: import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppRoutingModule } from './app-routing.module'; ...