Using Cesium with CSP settings

Hi all,

I recently started to check some Content-Security-Policy settings on our server and to my big surprise noticed, that I can’t use Cesium anymore. As soon as I set

Content-Security-Policy script-src 'self'

the viewport does not come up and instead the browser throws an error:

Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self'"

Adding ‘unsafe-eval’ to the settings would be possible in theory, but is basically an absolute no-go security wise.

I search a bit and found posts saying one should disable all Cesium widgets. Fine for me, as we don’t use them. However, it doesn’t solve the issue. The error still appears.

Is there any way to run Cesium is a rather secured way?

Thanks in advance,

Heiner

Hi all,

I have to come back on this issue. Is there any way to use CesiumJS without “unsafe-eval” settings?

From the stack-trace Chrome gives me, I can tell, that it has something to do with Knockout, however I was not able to trace the error to something useful. I don’t know, if there are any settings available in Cesium to get rid of these thins.

This is a serious problem. “unsafe-eval” is not allowed in many environments, and it would be a shame, if CesiumJS could not be used in these cases.

Hi there,

We current ship knockout with the combined CesiumJS release regardless if your app uses the widgets or not.

Could you provide any details around how you are loading CesiumJS in your application? Are you using a JS build tool? Are you including it from a script tag?

I would suggest going a step beyond not using the CesiumJS Widgets and make sure that no code related to knockout is being included in your app. Depending on how you are including CesiumJS, we can suggest a method.

We’ve been considering shipping a Widget-less build of CesiumJS for reasons such as this.

Thanks,
Gabby

Hi Heiner,

Did you have any progress on this subject ? I’m facing the same issue…

Best regards
Jérôme

Hi Jérôme,

yes I did. While investigating the issue, I learned that the problem occurs even if you don’t use any Knockout based widgets, because the respective “eval” is executed just upon parsing the file.

Reason is the following statement:

var t=this||(0,eval)("this")

However, it is fairly simple to patch the code accordingly. I have a small script, which is executed after building my app:


const replace = require('replace-in-file');

const replaceOptions = {
    files: cesiumFile,
    from: /this\|\|\(0,eval\)\("this"\)/g,
    to: 'this\|\|window'
}

const results = replace.sync(replaceOptions);

I don’t know, if this patch will still work for people using the Cesium Widgets. But as long as you don’t use them, everything’s works just fine.

1 Like

If you are using npm or yarn, we’ve also recently published @cesium/engine which is a widget-less build of CesiumJS that may work for your use case.

1 Like

Thanks to both of you !
I’ll try those solutions and let you know…