Config("CSP") format

Hi All,

Just trying to find the format for adding a site to a control attribute in CSP.

Want to add a site to the allow statement for img-src which current has as default some google sites already. I can edit the config.php file manually and add it and it works no probs but have been trying to workout how to add it via code using Config command but having no luck with the format for Config(“CSP”) and setting the allow.

Any pointers appreciated.

TIA
Steve.

You may post your code for discussion.

This is the var_dump of the array

{

["font-src"]=> array(3) {

["self"]=> bool(true)

["data"]=> bool(true)

["allow"]=> array(1) {

[0]=> string(25) "https://fonts.gstatic.com"

}

}

["form-action"]=> array(1) {

["self"]=> bool(true)

}

["object-src"]=> array(1) {

["self"]=> bool(true)

}

["frame-ancestors"]=> array(1) {

["self"]=> bool(true)

}

["frame-src"]=> array(2) {

["self"]=> bool(true)

["allow"]=> array(2) {

[0]=> string(12) "*.google.com"

[1]=> string(13) "*.youtube.com"

}

}

["script-src"]=> array(5) {

["self"]=> bool(true)

["unsafe-inline"]=> bool(true)

["unsafe-eval"]=> bool(true)

["blob"]=> bool(true)

["allow"]=> array(9) {

[0]=> string(32) "https://www.google-analytics.com"

[1]=> string(24) "https://*.googleapis.com"

[2]=> string(21) "https://*.gstatic.com"

[3]=> string(12) "*.google.com"

[4]=> string(19) "https://*.ggpht.com"

[5]=> string(23) "*.googleusercontent.com"

[6]=> string(21) "https://js.pusher.com"

[7]=> string(22) "https://cdn.tiny.cloud"

[8]=> string(21) "https://*.youtube.com"

}

}

["connect-src"]=> array(4) {

["self"]=> bool(true)

["blob"]=> bool(true)

["data"]=> bool(true)

["allow"]=> array(3) {

[0]=> string(24) "https://*.googleapis.com"

[1]=> string(21) "https://*.gstatic.com"

[2]=> string(12) "*.google.com"

}

}

["style-src"]=> array(3) {

["self"]=> bool(true)

["unsafe-inline"]=> bool(true)

["allow"]=> array(2) {

[0]=> string(21) "https://*.gstatic.com"

[1]=> string(24) "https://*.googleapis.com"

}

}

["style-src-attr"]=> array(1) {

["unsafe-inline"]=> bool(true)

}

["img-src"]=> array(4) {

["self"]=> bool(true)

["blob"]=> bool(true)

["data"]=> bool(true)

["allow"]=> array(6) {

[0]=> string(24) "https://*.googleapis.com"

[1]=> string(21) "https://*.gstatic.com"

[2]=> string(27) "https://*.openstreetmap.org"

[3]=> string(22) "https://api.mapbox.com"

[4]=> string(12) "*.google.com"

[5]=> string(23) "*.googleusercontent.com"

}

}

["worker-src"]=> array(2) {

["self"]=> bool(true)

["blob"]=> bool(true)

}

}

and this is my play code

var_sys_log(Config("CSP"));

Config("CSP")["img-src"]["allow"][6] = "https://1234.com";

var_sys_log(Config("CSP"));

function var_sys_log( $object=null ) {

ob_start(); // start buffer capture

var_dump( $object ); // dump the values

$contents = ob_get_contents(); // put the buffer into a variable

ob_end_clean(); // end capture

//error_log( $contents ); // log contents of the result of var_dump( $object );

//syslog( LOG_WARNING, $contents ); // log contents of the result of var_dump( $object );

LOG( $contents ); // log contents of the result of var_dump( $object )

}

The resulting array basically hasn’t changed anything. Basically still 6 array elements with no additions in “allow”

{

["font-src"]=> array(3) {

["self"]=> bool(true)

["data"]=> bool(true)

["allow"]=> array(1) {

[0]=> string(25) "https://fonts.gstatic.com"

}

}

["form-action"]=> array(1) {

["self"]=> bool(true)

}

["object-src"]=> array(1) {

["self"]=> bool(true)

}

["frame-ancestors"]=> array(1) {

["self"]=> bool(true)

}

["frame-src"]=> array(2) {

["self"]=> bool(true)

["allow"]=> array(2) {

[0]=> string(12) "*.google.com"

[1]=> string(13) "*.youtube.com"

}

}

["script-src"]=> array(5) {

["self"]=> bool(true)

["unsafe-inline"]=> bool(true)

["unsafe-eval"]=> bool(true)

["blob"]=> bool(true)

["allow"]=> array(9) {

[0]=> string(32) "https://www.google-analytics.com"

[1]=> string(24) "https://*.googleapis.com"

[2]=> string(21) "https://*.gstatic.com"

[3]=> string(12) "*.google.com"

[4]=> string(19) "https://*.ggpht.com"

[5]=> string(23) "*.googleusercontent.com"

[6]=> string(21) "https://js.pusher.com"

[7]=> string(22) "https://cdn.tiny.cloud"

[8]=> string(21) "https://*.youtube.com"

}

}

["connect-src"]=> array(4) {

["self"]=> bool(true)

["blob"]=> bool(true)

["data"]=> bool(true)

["allow"]=> array(3) {

[0]=> string(24) "https://*.googleapis.com"

[1]=> string(21) "https://*.gstatic.com"

[2]=> string(12) "*.google.com"

}

}

["style-src"]=> array(3) {

["self"]=> bool(true)

["unsafe-inline"]=> bool(true)

["allow"]=> array(2) {

[0]=> string(21) "https://*.gstatic.com"

[1]=> string(24) "https://*.googleapis.com"

}

}

["style-src-attr"]=> array(1) {

["unsafe-inline"]=> bool(true)

}

["img-src"]=> array(4) {

["self"]=> bool(true)

["blob"]=> bool(true)

["data"]=> bool(true)

["allow"]=> array(6) {

[0]=> string(24) "https://*.googleapis.com"

[1]=> string(21) "https://*.gstatic.com"

[2]=> string(27) "https://*.openstreetmap.org"

[3]=> string(22) "https://api.mapbox.com"

[4]=> string(12) "*.google.com"

[5]=> string(23) "*.googleusercontent.com"

}

}

["worker-src"]=> array(2) {

["self"]=> bool(true)

["blob"]=> bool(true)This is the var_dump of the array

{
["font-src"]=> array(3) {
["self"]=> bool(true)
["data"]=> bool(true)
["allow"]=> array(1) {
[0]=> string(25) "https://fonts.gstatic.com"
}
}
["form-action"]=> array(1) {
["self"]=> bool(true)
}
["object-src"]=> array(1) {
["self"]=> bool(true)
}
["frame-ancestors"]=> array(1) {
["self"]=> bool(true)
}
["frame-src"]=> array(2) {
["self"]=> bool(true)
["allow"]=> array(2) {
[0]=> string(12) "*.google.com"
[1]=> string(13) "*.youtube.com"
}
}
["script-src"]=> array(5) {
["self"]=> bool(true)
["unsafe-inline"]=> bool(true)
["unsafe-eval"]=> bool(true)
["blob"]=> bool(true)
["allow"]=> array(9) {
[0]=> string(32) "https://www.google-analytics.com"
[1]=> string(24) "https://*.googleapis.com"
[2]=> string(21) "https://*.gstatic.com"
[3]=> string(12) "*.google.com"
[4]=> string(19) "https://*.ggpht.com"
[5]=> string(23) "*.googleusercontent.com"
[6]=> string(21) "https://js.pusher.com"
[7]=> string(22) "https://cdn.tiny.cloud"
[8]=> string(21) "https://*.youtube.com"
}
}
["connect-src"]=> array(4) {
["self"]=> bool(true)
["blob"]=> bool(true)
["data"]=> bool(true)
["allow"]=> array(3) {
[0]=> string(24) "https://*.googleapis.com"
[1]=> string(21) "https://*.gstatic.com"
[2]=> string(12) "*.google.com"
}
}
["style-src"]=> array(3) {
["self"]=> bool(true)
["unsafe-inline"]=> bool(true)
["allow"]=> array(2) {
[0]=> string(21) "https://*.gstatic.com"
[1]=> string(24) "https://*.googleapis.com"
}
}
["style-src-attr"]=> array(1) {
["unsafe-inline"]=> bool(true)
}
["img-src"]=> array(4) {
["self"]=> bool(true)
["blob"]=> bool(true)
["data"]=> bool(true)
["allow"]=> array(6) {
[0]=> string(24) "https://*.googleapis.com"
[1]=> string(21) "https://*.gstatic.com"
[2]=> string(27) "https://*.openstreetmap.org"
[3]=> string(22) "https://api.mapbox.com"
[4]=> string(12) "*.google.com"
[5]=> string(23) "*.googleusercontent.com"
}
}
["worker-src"]=> array(2) {
["self"]=> bool(true)
["blob"]=> bool(true)
}
}

and this is my play code 

var_sys_log(Config("CSP"));
Config("CSP")["img-src"]["allow"][6] = "https://1234.com";
var_sys_log(Config("CSP"));


function var_sys_log( $object=null ) {
	ob_start();                    // start buffer capture
	var_dump( $object );           // dump the values
	$contents = ob_get_contents(); // put the buffer into a variable
	ob_end_clean();                // end capture
	//error_log( $contents );        		// log contents of the result of var_dump( $object );
	//syslog( LOG_WARNING, $contents );       // log contents of the result of var_dump( $object );
    LOG( $contents );       // log contents of the result of var_dump( $object )
}

The resulting array basically hasn't changed anything. Basically still 6 array elements with no additions in "allow"

{
["font-src"]=> array(3) {
["self"]=> bool(true)
["data"]=> bool(true)
["allow"]=> array(1) {
[0]=> string(25) "https://fonts.gstatic.com"
}
}
["form-action"]=> array(1) {
["self"]=> bool(true)
}
["object-src"]=> array(1) {
["self"]=> bool(true)
}
["frame-ancestors"]=> array(1) {
["self"]=> bool(true)
}
["frame-src"]=> array(2) {
["self"]=> bool(true)
["allow"]=> array(2) {
[0]=> string(12) "*.google.com"
[1]=> string(13) "*.youtube.com"
}
}
["script-src"]=> array(5) {
["self"]=> bool(true)
["unsafe-inline"]=> bool(true)
["unsafe-eval"]=> bool(true)
["blob"]=> bool(true)
["allow"]=> array(9) {
[0]=> string(32) "https://www.google-analytics.com"
[1]=> string(24) "https://*.googleapis.com"
[2]=> string(21) "https://*.gstatic.com"
[3]=> string(12) "*.google.com"
[4]=> string(19) "https://*.ggpht.com"
[5]=> string(23) "*.googleusercontent.com"
[6]=> string(21) "https://js.pusher.com"
[7]=> string(22) "https://cdn.tiny.cloud"
[8]=> string(21) "https://*.youtube.com"
}
}
["connect-src"]=> array(4) {
["self"]=> bool(true)
["blob"]=> bool(true)
["data"]=> bool(true)
["allow"]=> array(3) {
[0]=> string(24) "https://*.googleapis.com"
[1]=> string(21) "https://*.gstatic.com"
[2]=> string(12) "*.google.com"
}
}
["style-src"]=> array(3) {
["self"]=> bool(true)
["unsafe-inline"]=> bool(true)
["allow"]=> array(2) {
[0]=> string(21) "https://*.gstatic.com"
[1]=> string(24) "https://*.googleapis.com"
}
}
["style-src-attr"]=> array(1) {
["unsafe-inline"]=> bool(true)
}
["img-src"]=> array(4) {
["self"]=> bool(true)
["blob"]=> bool(true)
["data"]=> bool(true)
["allow"]=> array(6) {
[0]=> string(24) "https://*.googleapis.com"
[1]=> string(21) "https://*.gstatic.com"
[2]=> string(27) "https://*.openstreetmap.org"
[3]=> string(22) "https://api.mapbox.com"
[4]=> string(12) "*.google.com"
[5]=> string(23) "*.googleusercontent.com"
}
}
["worker-src"]=> array(2) {
["self"]=> bool(true)
["blob"]=> bool(true)
}
}

}

}

If you change Config("CSP"), you need to save it back, e.g.

$csp = Config("CSP"); // Get
$csp["img-src"]["allow"][] = "https://1234.com";
Config("CSP", $csp); // Set

You may use the simpler way, e.g.

Config()->append("CSP.img-src.allow", "https://1234.com");

Thank you so much.:pray:Knew that the notation had to be something like
but missed the method append while scanning through the class. (or the doc online)

Now, that has changed the array and I had been banging my head on that one but am I missing something here?

Here is the resulting allow array and all looks great. Has added quickchart.io to the end of the allow for img-src

Config()->append("CSP.img-src.allow", "https://quickchart.io");

results in

["img-src"]=> array(4) {
["self"]=> bool(true)
["blob"]=> bool(true)
["data"]=> bool(true)
["allow"]=> array(7) {
[0]=> string(24) "https://*.googleapis.com"
[1]=> string(21) "https://*.gstatic.com"
[2]=> string(27) "https://*.openstreetmap.org"
[3]=> string(22) "https://api.mapbox.com"
[4]=> string(12) "*.google.com"
[5]=> string(23) "*.googleusercontent.com"
[6]=> string(21) "https://quickchart.io"
}

:white_check_mark:Looks great

But I still get the original error message

usersview:423 Refused to load the image 'https://quickchart.io/chart?chs=200x200&chld=M|0&cht=qr&chl=...' because it violates the following Content Security Policy directive: "img-src 'self' https://*.googleapis.com https://*.gstatic.com https://*.openstreetmap.org https://api.mapbox.com https://*.google.com *.google.com https://*.googleusercontent.com *.googleusercontent.com blob: data:".

In the browser console and seems to indicate the new config wasn’t used.

I test using incognito mode so that I don’t pick up any cache hits etc.
Do I need to reload something to pickup this new config? I have this code in Page_Head so it is hit before the page is built.

TIA
Steve.

Adding Config()->append("CSP.img-src.allow", "https://quickchart.io"); in Page_Head server event is too late, you should use Global Code.

Works great. Thanks. :+1:First time I’ve used the “Global Code” section.

I will write this up and add it into the Tips section as this will as I’m sure others will find this useful.