Develop Reference

Load socket.io with cordova android build

I have a small chat app project that I created with node.js, express and socket.io. And installed those modules with npm. App is working on the desktops as expected. I'm trying to built the android version of the app with cordova. And when i run cordova run android it opens the app on my phone and load the main ui with no problem and however it really doesn't work (functions) and I get this error in Chrome developer console remote devices, when i add socket.io js file like this in index.html
<script src="/socket.io/socket.io.js"></script>
socket.io.js:1 Failed to load resource: net::ERR_FILE_NOT_FOUND
Since app is running on port 3000 on localhost then I tried add the socket.io js script like this in the index.html
<script src="http://localhost:3000/socket.io/socket.io.js"></script>
And then this error occurs
Refused to load the script 'http://localhost:3000/socket.io/socket.io.js' because it violates the following Content Security Policy directive: "script-src 'self' http://* 'unsafe-inline' 'unsafe-eval'".
This is the Content-Security-Policy meta tag
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' http://* 'unsafe-inline'; script-src 'self' http://* 'unsafe-inline' 'unsafe-eval'" />

If you want to import the socket.io file from the app storage remove the first slash and ensure that the file are present inside the www folder.
For android check in platforms/android/app/src/main/assets/www the content of that folder is the content of your app. Check there if your socket.io file is present and with the correct path.

Websocket Connection does no longer work with Cordova Android 7

I recently updated my Cordova app to Cordova Android 7.1.1 (from 6.x). I'm using websockets in this app to connect to another app running a websocket server, which used to work fine. Now, after upgrading to Cordova Android 7.1.1, the connection can no longer be established. It fails with this message (from the chrome console):
WebSocket connection to 'ws://192.168.178.20:52998/' failed:
Error in connection establishment: net::ERR_ACCESS_DENIED
No changes were made in the code which is responsible for establishing the connection. It looks like this:
ns.connection = new WebSocket(uri); // uri would be e.g. 'ws://192.168.178.20:52998/'
I cannot find the reason for this. I already tried to add CSP headers and more, but to no avail. I made sure the connection is working in general, so it must be somehow related to changes made from Cordova Android 6.x to 7.x I'd guess.

Changes in Cordova included obeying CORS headers. You have to now make sure your CORS is setup to allow. For example:
config.xml:
<access origin="*" />
<allow-navigation href="*"/>
Content-Security-Policy in index.html:
<meta http-equiv="Content-Security-Policy" content="default-src *; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data:">

Ionic 1 external HTTP request

I am trying to consume HTTP services from an external location but only get ERR_CONNECTION_TIMED_OUT because the request never gets to the server.
The app have been built with ionic 1 and angularjs, using angular-resource to consume services
After reading several SO questions I end up setting up my app as follows:
config.xml
<allow-navigation href="*" />
<access origin="*" />
index.html
<meta http-equiv="Content-Security-Policy" content="default-src 'self' http://server_ip:8080 data: gap: *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
of course, service_ip is the real server ip address and it accepts HTTP requests as I have been able to consume them using REST clients.
Other considerations:
The app is built and launched using command ionic run android.
I am using plugin cordova-plugin-whitelist. (I removed and added it again following several SO answers... without success).
Also using plugin angular-resource for HTTP requests. Requests are correct as I have tested them using local machine ip and they work, problems came after changing that ip to the server ip.
It looks like a CORS problem, I expected to solve it via meta tag in index.html file but the behaviour is the same even when I set up:
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
Any help will be appreciated.

Finally, the problem was on my device. I had to upgrade Google's WebView application in my device to get it work.
Solution was found here

Cordova XHR requests failing by prefixing url with file:///

My app is working just fine after cordova run browser, but it cannot connect to my backend server when deployed to iOS using cordova run ios (local resources load properly).
Debugger tells me the problem may be that it prefixes all XHR requests to backend server with file:///var, so that instead of http://my-backend.com/rest It tries to connect to file:///varhttp://my-backend.com/rest.
I have whitelist plugin installed, <access origin="*" /> in my config and this line in index.html when deploying to iOS:
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; content-src *">
If it's important, on front end I use Angular with ngCordova and Restangular plugin for handling AJAX requests. I use Cordova 6.2.0.
So the question is, how do I get rid of this file:///var prefix?
EDIT:
As it turns out, there's a similar error on Android device, but the prefix is file:///android_asset
EDIT 2:
My AJAX calls are made with Restangular. I have default url set like this:
RestangularProvider.setBaseUrl("http://my-backend.com"), and example call looks like this: Restangular.one('session/check').get()

Refused to load the image 'http://192.xxx.x3000/' because it violates the following Content Security Policy directive: "default-src 'self'"

When I run an ionic app in Android Studio on a phone running android 5 no images are displayed and I get this message for each image:
Refused to connect to 'http://192.xxx.x.xxx:3000/promotions/0' because it violates the following Content Security Policy directive: "default-src 'self'". Note that 'connect-src' was not explicitly set, so 'default-src' is used as a fallback.
On content-security-policy.com I found and tried the following:
Starter Policy
This policy allows images, scripts, AJAX, and CSS from the same origin, and does not allow any other resources to load (eg object, frame, media, etc). It is a good starting point for many sites.
default-src 'none'; script-src 'self'; connect-src 'self'; img-src 'self'; style-src 'self';
But still no luck. In fact I have tried many permutations of the Content Security Policy all without success.
I get the same as using Android Studio when I use:
ionic build android
ionic run android
The images are stored on a JSON-server which runs ok and everything works fine on localhost on the computer.
Any pointers for solving this issue ? Thanks

try to add this meta in the head
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval' ">