skip to Main Content

I have question about good practise coding.
I have a chrome extension which is supposed to track tab events for dev purpose.
Then the service worker send the json.stringified string embedded in http get to server php code which writes those events to a file to be immediately read with PhpStorm.
On browser I can step debug the service worker and
all works nicely until the highlighted event produces a string that strigify cannot handle:

"{"name":"highlighted","payload":{"tabIds":[1875383020],"windowId":1875382695}}"

Next point I can monitor the string is on server’s php debugger which tells:

{"name":"highlighted","payload":{"tabIds": => Array

Sorry. I previously said stringify brakes.That is not correct.
What I mean I need to extend stringify’s functionality(by means of a helper function) to get the string converted for http GET and then convert it back in receiving end.
Stringify works as expected but square brackets interfere with http GET and received Request at the PHP end is truncated.
I wonder why http GET don’t like it?

How would you formulate chrome extension’s service worker’s helper function to help the JSON.stringify work for http GET request for given string above containing square brackets inside nested object?
As you now must see this must happen be at chrome extension’s service worker. JSON.stringify makes that given good json string but HTTP GET don’t like it.
So I want to use GET here and then I must formulate that string so that
it is still containing all the essetial fields when it arrives to php.
Now it gets cutted right at first square bracket.
This is the initial event listener:

function handleHighlight(highlightInfo){

            handleEvent("highlighted",highlightInfo);
}
chrome.tabs.onHighlighted.addListener(handleHighlight);

I see there is only one element in array but I’m looking for solution with possibly many of them for code to be reused.
This is the breakpoint at service worker where the string is created for GET.

enter image description here

This how it gets encoded:
enter image description here

function handleEvent(name, payload) {
    var load  = JSON.stringify({name, payload})
    const encoded = encodeURI(load);
    fetch('http://localhost:80/tabs_report/tabs_query_report.php?'+load);
}

Then $_SERVER reveals:
enter image description here

And PHP goes (with debug overlay) like:
enter image description here

And GET and REQUEST:
enter image description here

I wonder how the full information is contained in $_SERVER but it is lost in GET and REQUEST.

2

Answers


  1. URL query strings are expected to be form-encoded, not JSON encoded. PHP is trying to decode URL query strings into $_GET, but to do that the query string must be form-encoded. PHP doesn’t expect JSON as a query string. What you end up with is some more or less random interpretation of the query string. It’s not supposed to work.

    Send the JSON string as a query-string value, then properly JSON-decode that on the PHP side:

    var load = JSON.stringify({name, payload})
    const encoded = encodeURIComponent(load);
    fetch('http://localhost:80/tabs_report/tabs_query_report.php?data=' + load);
    
    $data = json_decode($_GET['data'], true);
    foreach ($data as $key => $value) ...
    
    Login or Signup to reply.
  2. A couple of obvious issues.

    Firstly

    const encoded = encodeURI(load);
    

    should be

    const encoded = encodeURIComponent(load)
    

    because you’re only encoding one bit of the URL, not the whole thing. (see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI vs https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent).

    Secondly:

    'http://localhost:80/tabs_report/tabs_query_report.php?'+load
    

    …this doesn’t include a parameter name as per the format of a URL querystring parameter (i.e. name=value). So it wouldn’t show up properly in $_GET, for example, because there’s no name to put in the array key. From your debugging screenshots it looks like PHP is trying to use the first bit of the JSON as a name, which of course isn’t helpful.

    I’d expect to see

    'http://localhost:80/tabs_report/tabs_query_report.php?payload='+load 
    

    for the URL, and then something like

    $json = $_GET["payload"]; 
    

    in the PHP to read that payload.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search