Codeigniter 4 enviroment make JSON.parse fail - javascript

I'm new in codeigniter 4
I just started a new project in Codeigniter 4, and i got an error using JSON.parse,
Unexpected token < in JSON at position 30
I get two different results from using different enviroments:
Default// did not make any change to codeigniter config
-The code run totaly fine, though for a second i manage to see a bug in console
-The bad thing, in this enviroment most of debugging tools are deactivated something that i would like to have while working.
SetEnv CI_ENVIRONMENT production // which makes the debugging tools from CI4 appear, this line is in .htacess
-The code stops at JSON.parse and get the error described before in console
So here it is how my code is estructured:
//controller
echo json_encode(array('status' => 0,'message'=>'Access denied'));
//response rgets data from callback from a controller
console.log(response);//{status:0,message:'Access denied'}
data=JSON.parse(response); //error
//Other fixes i already tried
data=JSON.parse(JSON.stringify(response)); //Works fine, but returns a string, need an object
data=JSON.parse(JSON.parse(JSON.stringify(response))); //error
data=JSON.parse("{status:0,message:'Access denied'} "); //Even trying to use directly a JSON format throws error
data=JSON.parse({status:0,message:'Access denied'}) //error, without the comas
data=JSON.parse([{status:0,message:'Access denied'}]) //error
The debbuging tools seem to stop the loading when they find a bug, but i have not managed to find what i am doing wrong. Hope you can help me with this and thanks in advance.
EDIT
I´m using webix libraries for request, but they return string format.
I tried manually what you suggested,but the result was the same. It works if use CI4 in production env, but fails at development mode.
//Solutions tried
response = JSON.parse({"status":0,"message":"Access denied"});//error
response = JSON.parse("{'status':0,'message':'Access denied'}");//error

echo json_encode(array('status' => 0,'message'=>'Access denied'));
//the response should be like this
{"status":0,"message":"Access denied"}
and then use like this
data=JSON.parse(response);
and kindly check your datatype during the post and it should be a json

Related

Error 500, AJAX to PHP using $_POST [duplicate]

This question already has answers here:
Reference - What does this error mean in PHP?
(38 answers)
Closed 4 years ago.
EDIT:
This is solved. Thank's to everyone who pointed me towards the error log files. Amazing community, this got answered so much faster than I expected.
I'm embarred to say... it was a semicolon.
As a study project, I'm working on a home automation based on a Raspberry Pi.
I installed Apache and built a small website that functions as a GUI. On click, data will be sent via POST-request to ajax.php (in the root folder) which then writes stuff into text files (that then will be read by a python script to do things with the GPIOs - not very elegant, but that's the task now).
Some relevant code:
$("#R0Light1_on").click(function(){
var Value = $(this).val();
var data = {'id': 'R0Light1_on', 'value': Value};
$.ajax({
type: 'POST',
url: 'ajax.php',
data: data,
success: function(){
console.log("#R0Light1_on", data);
$("#R0Light1_on").addClass("on");
$("#R0Light1_off").removeClass("off");
},
error: function() {alert('ERROR: $.ajax #R0Light1_on');}
});
});
<?php
if (isset($_POST['id'])) {
switch ($_POST['id']){
case 'R0Light1_on':
R0Light1_on();
break;
case 'R0Light1_off':
R0Light1_off();
break;
}
}
function R0Light1_on() {
$content = "Not relevant to this Question";
$fp = fopen("/var/www/html/shares/pi/R0Light1_on.txt","wb");
fwrite($fp,$content);
fclose($fp);
exit;
}
function R0Light1_off() {
...
}
?>
<button type="button" id="R0Light1_on" value="1">an</button>
AJAX worked for a month now. 200 ok, all the time and $_POST['id'] did it's job. Then yesterday, it stopped doing so. I don't know what I did, but now it's throwing 500 Internal Server Error messages at me. Even using back-up files doesn't help me and I feel like I read everything Google could find me.
One Thing do I know, though: when I remove the if(isset($_POST['id']))-part, the HTTP-request is successful again (it just also make's the php-script useless, as obvious).
Btw, changing everything to GET doesn't help either (data is visible in URL, but the error stays the same).
Thanks for your time, I'd really appreciate any kind of help.
A 500 error is an internal server error.
You can check your PHP error_log file in the root directory of where the script runs or alternatively at the top of your script, add this to enable error reporting and see the real error that the 500 error translates to:
error_reporting(E_ALL);
#ini_set('display_errors', 1);
It is most likely a PHP fatal error or syntax error.
The issue might be related permissions on the text file, or that it's failing to write to it. Adding permissions to the file would help resolve the issue.
One way to fix this yourself is by checking your apache/php error logs. That should give you a pretty clear indication where the problem lies.

PHP error reporting suppresses AJAX error

The development server I work on had PHP errors logging turned off, so when I start a new project I add my own logging config:
error_reporting(E_ERROR);
ini_set('display_errors','On');
ini_set('error_log','/var/tmp/don-errors.log');
With this set my ajax/php widget works perfectly.
When I remove the logging set up I get a parseerror and the famous:
SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
If I add just the first line back:
error_reporting(E_ERROR);
The ajax JSON error goes away and everything is back to working perfectly. I've been searching everything I can find on what would cause the JSON error, but that's another question. I'm curious why I get no PHP errors in my PHP log with logging on, or JSON errors in console, but with logging removed I get the JSON error in the browser console and my widget dies.
I don't want to publish my widget with the logging in just to supress the error.
Here is the JSON string I'm sending back to the JavaScript as a response.
{"status":"success","data":{"dialogTargetId":"dialog-target-2969-212430","dialogId":"dialog-2969-212430","addBtnId":"addbtn-2969-212430","prodId":"2969","poId":"212430","dialogHtml":"<div class=\"buyer-note-dialog\" id=\"dialog-2969-212430\" title=\"Buyer Product Notes\"><div class=\"buyer-note-input\">\n\t\t<textarea name=\"buyer-note-text\" id=\"input-2969-212430\" product_id=\"2969\" po_id=\"212430\" class=\"buyer-note-text\" cols=\"35\" rows=\"3\"><\/textarea>\n\t\t<br><div style=\"padding-top: 5px\"><button id=\"addbtn-2969-212430\" emp-id=\"198\" textarea_id=\"input-2969-212430\" po_id=\"212430\" product_id=\"2969\">Add Note<\/button>\n\t\t<\/div><\/div><div id=\"output-box-2969-212430\" class=\"buyer-note-output-box\"><\/div><\/div>"}}

Why am I getting this Internal Server Error in the Laravel Framework?

I have come across a situation that doesn't make much sense to me. Just as some background information, I'm using the Laravel framework. The page in question calls a query when the page is requested using Laravel's '->with('var', $array)' syntax. This query (which I will post later) works perfectly fine on page load, and successfully inserts dummy data I fed it.
I call this same query via an Ajax $.post using jQuery, on click of a button. However, when I do this $.post and call this query, I get an Internal Server Error every time. Everything is exactly the same, information passed included; the only difference seems to be whether or not it is called on page load or via the $.post.
Here is the error:
Below is the code that performs the query on page load:
routes.php sends the HTTP get request to a file called AppController.php
routes.php
AppController.php
The page is then made with the following array acquired from DeviceCheckoutController.php
Which then goes to DeviceCheckout.php
I am able to echo $test on the page, and it returns the ID of a new row every time the page is reloaded (which obviously mean the 'insertGetId' query worked). However, I hooked this query up to the page load just to test. What I really want to happen is on click of a button. Here is the code for that:
$("#checkoutFormbox").on('click', '#checkoutButton', function() {
var checkoutInformation = Object();
var accessories = [];
var counter = 0;
var deviceName = checkoutDeviceTable.cell(0, 0).data();
$(".accessoryCheckbox").each(function() {
//add accessory ID's to this list of only accessories selected to be checked out
if($(this).val() == "1")
{
accessories[counter] = $(this).data('id') + " ";
}
counter++;
});
checkoutInformation['deviceID'] = $(".removeButton").val(); //deviceID was previously stored in the remove button's value when the add button was clicked
checkoutInformation['outBy'] = '';
checkoutInformation['outNotes'] = $("#checkOutDeviceNotes").val();
checkoutInformation['idOfAccessories'] = 2;
checkoutInformation['dueDate'] = $("#dueDate").val();
if($("#studentIdButton").hasClass('active'))
{
checkoutInformation['renterID'] = 0;
checkoutInformation['emplid'] = 1778884;
console.log(checkoutInformation);
$.post("http://xxx.xxx.xxx.xxx/testing/public/apps/devicecheckout-checkoutdevices", {type: "checkoutDeviceForStudent", checkoutInformation: checkoutInformation}, function(returnedData) {
alert(returnedData);
});
}
});
Which is also then routed to AppController.php, specifically to the 'checkoutDeviceForStudent' part of the switch statement:
And then back to that query that is shown previously in DeviceCheckout.php
Finally, here is my DB structure for reference:
Any explanation as for why this would be happening? Also, any Laravel or other general best practice tips would be greatly appreciated as I'm inexperienced in usage of this framework and programming overall.
Sorry for such a long post, I hope there is enough information to diagnose this problem. Let me know if I need to include anything else.
Edit: Included picture of error at the top of the page.
Everything is exactly the same, information passed included
No, it isn't. If it was exactly the same you wouldn't be getting the error you're getting.
These sorts of issues are too difficult to solve by taking guesses at what the problem might be. You need to
Setup your system so Laravel's logging errors to the laravel.log file
Setup you PHP system so errors Laravel can't handled are logged to your webserver's error log (and/or PHP's error log)
Put Laravel in debug mode so errors are output the the screen, and the view the output of your ajax request via Firebug or Chrome
Once you have the actual PHP error it's usually pretty easy to see what's different about the request you think is the same, and address the issue.
I found a resolution to my problem after some advice from a friend; much easier than I anticipated and much easier than any solution that has been offered to me here or other places.
Essentially, what I needed to do was place a try, catch clause in my model function, and then if an exception is encountered I store that in a variable, return it, and use console.log() to view the exception. Here is an example to emulate my point:
public function getUserFullname($userID)
{
try
{
$myResult = DB::connection('myDatabase')->table('TheCoolestTable')->select('fullName')->where('userID', '=', $userID)->get();
return $myResult;
}
catch(Exception $e)
{
$errorMessage = 'Caught exception: ' . $e->getMessage();
return $errorMessage;
}
}
And then on the View (or wherever your model function returns to), simply console.log() the output of your POST. This will display the results of the successful query, or the results of the Exception if it encountered one as opposed to an unhelpful Internal Server Error 500 message.

Twitter Bootstrap Typeahead With Static Data

I need to use typeahead for very large data. Generation of data consumes 4-5 seconds. So I cannot make Ajax calls each time. I download and cache the data upon user request. My code is the following:
$("#build-package-list-btn").click(function(){
$.get**JSON**("/packages", function(data){
// data is an array
$("#typeahead-packages").typeahead({source:data});
console.log(data == null); // returns false
});
})
It gives no error but whenever I try to write to typeahead text box, it gives me the following error:
Uncaught TypeError: Cannot call method 'toLowerCase' of null bootstrap.js:1644
Typeahead.matcher bootstrap.js:1644
(anonymous function) bootstrap.js:1631
e.extend.grep jquery-1.7.2.min.js:2
Typeahead.lookup bootstrap.js:1630
Typeahead.keyup bootstrap.js:1738
e.extend.proxy.g jquery-1.7.2.min.js:2
f.event.dispatch jquery-1.7.2.min.js:3
f.event.add.h.handle.i jquery-1.7.2.min.js:3
My typeahead is like this (JADE)
input#typeahead-packages(type="text",data-provide="typeahead")
Also in the Chrome Console I tried:
$("#typeahead-packages").typeahead({source:["abcdef","abcddd","abcccc"]});
But typeahead does not give an error but it also does not work. I cannot find what am I doing wrong. I am using the 2.0.4 bootstrap.
EDIT: I changed it to getJSON from get it did not help. However when I construct data like this, it is working:
data = [new String((data[0])), new String((data[5]))];
Based on your update, the problem comes from the JSON.
jQuery.getJSON()
Important: As of jQuery 1.4, if the JSON file contains a syntax error, the request will usually fail silently.
(source)
You should concentrate on the source of the items. be sure that this is an array of strings. Your error suggest data is a string.
You can use the Chrome Console (or any of your choice), under the Network tab, and spy on the actual results of your AJAX request. JSONLint is an interesting tool to validate your result.
Then your next problem will be to update the source of an already initialized typeahead. You can use the following code :
var $myTypeahead = $('#myTypeahead');
var typeaheadObj = $myTypeahead.data('typeahead');
if(typeaheadObj) typeaheadObj.source = ["abc", "cde"];
Example (jsfiddle)

Uncaught SyntaxError: Unexpected token :

I am running an AJAX call in my MooTools script, this works fine in Firefox but in Chrome I am getting a Uncaught SyntaxError: Unexpected token : error, I cannot determine why. Commenting out code to determine where the bad code is yields nothing, I am thinking it may be a problem with the JSON being returned. Checking in the console I see the JSON returned is this:
{"votes":47,"totalvotes":90}
I don't see any problems with it, why would this error occur?
vote.each(function(e){
e.set('send', {
onRequest : function(){
spinner.show();
},
onComplete : function(){
spinner.hide();
},
onSuccess : function(resp){
var j = JSON.decode(resp);
if (!j) return false;
var restaurant = e.getParent('.restaurant');
restaurant.getElements('.votes')[0].set('html', j.votes + " vote(s)");
$$('#restaurants .restaurant').pop().set('html', "Total Votes: " + j.totalvotes);
buildRestaurantGraphs();
}
});
e.addEvent('submit', function(e){
e.stop();
this.send();
});
});
Seeing red errors
Uncaught SyntaxError: Unexpected token <
in your Chrome developer's console tab is an indication of HTML in the response body.
What you're actually seeing is your browser's reaction to the unexpected top line <!DOCTYPE html> from the server.
Just an FYI for people who might have the same problem -- I just had to make my server send back the JSON as application/json and the default jQuery handler worked fine.
This has just happened to me, and the reason was none of the reasons above. I was using the jQuery command getJSON and adding callback=? to use JSONP (as I needed to go cross-domain), and returning the JSON code {"foo":"bar"} and getting the error.
This is because I should have included the callback data, something like jQuery17209314005577471107_1335958194322({"foo":"bar"})
Here is the PHP code I used to achieve this, which degrades if JSON (without a callback) is used:
$ret['foo'] = "bar";
finish();
function finish() {
header("content-type:application/json");
if ($_GET['callback']) {
print $_GET['callback']."(";
}
print json_encode($GLOBALS['ret']);
if ($_GET['callback']) {
print ")";
}
exit;
}
Hopefully that will help someone in the future.
I have just solved the problem. There was something causing problems with a standard Request call, so this is the code I used instead:
vote.each(function(element){
element.addEvent('submit', function(e){
e.stop();
new Request.JSON({
url : e.target.action,
onRequest : function(){
spinner.show();
},
onComplete : function(){
spinner.hide();
},
onSuccess : function(resp){
var j = resp;
if (!j) return false;
var restaurant = element.getParent('.restaurant');
restaurant.getElements('.votes')[0].set('html', j.votes + " vote(s)");
$$('#restaurants .restaurant').pop().set('html', "Total Votes: " + j.totalvotes);
buildRestaurantGraphs();
}
}).send(this);
});
});
If anyone knows why the standard Request object was giving me problems I would love to know.
I thought I'd add my issue and resolution to the list.
I was getting: Uncaught SyntaxError: Unexpected token < and the error was pointing to this line in my ajax success statement:
var total = $.parseJSON(response);
I later found that in addition to the json results, there was HTML being sent with the response because I had an error in my PHP. When you get an error in PHP you can set it to warn you with huge orange tables and those tables were what was throwing off the JSON.
I found that out by just doing a console.log(response) in order to see what was actually being sent. If it's an issue with the JSON data, just try to see if you can do a console.log or some other statement that will allow you to see what is sent and what is received.
When you request your JSON file, server returns JavaScript Content-Type header (text/javascript) instead of JSON (application/json).
According to MooTools docs:
Responses with javascript content-type will be evaluated automatically.
In result MooTools tries to evaluate your JSON as JavaScript, and when you try to evaluate such JSON:
{"votes":47,"totalvotes":90}
as JavaScript, parser treats { and } as a block scope instead of object notation. It is the same as evaluating following "code":
"votes":47,"totalvotes":90
As you can see, : is totally unexpected there.
The solution is to set correct Content-Type header for the JSON file. If you save it with .json extension, your server should do it by itself.
It sounds like your response is being evaluated somehow. This gives the same error in Chrome:
var resp = '{"votes":47,"totalvotes":90}';
eval(resp);
This is due to the braces '{...}' being interpreted by javascript as a code block and not an object literal as one might expect.
I would look at the JSON.decode() function and see if there is an eval in there.
Similar issue here:
Eval() = Unexpected token : error
This happened to me today as well. I was using EF and returning an Entity in response to an AJAX call. The virtual properties on my entity was causing a cyclical dependency error that was not being detected on the server. By adding the [ScriptIgnore] attribute on the virtual properties, the problem was fixed.
Instead of using the ScriptIgnore attribute, it would probably be better to just return a DTO.
This happened to because I have a rule setup in my express server to route any 404 back to /# plus whatever the original request was. Allowing the angular router/js to handle the request. If there's no js route to handle that path, a request to /#/whatever is made to the server, which is just a request for /, the entire webpage.
So for example if I wanted to make a request for /correct/somejsfile.js but I miss typed it to /wrong/somejsfile.js the request is made to the server. That location/file does not exist, so the server responds with a 302 location: /#/wrong/somejsfile.js. The browser happily follows the redirect and the entire webpage is returned. The browser parses the page as js and you get
Uncaught SyntaxError: Unexpected token <
So to help find the offending path/request look for 302 requests.
Hope that helps someone.
If nothing makes sense, this error can also be caused by PHP Error that is embedded inside html/javascript, such as the one below
<br />
<b>Deprecated</b>: mysql_connect(): The mysql extension is deprecated and will be removed in the future: use mysqli or PDO instead in <b>C:\Projects\rwp\demo\en\super\ge.php</b> on line <b>54</b><br />
var zNodes =[{ id:1, pId:0, name:"ACE", url: "/ace1.php", target:"_self", open:true}
Not the <br /> etc in the code that are inserted into html by PHP is causing the error. To fix this kind of error (suppress warning), used this code in the start
error_reporting(E_ERROR | E_PARSE);
To view, right click on page, "view source" and then examine complete html to spot this error.
"Uncaught SyntaxError: Unexpected token" error appearance when your data return wrong json format, in some case, you don't know you got wrong json format.
please check it with alert(); function
onSuccess : function(resp){
alert(resp);
}
your message received should be: {"firstName":"John", "lastName":"Doe"}
and then you can use code below
onSuccess : function(resp){
var j = JSON.decode(resp); // but in my case i'm using: JSON.parse(resp);
}
with out error "Uncaught SyntaxError: Unexpected token"
but if you get wrong json format
ex:
...{"firstName":"John", "lastName":"Doe"}
or
Undefined variable: errCapt in .... on line<b>65</b><br/>{"firstName":"John", "lastName":"Doe"}
so that you got wrong json format, please fix it before you JSON.decode or JSON.parse
I had the same problem and it turned out that the Json returned from the server
wasn't valid Json-P. If you don't use the call as a crossdomain call use regular Json.
My mistake was forgetting single/double quotation around url in javascript:
so wrong code was:
window.location = https://google.com;
and correct code:
window.location = "https://google.com";
In my case putting / at the beginning of the src of scripts or href of stylesheets solved the issue.
I got this error because I was missing the type attribute in script tag.
Initially I was using but when I added the type attribute inside the script tag then my issue is resolved
I got a "SyntaxError: Unexpected token I" when I used jQuery.getJSON() to try to de-serialize a floating point value of Infinity, encoded as INF, which is illegal in JSON.
In my case i ran into the same error, while running spring mvc application due to wrong mapping in my mvc controller
#RequestMapping(name="/private/updatestatus")
i changed the above mapping to
#RequestMapping("/private/updatestatus")
or
#RequestMapping(value="/private/updatestatus",method = RequestMethod.GET)
For me the light bulb went on when I viewed the source to the page inside the Chrome browser. I had an extra bracket in an if statement. You'll immediately see the red circle with a cross in it on the failing line. It's a rather unhelpful error message, because the the Uncaught Syntax Error: Unexpected token makes no reference to a line number when it first appears in the console of Chrome.
I did Wrong in this
`var fs = require('fs');
var fs.writeFileSync(file, configJSON);`
Already I intialized the fs variable.But again i put var in the second line.This one also gives that kind of error...
For those experiencing this in AngularJs 1.4.6 or similar, my problem was with angular not finding my template because the file at the templateUrl (path) I provided couldn't be found. I just had to provide a reachable path and the problem went away.
In my case it was a mistaken url (not existing), so maybe your 'send' in second line should be other...
This error might also mean a missing colon or : in your code.
Facing JS issues repetitively I am working on a Ckeditor apply on my xblock package. please suggest to me if anyone helping me out. Using OpenEdx, Javascript, xblock
xblock.js:158 SyntaxError: Unexpected token '=>'
at eval (<anonymous>)
at Function.globalEval (jquery.js:343)
at domManip (jquery.js:5291)
at jQuery.fn.init.append (jquery.js:5431)
at child.loadResource (xblock.js:236)
at applyResource (xblock.js:199)
at Object.<anonymous> (xblock.js:202)
at fire (jquery.js:3187)
at Object.add [as done] (jquery.js:3246)
at applyResource (xblock.js:201) "SyntaxError: Unexpected token '=>'\n at eval (<anonymous>)\n at Function.globalEval (http://localhost:18010/static/studio/common/js/vendor/jquery.js:343:5)\n at domManip (http://localhost:18010/static/studio/common/js/vendor/jquery.js:5291:15)\n at jQuery.fn.init.append (http://localhost:18010/static/studio/common/js/vendor/jquery.js:5431:10)\n at child.loadResource (http://localhost:18010/static/studio/bundles/commons.js:5091:27)\n at applyResource (http://localhost:18010/static/studio/bundles/commons.js:5054:36)\n at Object.<anonymous> (http://localhost:18010/static/studio/bundles/commons.js:5057:25)\n at fire (http://localhost:18010/static/studio/common/js/vendor/jquery.js:3187:31)\n at Object.add [as done] (http://localhost:18010/static/studio/common/js/vendor/jquery.js:3246:7)\n at applyResource (http://localhost:18010/static/studio/bundles/commons.js:5056:29)"
Late to the party but my solution was to specify the dataType as json. Alternatively make sure you do not set jsonp: true.
Try this to ignore this issue:
Cypress.on('uncaught:exception', (err, runnable) => {
return false;
});
Uncaught SyntaxError: Unexpected token }
Chrome gaved me the error for this sample code:
<div class="file-square" onclick="window.location = " ?dir=zzz">
<div class="square-icon"></div>
<div class="square-text">zzz</div>
</div>
and solved it fixing the onclick to be like
... onclick="window.location = '?dir=zzz'" ...
But the error has nothing to do with the problem..

Categories

Resources