“Không tìm thấy thẻ meta Nội dung-Bảo mật-Chính sách.” lỗi trong ứng dụng bản đồ điện thoại của tôi

Sau khi cập nhật Cordova 5.0 trong hệ thống của mình, tôi tạo các ứng dụng mới. Khi tôi kiểm tra ứng dụng của mình trên một thiết bị, lần đó tôi gặp lỗi trong nhật ký bảng điều khiển:

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

Tôi thêm meta trong phần đầu

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

Nhưng một lần nữa, tôi lại gặp lỗi tương tự, trong ứng dụng tôi sử dụng plugin trình duyệt trong ứng dụng và 7 liên kết trang web khác.

Sau khi thêm cordova-plugin-whitelist , bạn phải yêu cầu ứng dụng của mình cho phép truy cập vào tất cả các liên kết trang web hoặc liên kết cụ thể, nếu bạn muốn giữ nó cụ thể.

Bạn chỉ cần thêm cái này vào config.xml của mình, bạn có thể tìm thấy cái này trong thư mục gốc của ứng dụng:

Được đề xuất trong tài liệu:

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

hoặc là:

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

Từ tài liệu của plugin:

Danh sách trắng điều hướng

Kiểm soát URL mà chính WebView có thể được điều hướng đến. Chỉ áp dụng cho điều hướng cấp cao nhất.

Quirks: trên Android, nó cũng áp dụng cho iframe cho (các) lược đồ không phải http.

Theo mặc định, chỉ cho phép điều hướng đến tệp: // URL. Để cho phép các URL khác, bạn phải thêm thẻ vào config.xml của mình:

<!-- 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:*" />

Bạn phải thêm thẻ meta CSP trong phần đầu của ứng dụng index.html

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

Chính sách bảo mật nội dung

Kiểm soát yêu cầu mạng nào (hình ảnh, XHR, v.v.) được phép thực hiện (trực tiếp qua webview).

Trên Android và iOS, danh sách trắng yêu cầu mạng (xem ở trên) không thể lọc tất cả các loại yêu cầu (ví dụ: <video>& WebSockets không bị chặn). Vì vậy, ngoài danh sách trắng, bạn nên sử dụng thẻ Chính sách bảo mật nội dung <meta> trên tất cả các trang của mình.

Trên Android, hỗ trợ cho CSP trong webview hệ thống bắt đầu với KitKat (nhưng khả dụng trên tất cả các phiên bản sử dụng Crosswalk WebView).

Dưới đây là một số khai báo CSP mẫu cho các .htmltrang của bạn :

<!-- 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">

Có lỗi trong thẻ meta của bạn.

Của bạn:

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

Đã sửa:

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

Lưu ý dấu hai chấm sau "script-src" và dấu ngoặc kép cuối thẻ meta.

Đối với tôi, chỉ cần cài đặt lại plugin danh sách trắng là đủ :

cordova plugin remove cordova-plugin-whitelist

và sau đó

cordova plugin add cordova-plugin-whitelist

Có vẻ như việc cập nhật từ các phiên bản trước của Cordova không thành công.

Đối với tôi, vấn đề là tôi đang sử dụng các phiên bản lỗi thời của nền tảng cordova android và ios . Vì vậy, nâng cấp lên android@5.1.1 và ios@4.0.1 đã giải quyết được vấn đề này.

Bạn có thể nâng cấp lên các phiên bản cụ thể sau:

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

Có một vấn đề khác về kết nối. Một số phiên bản Android có thể kết nối nhưng một số không thể. Vì vậy, có một giải pháp khác

trong AndroidManifest.xml:

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

Chỉ cần thêm 'android: usingCleartextTraffic = "true"'

và vấn đề được giải quyết cuối cùng.