„Nie znaleziono metatagu Content-Security-Policy”. błąd w mojej aplikacji phonegap


94

Po aktualizacji Cordova 5.0 w moim systemie tworzę nowe aplikacje. Kiedy testowałem moją aplikację na urządzeniu, w dzienniku konsoli pojawia się błąd:

No Content-Security-Policy meta tag found.
Please add one when using the Cordova-plugin-whitelist plugin.: 23.

Dodaję meta w sekcji head

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

Ale znowu mam ten sam błąd, w aplikacji używam wtyczki do przeglądarki w aplikacji i 7 innych linków do stron internetowych.


3
Czy poprawnie zainstalowałeś wtyczkę cordova-plugin-whitelist- github.com/apache/cordova-plugin-whitelist ? Następnie będziesz musiał dodać <allow-navigation href="http://*/*" />do
pliku

1
Dzięki Keval, po dodaniu <allow-navigation href = "http: // * / *" /> teraz moja aplikacja działa dobrze. Jeszcze raz dziękuję.


3
Jeśli błąd można utworzyć, gdy w kodzie brakuje jednego znaku, dlaczego SO nie zezwala na edycję krótszą niż sześć znaków? Ten jest dość łatwy do naprawienia, po prostu próbował uratować kogoś innego na kilka sekund w przyszłości. Na końcu atrybutu content metatagu brakuje podwójnego cudzysłowu.
Jason D.

Odpowiedzi:


86

Po dodaniu białej listy cordova-plugin , musisz powiedzieć aplikacji, aby zezwoliła na dostęp do wszystkich linków do stron internetowych lub określonych łączy, jeśli chcesz zachować je specyficzne.

Możesz po prostu dodać to do pliku config.xml , który można znaleźć w katalogu głównym aplikacji:

Zalecane w dokumentacji:

<allow-navigation href="http://example.com/*" />

lub:

<allow-navigation href="http://*/*" />

Z dokumentacji wtyczki:

Biała lista nawigacji

Kontroluje adresy URL, do których można przejść do samego WebView. Dotyczy tylko nawigacji najwyższego poziomu.

Dziwactwa: na Androidzie dotyczy to również ramek iframe dla schematów innych niż http (s).

Domyślnie nawigacja tylko do adresów URL file: // jest dozwolona. Aby zezwolić na inne adresy URL, musisz dodać tagi do pliku config.xml:

<!-- Allow links to example.com -->
<allow-navigation href="http://example.com/*" />

<!-- Wildcards are allowed for the protocol, as a prefix
     to the host, or as a suffix to the path -->
<allow-navigation href="*://*.example.com/*" />

<!-- A wildcard can be used to whitelist the entire network,
     over HTTP and HTTPS.
     *NOT RECOMMENDED* -->
<allow-navigation href="*" />

<!-- The above is equivalent to these three declarations -->
<allow-navigation href="http://*/*" />
<allow-navigation href="https://*/*" />
<allow-navigation href="data:*" />


38

Musisz dodać metatag CSP w sekcji głównej aplikacji index.html

Zgodnie z https://github.com/apache/cordova-plugin-whitelist#content-security-policy

Polityka bezpieczeństwa treści

Określa, które żądania sieciowe (obrazy, XHR itp.) Mogą być wysyłane (bezpośrednio przez przeglądarkę internetową).

W systemach Android i iOS biała lista żądań sieciowych (patrz wyżej) nie jest w stanie filtrować wszystkich typów żądań (np. <video>& WebSockets nie są blokowane). Dlatego oprócz białej listy należy używać tagu polityki bezpieczeństwa treści <meta> na wszystkich swoich stronach.

W systemie Android obsługa CSP w ramach systemu Webview zaczyna się od KitKat (ale jest dostępna we wszystkich wersjach korzystających z Crosswalk WebView).

Oto kilka przykładowych deklaracji CSP dla Twoich .htmlstron:

<!-- Good default declaration:
    * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
    * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
    * Disables use of eval() and inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
        * Enable inline JS: add 'unsafe-inline' to default-src
        * Enable eval(): add 'unsafe-eval' to default-src
-->
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; media-src *">

<!-- Allow requests to foo.com -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self' foo.com">

<!-- Enable all requests, inline styles, and eval() -->
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">

<!-- Allow XHRs via https only -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self' https:">

<!-- Allow iframe to https://cordova.apache.org/ -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; frame-src 'self' https://cordova.apache.org">

Kiedy dodam CSP Decleration, następujący fragment kodu mapy google nie działa w ten sposób. Dowolny pomysł ? var pos = new google.maps.LatLng (position.coords.latitude, position.coords.longitude); // wiersz 173 11-09 21: 17: 30.724: D / SystemWebChromeClient (25692): file: ///android_asset/www/index.html: Line 173: Uncaught ReferenceError: google is not
specified

1
Musiałem zamknąć metatagi za pomocą />, aby zostać rozpoznanym
metamagikum

23

W Twoim metatagu są błędy.

Twój:

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

Poprawione:

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

Zwróć uwagę na dwukropek po „script-src” i podwójny cudzysłów na końcu tagu meta.


3
kiedy <meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'"/>
dołączam

@codePlusPlus, aby ponownie aktywować Ionic livereload, dodaj http://localhost:35729do dyrektywy script-scr i dyrektywy ws://localhost:35729connect-src.
kolli

@kolli, czy możesz pokazać, jak wyglądałyby nowe dyrektywy? nie jest jasne, jak dodać je do dyrektyw.
jessewolfe

Widzę, że informacje są w oryginalnym poście. Ale wyjaśnienie: Zauważ, że „dodawanie”, to oznacza, że można zastąpić script-src 'self' 'unsafe-inline' 'unsafe-eval'z script-src 'self' http://localhost:35279 'unsafe-inline' 'unsafe-eval'i chcesz dodać nową dyrektywę o oddzielającej średnikiem na końcu atrybutu content:; script-src ws://localhost:35279
jessewolfe

Korekta powyżej ... w drugiej części tak powinno być ; connect-src 'self' ws://localhost:35279. Zauważ, że otrzymywałem błąd (nie mogłem uzyskać dostępu do file: // <ścieżka do index.html> z powodu naruszenia CSP) dopóki nie dodałem „self”.
jessewolfe

2

Jak dla mnie wystarczyło przeinstalować wtyczkę białej listy :

cordova plugin remove cordova-plugin-whitelist

i wtedy

cordova plugin add cordova-plugin-whitelist

Wygląda na to, że aktualizacja z poprzednich wersji Cordova nie powiodła się.


1

Dla mnie problem polegał na tym, że korzystałem z przestarzałych wersji platform cordova na androida i ios . Tak więc aktualizacja do android@5.1.1 i ios@4.0.1 rozwiązała problem.

Możesz uaktualnić do tych określonych wersji:

cordova platforms rm android
cordova platforms add android@5.1.1
cordova platforms rm ios
cordova platforms add ios@4.0.1

miałeś na myśli androida 5.1.1 ?
mix3d

Postępowałem zgodnie z radami @Maxim i Pierre-Alexis de Solminihac i wreszcie moja aplikacja działała dobrze. Dzięki!
Zalakain

0

Jest inny problem dotyczący połączenia. Niektóre wersje Androida mogą się łączyć, ale niektóre nie. Jest więc inne rozwiązanie

w AndroidManifest.xml:

<application ... android:usesCleartextTraffic="true">
        ...
    </application>

Po prostu dodaj „android: usesCleartextTraffic =" true "”

i wreszcie problem rozwiązany.

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.