Problem between PHP and JavaScript with json

[Une Bévue]

I'm using Php to get a background image.
The php script scans a directory and choose a random image:

$dir = '/Users/yt/Sites/global/backgrounds';
$files = array();
chdir($dir);
foreach (glob("*.jpg", GLOB_NOSORT) as $filename) {
$files[] = $filename;
}
foreach (glob("*.png", GLOB_NOSORT) as $filename) {
$files[] = $filename;
}
$count = count($files);
$rand = rand(0, $count);
$background = '/global/backgrounds/'. $files[$rand];


Then the script sends that to Javascript using json_encode( $data ) :

$data['text'] = 'html {
background: transparent url(http://mbp.local/global/backgrounds/'.
$files[$rand] . ') no-repeat center center fixed;background-size: cover;}';
$data['background'] = 'transparent
url(http://mbp.local/global/backgrounds/'. $files[$rand] . ') no-repeat
center center fixed';
$data['background-image'] =
'url(http://mbp.local/global/backgrounds/'. $files[$rand] . ')';
$data['backgroundSize'] = 'cover';
echo json_encode( $data );

The JavaScript call this script like that :

JSON.fetch = function(url, callback) {
fetch(url)
.then(function (response) {
return response.json();
})
.then(function (json) {
callback(json);
});
};

used as :
getBackground () {
JSON.fetch("http://mbp.local/php/background-json.php",
this.setBackground);
};

with the callback :


setBackground(json) {
if(json.hasOwnProperty('background-image')) {
document.body.style.backgroundImage = json['background-image'];
}
};

This is working well however, in the browser console I get this error :
SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the
JSON data [Learn More]

The "[Learn More]" is link to this MDN page :
SyntaxError: JSON.parse: bad parsing
<https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/JSON_bad_parse?utm_source=mozilla&utm_medium=firefox-console-errors&utm_campaign=default>



I don't know how to debugg that, that's to say how to get the raw json
from the PHP script "background-json.php".

[Christoph M. Becker]

On 02.05.2017 at 15:31, Une Bévue wrote:

> getBackground () {
> JSON.fetch("http://mbp.local/php/background-json.php",
> this.setBackground);
> };
>

> I don't know how to debugg that, that's to say how to get the raw json
> from the PHP script "background-json.php".

Well, what happens if you request this URI from the browser directly?
Don't you get the raw JSON then?

--
Christoph M. Becker

[Une Bévue]

Le 02/05/2017 à 15:56, Christoph M. Becker a écrit :
> Well, what happens if you request this URI from the browser directly?
> Don't you get the raw JSON then?

Yes, of course, i get :
{"text":"html { \n background: transparent
url(http:\/\/mbp.local\/global\/backgrounds\/cerveaulent_recadre.png)

no-repeat center center fixed;background-size:

cover;}","background":"transparent
url(http:\/\/mbp.local\/global\/backgrounds\/cerveaulent_recadre.png)
no-repeat center center
fixed","background-image":"url(http:\/\/mbp.local\/global\/backgrounds\/cerveaulent_recadre.png)","backgroundSize":"cover"}

even using :
$ wget http://mbp.local/php/background-json.php

i get the same, the first character being "{" and the last one "}"

the reason why i don't understand the error message (about the same
using "Firefox Developer Edition" or "Safari Techical Preview")...

[Christoph M. Becker]

Have you checked the response in a hex editor? I wouldn't be surprised
if it starts with

EF BB BF

--
Christoph M. Becker

[Une Bévue]

Le 02/05/2017 à 17:40, Christoph M. Becker a écrit :
> Have you checked the response in a hex editor?

No...

> I wouldn't be surprised
> if it starts with
>
> EF BB BF

Here it is :

7B227465 - {"te

and ends with :

76657222 7D - ver"}

following :
<http://www.asciitable.com/>

7B seems to be correct for "{"
7D seems to be correct for "}"

then ?

[Une Bévue]

Le 02/05/2017 à 19:03, Une Bévue a écrit :
> then ?

may be the BOM ???

[Christoph M. Becker]

Hm, that is correct for ISO-8859-1, for instance. Does the JSON
response specify an appropriate Content-Type header including the
correct charset?

--
Christoph M. Becker

[Une Bévue]

Le 02/05/2017 à 19:35, Christoph M. Becker a écrit :
> Hm, that is correct for ISO-8859-1,

the code is also US-ASCII then UTF-8 for those caracters (common to
US-ASCII, UTF-8 and ISO-8859-1).

> for instance. Does the JSON
> response specify an appropriate Content-Type header including the
> correct charset?

yes :

header('Content-Type: application/json; charset=utf-8');

[Christoph M. Becker]

On 03.05.2017 at 07:11, Une Bévue wrote:

> Le 02/05/2017 à 19:35, Christoph M. Becker a écrit :
>
>> Hm, that is correct for ISO-8859-1,
>
> the code is also US-ASCII then UTF-8 for those caracters (common to
> US-ASCII, UTF-8 and ISO-8859-1).

Of course, you're right. Sorry for the noise.

>> for instance. Does the JSON
>> response specify an appropriate Content-Type header including the
>> correct charset?
>
> yes :
>
> header('Content-Type: application/json; charset=utf-8');

That appears to be correct.

Don't know for what else to look. Maybe you should consider asking in
JavaScript/ECMAScript related newsgroup.

--
Christoph M. Becker

[Une Bévue]

Le 03/05/2017 à 13:37, Christoph M. Becker a écrit :
> Don't know for what else to look. Maybe you should consider asking in
> JavaScript/ECMAScript related newsgroup.

yes, U're right, thanks.

[Thomas 'PointedEars' Lahn]

^^^^^^^^^^^^^^^^^^^^^
Among other things it looks like the old “method referenced as function”
blunder:

| getBackground () {
| JSON.fetch("http://mbp.local/php/background-json.php",
| this.setBackground);

^^^^^^^^^^^^^^^^^^
| };

Of course, the first thing to look for when one sees JSON.parse() issuing an
error message is *the offending JSON.parse() call*. One does not go to the
dentist if one’s foot hurts.

If the OP would *finally* post with RFC-5536- *and* Netiquette-compliant
headers, one might even read their postings directly, and advise them, *even
if they were off topic*. But no name, no address – *no cookies*.

--
PointedEars
Zend Certified PHP Engineer <http://www.zend.com/en/yellow-pages/ZEND024953>
<https://github.com/PointedEars> | <http://PointedEars.de/wsvn>
Twitter: @PointedEars2 | Please do not cc me./Bitte keine Kopien per E-Mail.

[Une Bévue]

Le 05/05/2017 à 10:24, Thomas 'PointedEars' Lahn a écrit :
> Of course, the first thing to look for when one sees JSON.parse() issuing an
> error message is *the offending JSON.parse() call*.

JSONLint - The JSON Validator
<https://jsonlint.com/>

with the returned json of "http://mbp.local/php/background-json.php" :

{"text":"html { \n background: transparent

url(http:\/\/mbp.local\/global\/backgrounds\/postimage_1.jpg) no-repeat

center center fixed;background-size: cover;}","background":"transparent

url(http:\/\/mbp.local\/global\/backgrounds\/postimage_1.jpg) no-repeat
center center
fixed","background-image":"url(http:\/\/mbp.local\/global\/backgrounds\/postimage_1.jpg)","backgroundSize":"cover"}

i get :

Results

Valid JSON

[Jerry Stuckle]

Don't worry about "Pointed Head". He's well-known as a troll in several
newsgroups. He adds nothing to a discussion except insults and
complaints when your headers don't meet *his* expectations. You're much
better off ignoring his posts.

--
==================
Remove the "x" from my email address
Jerry Stuckle
jstu...@attglobal.net
==================

[Christoph M. Becker]

That's not the problem. I suggest to read Thomas' message more
carefully. He pointed out a potential problem regarding the call to
getBackground().

--
Christoph M. Becker

[Richard Yates]

Any chance of you guys upgrading the quality and variety of your
exchanges? This may help:
https://xkcd.com/1833/

[Thomas 'PointedEars' Lahn]

Christoph M. Becker wrote:

> On 05.05.2017 at 10:44, Une Bévue wrote:
>> Le 05/05/2017 à 10:24, Thomas 'PointedEars' Lahn a écrit :
>>> Of course, the first thing to look for when one sees JSON.parse()
>>> issuing an error message is *the offending JSON.parse() call*.
>>
>> JSONLint - The JSON Validator
>> <https://jsonlint.com/>
>>
>> with the returned json of "http://mbp.local/php/background-json.php" :
>> {"text":"html { \n background: transparent

^^

>> url(http:\/\/mbp.local\/global\/backgrounds\/postimage_1.jpg) no-repeat
>> center center fixed;background-size: cover;}","background":"transparent
>> url(http:\/\/mbp.local\/global\/backgrounds\/postimage_1.jpg) no-repeat
>> center center
>> fixed","background-image":"url(http:
\/\/mbp.local\/global\/backgrounds\/postimage_1.jpg)","backgroundSize":"cover"}
>>
>> i get :
>>
>> Results
>>
>> Valid JSON
>
> That's not the problem.

But it is.

> I suggest to read Thomas' message more
> carefully. He pointed out a potential problem regarding the call to
> getBackground().

I also said “look for the offending JSON.parse() call”; _not_ “copypaste the
JSON that you get in the *browser* or with wget(1) into an arbitrary Web-
based JSON validator”.

[Jerry Stuckle]

Just warning the OP about Pointed Head, that's all.

[Une Bévue]

Le 05/05/2017 à 15:48, Jerry Stuckle a écrit :
> Don't worry about "Pointed Head". He's well-known as a troll in several
> newsgroups. He adds nothing to a discussion except insults and
> complaints when your headers don't meet *his* expectations. You're much
> better off ignoring his posts.

fine thanks !

[Une Bévue]

Le 05/05/2017 à 15:57, Christoph M. Becker a écrit :
> He pointed out a potential problem regarding the call to
> getBackground()

the prob may not come from that point.
because the javascript works, in fact every 5 s, but the error message
at console is only from time to time.

[Luuk]

Try to get the data at the time of the error, not the data which 'seemed
to be OK, when it was tested'.

i.e. the filename could be in ISO-8859-? encoding, and litteraly
'dumped' into your JSON, which is utf-8. This would result in a
'sometimes' invalid json message.

[Une Bévue]

Le 06/05/2017 à 11:50, Luuk a écrit :
> Try to get the data at the time of the error, not the data which 'seemed
> to be OK, when it was tested'.

yes; then i have to catch when it is incorrect.

> i.e. the filename could be in ISO-8859-? encoding, and litteraly
> 'dumped' into your JSON, which is utf-8. This would result in a
> 'sometimes' invalid json message.

no I'm on MacOS, the filenames are in UTF-8 (mac version)

sure I'll verify that php doesn't change that behind the scene.

[Thomas 'PointedEars' Lahn]

Luuk wrote:

> Try to get the data at the time of the error, not the data which 'seemed
> to be OK, when it was tested'.

ACK.

> i.e. the filename could be in ISO-8859-? encoding, and litteraly
> 'dumped' into your JSON, which is utf-8. This would result in a
> 'sometimes' invalid json message.

Doubtful.

First of all, it is not a filename. Non-ASCII characters have to be escaped
in the _URIs_ which are required by the CSS “url(…)” function.

Also, invalid UTF-8 sequences in text declared to be ISO-8859-x-encoded
could only be those for ISO-8859-x characters found in the Unicode character
set with a Unicode code point beyond U+007F (which are not used in basic
JSON syntax, so could not produce syntax errors), and would be replaced with
U+FFFD. That is, the HTTP request later would fail (404), but the JSON
parsing would not.

Also, _JSON_ is not a “message”, but a data-interchange format.

<https://en.wikipedia.org/wiki/UTF-8#Invalid_byte_sequences>
<http://json.org/>

(This part of the discussion is actually on-topic for a change, because PHP
supports JSON decoding and encoding; see <http://php.net/json>.)

Apropos “invalid”, the address part of the From header field value of your
postings is, and it is also anti-social.

<https://tools.ietf.org/html/rfc5536#section-3.1.2>
<http://www.interhack.net/pubs/munging-harmful/>

[Une Bévue]

Le 06/05/2017 à 17:04, Une Bévue a écrit :
> yes; then i have to catch when it is incorrect.

I found it using Vivaldi as a browser, where i get this error message :

Unhandled Rejection (SyntaxError): Unexpected token < in JSON at position 0


I think the "<" comes, presumably, from a php error where php returns an
error between tag like <span...>the error</span>

Then I've change my fetch function in order to take into account of
parse errors (ES6):

JSON.fetch = function(url, callback) {
fetch(url)
.then(function (response) {

try {
let json = response.json();
return json;
} catch(e) {
return {error: `JSON.parse ERROR: ${e.message}`};

[Jerry Stuckle]

If this is the case, you have another problem - you shouldn't get this
from PHP. I suspect you have display_errors enabled on your server -
this should never be enabled on a production system (although it's a
good idea to have it enabled on a development system).

But the problem should be handled on the PHP end, not in javascript.
Find the cause of the problem and fix it instead of trying to handle it
later.

[Luuk]

On 06-05-17 19:54, Thomas 'PointedEars' Lahn wrote:
> Apropos “invalid”, the address part of the From header field value of your
> postings is, and it is also anti-social.
>
> <https://tools.ietf.org/html/rfc5536#section-3.1.2>
> <http://www.interhack.net/pubs/munging-harmful/>
> --
> PointedEars
> Zend Certified PHP Engineer <http://www.zend.com/en/yellow-pages/ZEND024953>
> <https://github.com/PointedEars> | <http://PointedEars.de/wsvn>
> Twitter: @PointedEars2 | Please do not cc me./Bitte keine Kopien per E-Mail.

Don't bother about it, it will not change!

Next time, please put this crap, about anti-social thing, _after_ your
commercial lines about Twitter.

[Luuk]

On 06-05-17 19:54, Thomas 'PointedEars' Lahn wrote:

> Luuk wrote:
>
>> Try to get the data at the time of the error, not the data which 'seemed
>> to be OK, when it was tested'.
>
> ACK.
>
>> i.e. the filename could be in ISO-8859-? encoding, and litteraly
>> 'dumped' into your JSON, which is utf-8. This would result in a
>> 'sometimes' invalid json message.
>
> Doubtful.
>

Sorry about being unclear, I was only trying to give an example of what
might be the problem.

[Thomas 'PointedEars' Lahn]

Luuk wrote:

> On 06-05-17 19:54, Thomas 'PointedEars' Lahn wrote:
>> Apropos “invalid”, the address part of the From header field value of
>> your postings is, and it is also anti-social.
>>
>> <https://tools.ietf.org/html/rfc5536#section-3.1.2>
>> <http://www.interhack.net/pubs/munging-harmful/>

>> […]

>
> Don't bother about it, it will not change!

That is a pity.

> Next time, please put this crap, about anti-social thing, _after_ your
> commercial lines about Twitter.

You don’t know what a Usenet signature is, do you?

[Thomas 'PointedEars' Lahn]

Luuk wrote:

> On 06-05-17 19:54, Thomas 'PointedEars' Lahn wrote:
>> Luuk wrote:
>>> Try to get the data at the time of the error, not the data which 'seemed
>>> to be OK, when it was tested'.
>>
>> ACK.

Not to be confused with “Ack!”.

>>> i.e. the filename could be in ISO-8859-? encoding, and litteraly
>>> 'dumped' into your JSON, which is utf-8. This would result in a
>>> 'sometimes' invalid json message.
>>
>> Doubtful.

I wrote more than this.

> Sorry about being unclear,

You have not been unclear. You have been mistaken.

> I was only trying to give an example of what might be the problem.

I know.

[Une Bévue]

Le 07/05/2017 à 13:41, Jerry Stuckle a écrit :
> If this is the case, you have another problem - you shouldn't get this
> from PHP. I suspect you have display_errors enabled on your server -
> this should never be enabled on a production system (although it's a
> good idea to have it enabled on a development system).
>
> But the problem should be handled on the PHP end, not in javascript.
> Find the cause of the problem and fix it instead of trying to handle it
> later.

yes, obviously

[Une Bévue]

Le 07/05/2017 à 13:41, Jerry Stuckle a écrit :

> But the problem should be handled on the PHP end, not in javascript.
> Find the cause of the problem and fix it instead of trying to handle it
> later.

ok, I have to find the ***intermittent*** cause.
because the php script is called every 5s.

I'm not in production.

[Jerry Stuckle]

OK, that's not so bad then (you'd be surprised how many PHP programmers
have display_errors enabled on a production system).

I would suggest also logging your messages. Then you can look at the
log when it happens and see what the message was.

[Jerry Stuckle]

Luuk, don't bother arguing. Pointed Head has all the right answers, and
everyone else is wrong.

[Luuk]

On 07-05-17 19:46, Jerry Stuckle wrote:
> On 5/7/2017 9:59 AM, Luuk wrote:
>> On 06-05-17 19:54, Thomas 'PointedEars' Lahn wrote:
>>> Luuk wrote:
>>>
>>>> Try to get the data at the time of the error, not the data which 'seemed
>>>> to be OK, when it was tested'.
>>>
>>> ACK.
>>>
>>>> i.e. the filename could be in ISO-8859-? encoding, and litteraly
>>>> 'dumped' into your JSON, which is utf-8. This would result in a
>>>> 'sometimes' invalid json message.
>>>
>>> Doubtful.
>>>
>>
>> Sorry about being unclear, I was only trying to give an example of what
>> might be the problem.
>
> Luuk, don't bother arguing. Pointed Head has all the right answers, and
> everyone else is wrong.
>

and some asshole named Jerry has to remind everyone about that ...

SHUT THE F..K UP!!

[Jerry Stuckle]

Just trying to be kind, and you reply like an asshole. Stuff it, Luuk!

[Luuk]

On 07-05-17 21:33, Jerry Stuckle wrote:
> On 5/7/2017 3:05 PM, Luuk wrote:
>> On 07-05-17 19:46, Jerry Stuckle wrote:
>>> On 5/7/2017 9:59 AM, Luuk wrote:
>>>> On 06-05-17 19:54, Thomas 'PointedEars' Lahn wrote:
>>>>> Luuk wrote:
>>>>>
>>>>>> Try to get the data at the time of the error, not the data which
>>>>>> 'seemed
>>>>>> to be OK, when it was tested'.
>>>>>
>>>>> ACK.
>>>>>
>>>>>> i.e. the filename could be in ISO-8859-? encoding, and litteraly
>>>>>> 'dumped' into your JSON, which is utf-8. This would result in a
>>>>>> 'sometimes' invalid json message.
>>>>>
>>>>> Doubtful.
>>>>>
>>>>
>>>> Sorry about being unclear, I was only trying to give an example of what
>>>> might be the problem.
>>>
>>> Luuk, don't bother arguing. Pointed Head has all the right answers, and
>>> everyone else is wrong.
>>>
>>
>> and some asshole named Jerry has to remind everyone about that ...
>>
>> SHUT THE F..K UP!!
>>
>
> Just trying to be kind, and you reply like an asshole. Stuff it, Luuk!
>
>

If you have noting to add which has to do wiht PHP, than don;t add anything.

[Une Bévue]

Le 07/05/2017 à 19:45, Jerry Stuckle a écrit :
> OK, that's not so bad then (you'd be surprised how many PHP programmers
> have display_errors enabled on a production system).
>
> I would suggest also logging your messages. Then you can look at the
> log when it happens and see what the message was.

I'm really sorry for the noise.

It was a group 7 error ;-)

Lying between the chair and the keyboard...

Explaination :

the only error was here :
$count = count($files);
$rand = rand(0, $count);

reading <http://php.net/manual/fr/function.rand.php> (ie. php rand
manual) i got it :

int rand ( int $min , int $max )

returns an int between $min and $max ***inclusive***

then, because $count is the count of valid files in a directory, I MUST
write better :

$rand = rand(0, $count - 1);
----------------------^^^^^--

that's all folks !

[Jerry Stuckle]

<grin> those kinds of errors are sooo easy to make. Thanks for coming
back with your solution (and that it was so easy to solve). It can help
others in the future.

[Thomas 'PointedEars' Lahn]

Richard Yates wrote:

> On Fri, 5 May 2017 09:48:26 -0400, Jerry Stuckle
> <jstu...@attglobal.net> wrote:
>>Don't worry about "Pointed Head". He's well-known as a troll in several
>>newsgroups.

It takes one to know one.

>>He adds nothing to a discussion except insults and
>>complaints when your headers don't meet *his* expectations. You're much
>>better off ignoring his posts.
>
> Any chance of you guys upgrading the quality and variety of your
> exchanges? This may help:
> https://xkcd.com/1833/

It is just Jerry who is stuckled in the mud there, wildly throwing it around
himself in the hope that something of it may stick ;-) I pity him for
having chosen to waste his life like this, but that aside I could not care
less about what he writes about me. As a result, my quality of life has
improved a lot. Had you not quoted him, I would not even have noticed it.
The only problem (for the rest) is that he still does not understand that.

HTH

[Jerry Stuckle]

On 5/15/2017 6:01 PM, Thomas 'PointedEars' Lahn wrote:
> Richard Yates wrote:
>
>> On Fri, 5 May 2017 09:48:26 -0400, Jerry Stuckle
>> <jstu...@attglobal.net> wrote:
>>> Don't worry about "Pointed Head". He's well-known as a troll in several
>>> newsgroups.
>
> It takes one to know one.
>

Yes, and you know them all. But then that's the typical third-grade
response from a troll.

>>> He adds nothing to a discussion except insults and
>>> complaints when your headers don't meet *his* expectations. You're much
>>> better off ignoring his posts.
>>
>> Any chance of you guys upgrading the quality and variety of your
>> exchanges? This may help:
>> https://xkcd.com/1833/
>
> It is just Jerry who is stuckled in the mud there, wildly throwing it around
> himself in the hope that something of it may stick ;-) I pity him for
> having chosen to waste his life like this, but that aside I could not care
> less about what he writes about me. As a result, my quality of life has
> improved a lot. Had you not quoted him, I would not even have noticed it.
> The only problem (for the rest) is that he still does not understand that.
>
> HTH
>

ROFLMAO! How about all of the other newsgroups where you are a well
known troll - for instance, comp.lang.javascript? And several others?

But then if you didn't care what I wrote about you, you wouldn't spend
the effort responding, would you? But you can't stand people knowing
what the REAL Pointed Head is.

[Richard Yates]

On Mon, 15 May 2017 20:49:32 -0400, Jerry Stuckle

I was wrong.A better cultural reference is this one:
http://www.startrek.com/uploads/assets/articles/insetbalkwhite.jpg

[Jerry Stuckle]

Richard, do you really believe I give a damn what you think?