Hintergrundbild mit derselben URL in regelmäßigen Abständen aktualisieren

Ich arbeite an einer eckigen JS-Anwendung. Mein Körperhintergrund muss sich jede Minute entsprechend dem Bild ändern, das von meinem Server gehostet wird.Hintergrundbild mit derselben URL in regelmäßigen Abständen aktualisieren

In meinem HTML, ich ng-Stil verwenden, das Hintergrundbild zu setzen:

<body ng-controller="mainCTRL" ng-style="{backgroundImage: 'url(' + imageURL + ')'}">

In meinem mainCTRL wird imageURL wie folgt festgelegt:

$scope.urlImage = serverURL + '/Images/background.png';

Es ist gut arbeiten, aber jetzt brauche ich um das Bild zu aktualisieren. Das gehostete Bild ändert sich jede Minute, es wird jedoch immer unter derselben URL gehostet. Um das zu tun, musste ich diese auf meinem JS-Code:

startRefresh(); 

function startRefresh() { 
    $interval(test,); 
} 

test = function() { 
    $scope.urlImage = ''; 
    $timeout(function() { 
     $scope.urlImage = serverURL + '/Images/background.png'; 
    }, 1000); 
};

Der Timer funktioniert, jede Minute, die Testfunktion aufgerufen wird, aber das Bild ist immer das gleiche.

Ich hätte gerne eine Lösung, um das Bild zu ändern, auch wenn die URL die gleiche ist.

Ich bin ein Javascript Anfänger und sorry für mein Englisch. Danke

Quelle

2016-05-24 Vynhoû Tawa

Zwei Vorschläge : Stellen Sie sicher, dass der Server Header sendet, um das Bild nicht zu cachen (mindestens nicht länger als eine Minute), und fügen Sie nach der Bild-URL eine Zufallszahl als Anforderungsparameter hinzu, um den Cache des Browsers zu sprengen '$ scope.urlImage = serverURL + '/Images/background.png?r=' + Math.random();' –

Versuchen URL zu etwas zu ändern wie:

var currentTime = new Date().getTime(); 
$scope.urlImage = serverURL + '/Images/background.png?' + currentTime;

Quelle

2016-05-24 07:59:59 marbug

danke! es funktioniert perfecty =) ich habe deine antwort in 3 minuten;) –

Versuchen Sie, diese Änderung in der Testfunktion:

test = function() { 
    $scope.urlImage = ''; 
    $timeout(function() { 
     $scope.urlImage = ''; // add this line 
     $scope.urlImage = serverURL + '/Images/background.png'; 
    }, 1000); 
};

Hope this für Sie .. :)

Quelle

2016-05-24 07:57:15 seekers01

Ich habe es versucht, es funktioniert nicht, weil die URLImage nach der zweiten Änderung identisch ist. –

Hintergrundbild mit derselben URL in regelmäßigen Abständen aktualisieren

Antwort

Verwandte Themen