Problème Content-security-policy cordova

Par Adrien Luneau, il y a 10 ans

Javascript

Salut tout le monde!

Aujourd'hui j'ai voulu me lancé dans une app cordova j'avais un site fait entierement avec angular donc portable sur n'importe quoi qui communique avec un serveur en socket.IO.

Je me suis dis "cool je vais juste avoir à copier coller mon app est responsive etc".
Donc je fais je mets evidement les .Js necessaire à cordova etc

Je lance mon app et là problème:

Refused to load the script 'http://192.168.0.10:3000/socket.io/socket.io.js' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-inline' 'unsafe-eval'".

J'ai trouvé qu'il fallait installer le plugin white list, ce que j'ai fait.
J'ai egalement rajouté ces lignes au config.xml:

<allow-intent href="ws://"/> <allow-intent href="*" /> <access origin="*" subdomains="true" />

et dans mon index:

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">

mais voilà seulement l'erreur est toujours là...

Si quelqu'un a connaissant la solution pourrait m'éclairer ce serait super!

5 réponses

mckenziearts, il y a 10 ans

Salut Adrien j'avais exactement le même probleme. Pour resoudre ce problème tu dois mettre ceci plutot dans ton index

<meta http-equiv="Content-Security-Policy"/>

et dans ton fichier config.xml tu ajoutes :

<meta http-equiv="Content-Security-Policy"/> <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; media-src *"/> <meta http-equiv="Content-Security-Policy" content="default-src 'self' foo.com"/> <meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'"/> <meta http-equiv="Content-Security-Policy" content="default-src 'self' https:"/> <meta http-equiv="Content-Security-Policy" content="default-src 'self'; frame-src 'self' https://cordova.apache.org"/>

Je prefere te donner le tout parce que je suppose que tu fais beaucoup de requete ajax.

Adrien Luneau, il y a 10 ans

Merci beaucoup ça a résolu en parti mon problème!
je retiens le code pour mes futur projet!

j'ai cependant encore un soucis qui doit être du même ordre j'ai pleins d'erreur 404 de reqête socket.io sur http://file...
je vous copie colle ma console javascript (qui vient de ripple )

Ripple :: Environment Warming Up (Tea. Earl Grey. Hot.) ripple.js:50 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/. http://localhost:4400/ripple/assets/ripple.js Failed to load resource: the server responded with a status of 404 (Not Found)(anonymous function) @ ripple.js:50module.exports.initialize @ ripple.js:50_baton.pass @ ripple.js:13xhr.onreadystatechange @ ripple.js:39 ripple.js:37 cordova :: Initialization Finished (Make it so.) http://localhost:4400/img/%7B%7Buser.userName%7D%7D.jpg Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:4400/socket.io/?EIO=3&transport=polling&t=1446667203744-0 Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:4400/socket.io/?EIO=3&transport=polling&t=1446667204859-1 Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:4400/socket.io/?EIO=3&transport=polling&t=1446667206443-2 Failed to load resource: the server responded with a status of 404 (Not Found) ripple.js:50 GET http://localhost:4400/socket.io/?EIO=3&transport=polling&t=1446667208736-3 404 (Not Found)(anonymous function) @ ripple.js:50Request.create @ socket.io.js:2919Request @ socket.io.js:2842XHR.request @ socket.io.js:2773XHR.doPoll @ socket.io.js:2803Polling.poll @ socket.io.js:3192Polling.doOpen @ socket.io.js:3136Transport.open @ socket.io.js:2313Socket.open @ socket.io.js:1743Socket @ socket.io.js:1625Socket @ socket.io.js:1560Manager.open.Manager.connect @ socket.io.js:299(anonymous function) @ socket.io.js:564 ripple.js:50 GET http://localhost:4400/socket.io/?EIO=3&transport=polling&t=1446667213770-4 404 (Not Found)

encore une fois je ne comprend pas vraiment ce a quoi ça correspond..
Est-ce mon app ou juste ripple ?

mckenziearts, il y a 10 ans

C'est plus une configuration niveau serveur je pense. Ton serveur utilise une adresse differente

'http://192.168.0.10:3000/socket.io/socket.io.js' ".

et ton appli cordova une autre

http://localhost:4400/socket.io/?EIO=3&transport=polling&t=1446667206443-2

Peut etre c'est du au cross domain origin. Moi dans mon application le serveur est fait avec symfony 2 et niveau configuration pour permettre a mon aapplication d'attaquer facilement mon serveur j'ai mit une config du genre

origin_regex: true allow_origin: ['^http://localhost:[0-9]+'] allow_headers: ['X-Custom-Auth'] allow_methods: ['POST', 'PUT', 'GET', 'DELETE'] max_age: 3600 hosts: ['^api\.']

Jsais pas si sa peut t'aider mais chez moi sa marche sans probleme. Essai de trouver un equivalent pour ton serveur pour permettre a ton serveur de reconnaitre les requetes qui viennent d'ailleurs d'ou la ligne

allow_origin: ['^http://localhost:[0-9]+']
Adrien Luneau, il y a 10 ans

OK merci :)

j'ai comrpis grâce à ton message que la route était changé.
J'ai regardé et j'ai modifié ma ligne io.connect() par io.connect("http://192.168.0.10:3000") pour déjà forcer les choses un peu

Et ensuite je me suis intéréssé a Ripple qui fait arriver par defaut les requete vers le reseau sur du local donc j'ai desactivé l'option :)
et j'ai deployé mon app sur un téléphone android et paf ça a marché du premier coup!!

Merci beaucoup de ton aide précieuse!

mckenziearts, il y a 10 ans

De rien :) beaucoup de courage. Si ton probleme est résolu tu marques alors le sujet en résolu :)