Boodschap bij wachten
wij hebben een webservice ontwikkeld die na het correct aanroepen een pdf aanmaakt en opslaat op onze ftp serve, waarna deze door de gebruiker wordt gedownload.
Dit systeem werkt perfect maar duurt vrij lang.
Nu ben ik op zoek naar iets om in tussentijd een boodschap aan mijn gebruiker te kunnen meegeven. Zelf dacht ik aan een progressbar of iets dergelijk.
Ook probeerde ik al met de functie flush() maar dan krijg ik "boel" met mijn headers.
Heeft iemand enig idee hoe ik dit zou kunnen oplossen?
Alvast bedankt!
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<?php
include('ftp.php');
$abestanden=array();
array_push($abestanden,'nul','Dagboek.pdf','Therapeutisch_schema.pdf');
$basisurl='http://81.82.201.205/Bewoners.svc/J1S2D3K4A5/';
$bewonerid=290;
$url=$basisurl.$bewonerid.'/'.$type;
$jsonObject= json_decode(file_get_contents($url));
if ($jsonObject=="OK")
{
$path='d/'.$bewonerid;
$bestandsnaam=$abestanden[$type];
$openen=$ftp_address.$path.'/'.$bestandsnaam;
header('Content-type: application/pdf');
header('Content-Disposition: attachment; filename="downloaded.pdf"');
while (file_exist($openen)==FALSE)
{
echo "Bezig met downloaden van een recente versie";
flush();
}
read_file($openen);
}
else
{
echo "er liep iets fout";
}
}
?>
include('ftp.php');
$abestanden=array();
array_push($abestanden,'nul','Dagboek.pdf','Therapeutisch_schema.pdf');
$basisurl='http://81.82.201.205/Bewoners.svc/J1S2D3K4A5/';
$bewonerid=290;
$url=$basisurl.$bewonerid.'/'.$type;
$jsonObject= json_decode(file_get_contents($url));
if ($jsonObject=="OK")
{
$path='d/'.$bewonerid;
$bestandsnaam=$abestanden[$type];
$openen=$ftp_address.$path.'/'.$bestandsnaam;
header('Content-type: application/pdf');
header('Content-Disposition: attachment; filename="downloaded.pdf"');
while (file_exist($openen)==FALSE)
{
echo "Bezig met downloaden van een recente versie";
flush();
}
read_file($openen);
}
else
{
echo "er liep iets fout";
}
}
?>
Dan gebeurt alles dus binnen de pagina (javascript gaat dan contact opnemen met de server; de gebruiker merkt daar (bijna) niets van).
Ondertussen kan je de gebruiker bezig houden met berichten, met zandloper cursor, ...
Een echte progress bar zou het niet zijn. Het probleem is: php regelt (normaal) alles in 1 ruk. Het is niet evident om php naar een tussentijdse status te vragen.
---
Anders denk ik dat je met zo-iets zou moeten werken
http://php.net/manual/en/book.sockets.php
Maar ik kan je daar (voorlopig) niet mee helpen.
Maar van Ajax heb ik geen kennis en die sockets lijken me op het eerste zicht ook niet echt soelaas te brengen.
Mijn plan is om het downloaden in een ander bestand t'e gieten met als bijkomend voordeel dat ik dit dan ook kan gebruiken binnen andere applicaties.
Uiteraard zijn andere ideeën steeds welkom.
Een voorbeeld: de gebruiker klikt op een knop; dan zoekt javascript contact met de server (in dit geval surft javascript naar "ajax.php"), als dat verzoek geslaagd is, wordt die boodschap van de server in een div gestoken.
index.php
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function() { // Als de DOM van de pagina geladen is, trigger dan de volgende functie
$('#my_button').on('click', function() { // als de gebruiker op id="my_button" klikt, trigger dan de volgende functie
// start het Ajax verzoek
$.ajax({ // begin van het verzoek
url: 'ajax.php',
success: function(data) { // als de server de respons teruggeeft waarnaar je verzocht hebt, trigger dan de volgende functie. De echo van de server vind je terug in de parameter data
$('#messages').html(data) // steek nu die data in de div id="messages"
}
});
});
});
</script>
</head>
<body>
<button id="my_button">KLIK</button>
<div id="messages">Hier komt straks de respons</div>
</body>
</html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function() { // Als de DOM van de pagina geladen is, trigger dan de volgende functie
$('#my_button').on('click', function() { // als de gebruiker op id="my_button" klikt, trigger dan de volgende functie
// start het Ajax verzoek
$.ajax({ // begin van het verzoek
url: 'ajax.php',
success: function(data) { // als de server de respons teruggeeft waarnaar je verzocht hebt, trigger dan de volgende functie. De echo van de server vind je terug in de parameter data
$('#messages').html(data) // steek nu die data in de div id="messages"
}
});
});
});
</script>
</head>
<body>
<button id="my_button">KLIK</button>
<div id="messages">Hier komt straks de respons</div>
</body>
</html>
ajax.php
Voer dit eens uit, zodat je ziet hoe ajax aanvoelt, hoe het reageert.
----------------------------------------------------------------------
Het zelfde voorbeeld, maar nu steek ik er wat berichten bij, waarmee de gebruiker bezig wordt gehouden.
(zelfde ajax.php)
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('#my_button').on('click', function() { // als de gebruiker op id="my_button" klikt, trigger dan de volgende functie
// start het Ajax verzoek
$.ajax({ // begin van het verzoek
url: 'ajax.php',
success: function(data) { // als de server de respons teruggeeft waarnaar je verzocht hebt, trigger dan de volgende functie. De echo van de server vind je terug in de parameter data
$('#messages').html(data) // steek nu die data in de div id="messages"
// cursor terug op normaal zetten
$('html,body').css('cursor','default');
// wacht boodschap terug leeg maken
$('#wait').empty();
}
});
// het verzoek is vertrokken, maar ondertussen loopt alles door.
// Wat hier staat, zal dus vlugger uitgevoerd worden dan de success functie
// berichtje in een div steken
$('#wait').html('Even geduld. We werken heel hard aan jouw probleem');
// cursor op zandloper zetten
$('html,body').css('cursor','wait');
});
});
</script>
<style>
#wait {
background-color: #ff6666;
font-size: 18px;
}
#messages {
background-color: #66ff66;
font-size: 18px;
}
</style>
</head>
<body>
<button id="my_button">KLIK</button>
<div id="wait"></div>
<div id="messages">Hier komt straks de respons</div>
</body>
</html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('#my_button').on('click', function() { // als de gebruiker op id="my_button" klikt, trigger dan de volgende functie
// start het Ajax verzoek
$.ajax({ // begin van het verzoek
url: 'ajax.php',
success: function(data) { // als de server de respons teruggeeft waarnaar je verzocht hebt, trigger dan de volgende functie. De echo van de server vind je terug in de parameter data
$('#messages').html(data) // steek nu die data in de div id="messages"
// cursor terug op normaal zetten
$('html,body').css('cursor','default');
// wacht boodschap terug leeg maken
$('#wait').empty();
}
});
// het verzoek is vertrokken, maar ondertussen loopt alles door.
// Wat hier staat, zal dus vlugger uitgevoerd worden dan de success functie
// berichtje in een div steken
$('#wait').html('Even geduld. We werken heel hard aan jouw probleem');
// cursor op zandloper zetten
$('html,body').css('cursor','wait');
});
});
</script>
<style>
#wait {
background-color: #ff6666;
font-size: 18px;
}
#messages {
background-color: #66ff66;
font-size: 18px;
}
</style>
</head>
<body>
<button id="my_button">KLIK</button>
<div id="wait"></div>
<div id="messages">Hier komt straks de respons</div>
</body>
</html>
Gewijzigd op 01/10/2013 15:13:41 door Kris Peeters