Interaction PHP - JS

**nicolas92c** · 24/01/2015, 22h52

Bonjour,

J'ai un probl�me pour faire fonctionner un code sous JS (PS; je suis novice

)

J'ai un player audio qui lit un flux streaming � partir du fichier stream.php :

Code php :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
<?PHP 
$stream = ($_GET["stream"]);
readfile($stream);
?>

Sur ma page, un lien JS doit permettre d'enregistrer la variable stream dans stream.php pour que le player lise le flux :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<html >
<script type="text/javascript" src="javascript.js"></script>
<script type="text/javascript">
function request() {
	var xhr = getXMLHttpRequest();
	xhr.onreadystatechange = function() {
		if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) {
			callback(xhr.responseText);
		}
	};
	xhr.open("GET", "http://stream.php?stream="http://xxxxx.mp3",true);
	xhr.send(null);
}
 
</script>
<input type="button" onclick="request();" value="Exécuter" />
</html>

Mais quand je clique sur le bouton "executer" rien ne se passe..

Quelqu'un aurait une solution ?

Merci

**NoSmoking** · 24/01/2015, 22h59

Bonjour,

xhr.open("GET", "http://stream.php?stream="http://xxxxx.mp3",true);

le mauvais placement des guillemets est normal !?!

**nicolas92c** · 25/01/2015, 11h12

merci pour le retour.

Il s'agit d'une erreur de frappe voici la bonne ligne :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

xhr.open("GET", "stream.php?stream="http://xxxxx.mp3"",true);

Mais rien.. En fait je souhaiterais que la variable stream soit enregistr�e dans le fichier stream.php

Je ne sais pas si c'est la bonne fa�on de faire..
merci

**sekaijin** · 25/01/2015, 11h29

T'es sur il n'y a rien qui te choque dans la coloration syntaxique ?

Si l'analyse syntaxique se trompe et produit une coloration incorrecte,
comment l'interpr�te qui utilise lui aussi un analyseur syntaxique peut il correctement traduite ton code ?

A+JYT

**tdutrion** · 25/01/2015, 11h29

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

xhr.open("GET", "stream.php?stream="http://xxxxx.mp3"",true);

Les guillemets sont toujours mal plac�s, on ne mets pas de guillemets dans une url...

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

xhr.open("GET", "stream.php?stream=http://xxxxx.mp3", true);

**lysandro** · 25/01/2015, 11h42

Comme le souligne sekaijin, tu devrais avoir des erreurs dans la console de ton navigateur (F12?).

En JS, tu as deux possibilit�s (en fait quatre, tu peux aussi d�limiter une chaine avec des guillements simples) pour �crire des guillements dans une chaine de caract�res :

soit ta chaine est d�limit�e par des guillemets doubles, auquel cas les guillements � l'int�rieur doivent �tre �chapp�s par un anti-slash '\'
var chaine = "ma \"chaine\" avec des \"guillemets\"";
soit tu utilises � la place des guillemets simples
var chaine = "ma 'chaine' avec des 'guillemets'";

Mais l� en l'occurence, c'est Th�ocrite qui a raison.

Par contre, si je comprends ce que tu fais, tu lis le contenu du fichier mp3 que tu envois � ton navigateur au travers de ta requ�te XMLHttpRequest. Pour lire un flux en streaming, on a g�n�ralement besoin d'un "player", et c'est au "player" que tu passes l'url du fichier. Pas le contenu.
En plus le contenu du fichier d'un flux est en "binaire" (par opposition � "texte") et pour le transmettre correctement il faudrait l'encoder en base64 par exemple (donc le transformer en "texte").

**nicolas92c** · 25/01/2015, 12h23

OK merci pour ces d�tails, j'ai bien corrig� mais je pense avoir un pb de fond.
En fait voici des pr�cision sur mon projet :

J'ai un player unique qui s'affiche bien et dont le code est ci-dessous. Le flux est enreistr� dans stream.php. (Si je rentre une url en dur, ca fonctionne) :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
<html>
<script type="text/javascript" src="player_config.js"></script>
<script type="text/javascript">
MRP.insert({
'url':'stream.php',
'codec':'mp3',
'skin':'player_config.xml',
});
</script>
</html>

Sur la m�me page HTML, plusieurs liens. En cliquant sur un lien, un nouveau flux streaming doit �tre envoy� au player. Voici le code du lien JS (ici bouton) :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<html >
<script type="text/javascript" src="javascript.js"></script>
<script type="text/javascript">
function request() {
	var xhr = getXMLHttpRequest();
	xhr.onreadystatechange = function() {
		if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) {
			callback(xhr.responseText);
		}
	};
	xhr.open("GET", "stream.php?stream='http://xxxxxxxx.mp3'",true);
	xhr.send(null);
}
 
</script>
<input type="button" onclick="request();" value="Exécuter" />
</html>

Et ci dessous le code php lu par la ligne 'url' du player :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
<?PHP 
$stream = $_GET["stream"];
readfile($stream);
?>

Voyez vous une erreur de construction ?
Merci !

**lysandro** · 25/01/2015, 13h04

Envoy� par Th�ocrite

on ne mets pas de guillemets dans une url...

A part �a, tu utilises apparemment ta page PHP comme fournisseur de flux ... En principe, ce n'est pas � toi de lire le flux mais au player. Tu devrais passer au player, s'il le supporte, l'url du fichier que lui ira lire. Ce que tu fais au travers du chargement initial avec MRP.insert({ "url":"stream.php", ... donc pour changer de flux, suivant l'api du player, tu devras lui indiquer l'url du flux et non son contenu.

**nicolas92c** · 25/01/2015, 13h31

lysandro,
Qu'entends tu par "indiquer l'url du flux et non son contenu" ?

**lysandro** · 25/01/2015, 14h54

L'url du flux c'est l'url du fichier que tu veux que le player lise. Dans ton cas stream.php?stream=http://xxxxxx.mp3.

Dans ton code, tu vas charger toi-m�me cette url avec ta requ�te xmlhttp et du coup tu r�cup�res le contenu du flux (du fichier) que tu essayes de passer au player, j'imagine, au travers de callback(xhr.responseText).

Je pense, mais c'est une hypoth�se (je n'ai pas trouv� l'api du muse radio player), qu'il faut lui donner seulement l'url, c'est lui qui va s'occuper du chargement et de l'interpr�tation du flux (du fichier).

Tu ne devrais pas avoir besoin de ta function request() mais seulement d'un truc du genre MRP.setStreamURL("stream.php?stream=http://xxxxxx.mp3"). C'est bidon, c'est juste pour donner une id�e. Ce n'est m�me pas s�r que le player en question supporte des changements de flux.

**nicolas92c** · 25/01/2015, 15h47

En fait, le player arrive � interpreter le fichier stream.php car en mettant en dur une url streaming, le player se lance bien. Exemple :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
<?PHP 
$stream = 'http://xxxx.mp3';
readfile($stream);
?>

Par ailleurs, en modifiant le fichier stream.php avec une autre url, le player se met � jour automatiquement car il y a un rafraichissement automatique.

Du coup je me demande si le code JS est bon..

**sekaijin** · 25/01/2015, 17h32

c'est logique qui ne lise rien
tu ne donne pas le nom du stream � ton player

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
MRP.insert({
'url':'stream.php', //ICI il n'y a pas de stream juste un php qui ne sait pas quoi lire
'codec':'mp3',
'skin':'player_config.xml',
});

A+JYT

**nicolas92c** · 25/01/2015, 18h03

sekaijin,

Dans mon message pr�c�dent, je confirme que le player arrive � interpr�ter le fichier stream.php.

Le tout est que je souhaite que le flux renseign� dans ce fichier stream.php soit une variable et qu'elle change en fonction du lien sur lequel clique l'utilisateur.

**sekaijin** · 25/01/2015, 18h36

Je crois que tu ne comprends pas ce qu'on te dis

il ne s'agit pas de savoir si oui ou non ton fichier php sait lire le steam ou si ton player sais acc�der � ton fichier php

il s'agit du fait qu'� aucun moment tu ne donne � ton player le lien du flux.
le player ouvre le lien que tu lui donne et rien d'autre.

tout �a n' arien a voir avec des variables du code ou quoi que ce soit
pour que le player ouvre un flux il FAUT lui donner le lien du flux et rien d'autre.

toit tu donne un lien vers un php qui est con�u pour avoir le nom du flux en param�tre dans l'url
et dans ton player tu donnes l'url de ton php sans indiquer le nom du flux

le php ne peux donc pas charger le flux
il faut �tre coh�rent dans ce que tu fais.

A+JYT

**nicolas92c** · 25/01/2015, 18h39

ok, je vois le raisonnement..
Quelle serait la solution du coup ? vers quoi m'orienter ?

**lysandro** · 25/01/2015, 19h24

Tu peux tenter �a pour changer le flux en cours de lecture

Code javascript :

S�lectionner tout - Visualiser dans une fen�tre � part

MRP.setUrl("stream.php?stream=http://xxxxxx.mp3");

par exemple sur un lien : <a href="#" onclick="MRP.setUrl('stream.php?stream=http://xxxxxx.mp3'); return false;">xxxxxx.mp3</a>.

Mais sans garantie, je n'arrive pas � mettre la main sur une version lisible de MRP.js. C'est ce fichier qui contient l'api (les m�thodes/functions disponibles sur le player : MRP.play(), MRP.stop(), etc)

Le code provient du changelog : https://github.com/fbricker/muses/bl.../CHANGELOG.txt

**nicolas92c** · 25/01/2015, 21h44

Merci lysandro, on avance beaucoup mais pas completement

J'ai mis 2 liens de ce type :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
<html >
<script type="text/javascript">
MRP.setUrl("stream.php?stream=http://stream1.mp3");
</script>
<a href="#" onclick="MRP.setUrl('stream.php?stream=http://stream1.mp3'); return false;">lien1</a>
</html>

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
<html >
<script type="text/javascript">
MRP.setUrl("stream.php?stream=http://stream2.mp3");
</script>
<a href="#" onclick="MRP.setUrl('stream.php?stream=http://stream2.mp3'); return false;">lien2</a>
</html>

Lorsque je clique sur le lien1, le player se lance bien avec le bon streaming. Par contre, lorsque je clique sur le lien2 quand le player diffuse le stream1, rien ne se passe, il continue � diffuser le stream1.

Ca pourrait venir de quoi ?

**NoSmoking** · 25/01/2015, 21h52

As tu essay� de faire un MRP.stop() avant de relancer la suivante ?

**nicolas92c** · 25/01/2015, 22h07

oui j'ai d�j� test� de placer un MRP.stop() avant le MRP.setUrl dans les 2 cas mais c'est la m�me chose..

**nicolas92c** · 26/01/2015, 21h19

Bonjour,

J'ai finalement complet� le code de lysandro et ca fonctionne

:

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
<html >
<a href="#" onclick="MRP.stop(); MRP.setUrl('stream.php?stream=http://xxxxxx.mp3'); MRP.play();">mp3</a>
</html>

Merci � tous pour votre implication !

Interaction PHP - JS

JavaScript

Discussions similaires

Partager

Partager