CODEWITHSUNDEEP
androidgoogle-chromegetusermediasecure-context
Developer
Developer

Reputation: 695

In android's Google Chrome, how to set unsafely-treat-insecure-origin-as-secure

I'm using getUserMedia() in my web app which works fine when I test my app on localhost. But if I treat my laptop as server and launch app in Google Chrome browser of my android phone, it gives me the error:

getUserMedia() no longer works on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS. See https://goo.gl/rStTGz for more details.

When I checked [https://goo.gl/rStTGz][1] I got to know that getUserMedia() is deprecated on insecure origins. It is written that for development mode,

You can run chrome with the --unsafely-treat-insecure-origin-as-secure="example.com" flag (replacing "example.com" with the origin you actually want to test)

How and where can I set this flag? Is there any other alternative?

Upvotes: 30

Views: 17790

Answers (3)

Sahil Singh
Sahil Singh

Reputation: 3797

This can be done from chrome://flags/ or about://flags.

Go to about://flags, search for unsafely-treat-insecure-origin-as-secure flag, and enable it. You will have to provide the origin which you want to be treated as secure.
Multiple origins can be entered as comma-separated values.
Relaunch your browser after making this change.

Note that the protocol part is also important, and specifying the IP address, or the domain name isn't enough. eg. http:// in http://192.168.43.45. If you are not using port 80, then you may have to specify that too.

The following is a screenshot from my mobile phone.

Mobile: Samsung Galaxy S10e
Android version: 10 (Android 10)
Google Chrome version: 79.0.3945.136

About flags in chrome on Android

For local testing of a website I am building, geolocation was needed. Geolocation is allowed in secure locations. I do have a production server with HTTPS certificate, but the development and the debugging process would become too slow if I have to upload content to it every time.

More info

  1. https://www.chromium.org/Home/chromium-security/prefer-secure-origins-for-powerful-new-features

Upvotes: 17

Damian Yerrick
Damian Yerrick

Reputation: 4664

Move localhost to the device

One method is to run an HTTP server on your Android device. The consensus in answers to this question is that NanoHTTPD is worth trying. If you want a ready-made application, a web search for http server for android turned up Simple HTTP Server on Google Play Store. After copying the client side of your web application to the device and starting the server, you should be able to open http://localhost:12345 in Chrome for Android.

Or make your test server secure

You can test secure-context-only features without using --unsafely-treat-insecure-origin-as-secure by turning your existing test server into a potentially trustworthy origin. Follow these steps:

  1. If you do not already own a domain at a registrar that bundles DNS hosting compatible with the dehydrated ACME client, register one. This incurs a fee, which recurs as long as you keep the domain active.
  2. Point a subdomain at your test web server's internal IP address. It need not be reachable from the Internet.
  3. Configure your test web server to respond to HTTPS on port 443 of this subdomain, using NameVirtualHost or the like.
  4. Use the dehydrated ACME client with the appropriate dns-01 hook for your DNS host to obtain a certificate from Let's Encrypt for your test web server.
  5. Install this certificate into your test web server.

Upvotes: 2

Jewel_Sam
Jewel_Sam

Reputation: 92

I faced with this problem too, but in Chromium, Ubuntu. I solved the problem with running this command in console: 

chromium-browser --unsafely-treat-insecure-origin-as-secure="http://localhost.dev:3000" --user-data-dir=~/.config/chromium/Profile 1

where localhost.dev:3000 is your website.

For other systems information there:

where is data directory

how to launch chrome and set keys

Short information about --unsafely-treat-insecure-origin-as-secure flag:

Treat given (insecure) origins as secure origins. Multiple origins can be supplied. Has no effect unless --user-data-dir is also supplied. Example:

--unsafely-treat-insecure-origin-as-secure=http://a.test,http://b.test --user-data-dir=/test/only/profile/dir

I didn't check, but for android you maybe can also set flags on chrome://flags page.

Upvotes: -1

Related Questions