How to allow Chrome to access my camera on localhost? - javascript

I cloned a project about real-time image processing on a web browser from this link:
Then I could not allow my browser to access my camera.
I got this javascript alert:
Uh-oh, the webcam didn't start. Do you have a webcam? Did you give it
permission? Refresh to try again.
And the allow button is not shown as if I access his site.

To ignore Chrome’s secure origin policy, follow these steps.
Navigate to chrome://flags/#unsafely-treat-insecure-origin-as-secure in Chrome.
Find and enable the Insecure origins treated as secure section (see below).
Add any addresses you want to ignore the secure origin policy for. Remember to include the port number too (if required).
Save and restart Chrome.
I found solution from below link.Hope it will help to someone
https://medium.com/#Carmichaelize/enabling-the-microphone-camera-in-chrome-for-local-unsecure-origins-9c90c3149339

Are you accessing the webpage that is served over HTTP, on localhost? If you are accessing it from http://localhost/... , Chrome will ask for your permission to use the camera.
If you are opening the web page directly, i.e. /Users/Methuz/Documents/index.html then it will not work, even if you explicitly allows it permission
In this case, the workaround I use is to host the HTML file on a webserver. A quick hack is to use python, in the folder where the HTML page is lcoated: python -m SimpleHTTPServer

Step 1:
Find your chrome preferences file:
http://www.forensicswiki.org/wiki/Google_Chrome#Configuration
Step 2:
Open it and Find the "profile" key
Step3:
Under profile there will be a "content_settings" hash, that will have a "pattern_pairs" hash
Add this to it:
"*,*": {
"media-stream-camera": 1
}
Final example:
"profile": {
....
"content_settings": {
....
"pattern_pairs": {
"*,*": {
"media-stream-camera": 1
},
....
}
}
}
WARNING: This will allow all websites access to your camera

Chrome now only allows https:// servers to persistent list (version 39.xx)
https://support.google.com/chrome/answer/2693767?hl=en
Allow: This allows the site to access your camera and microphone at this time and a notification will appear confirming that you’ve granted access. If you select Allow on a "http" URL your preference will not be remembered in future visits. If you select Allow on a "https" URL, your preference will be remembered in future visits.
Maybe this link helps to set your local secure server if you are using Wamp.
http://forum.wampserver.com/read.php?2,32986
Then you can add your local server to persistent allow list of chrome.

Got this problem for days, only this helped:
Reinstall Chrome by removing configuration as well. And try not to sync all the extensions, as they may interfere.
sudo apt-get purge google-chrome-stable
rm -rf ~/.config/google-chrome
Then install from official.

Another solution is to use iframe tag. Jest deploy your page on server (localhost or external) and include it in your local html.
Example:
<iframe src="http://localhost/your_project/index.html"></iframe>

Chrome on HTTP or any other port won't save the preference of Camara share choice.
To save the selection you will need to run on HTTPs, even if you don't have SSL certificate on localhost that fine. Just add https before the localhost url and it will ask you its unsafe, if you want to proceed add it as an exception under Advance options. Do that and then Chrome will save you camera sharing preference for this website. and won't ask you to select allow

You can choose a different default permission setting and manage exceptions in Content settings.
Click the Chrome menu Chrome menu on the browser toolbar.
Select Settings.
Click Show advanced settings.
In the "Privacy" section, click Content settings.
In the "Media" section:
* Ask me when a site requires access to my camera and microphone: Select this option if you want Chrome to alert you whenever a site requests access to your camera and microphone.
* Do not allow sites to access my camera and microphone: Select this option to automatically deny any site requests to access your camera and microphone.
Or click Manage exceptions to remove previously-granted permissions for specific sites.
Source: https://support.google.com/chrome/answer/2696491?hl=en
P/D: the link you provided has an error. I can't access.

Open localhost/webcam.swf
then right click on the flash file then allow the webcam and tick remember
that will add exception for localhost

Related

browser extension - customize ERR_BLOCKED_BY_CLIENT window [duplicate]

I am building a new extension and I would like to customize the default error page in Google Chrome. I have gone through the "Override Pages" documentation here but have yet to find anything about customizing the page I have specified.
Any suggestions are much appreciated. Thank you.
The error page I want to customize is:
This webpage is not available
The server at ____ can't be found, because the DNS lookup
failed. DNS is the network service that translates a website's name to
its Internet address. This error is most often caused by having no
connection to the Internet or a misconfigured network. It can also be
caused by an unresponsive DNS server or a firewall preventing Google
Chrome from accessing the network. Here are some suggestions: Reload
this webpage later. Check your Internet connection. Restart any
router, modem, or other network devices you may be using. Check your
DNS settings. Contact your network administrator if you're not sure
what this means. Try disabling network prediction by following these
steps: Go to the wrench menu > Options > Under the Hood and deselect
"Predict network actions to improve page load performance." If this
does not resolve the issue, we recommend selecting this option again
for improved performance. Add Google Chrome as a permitted program in
your firewall's or antivirus software's settings. If it is already a
permitted program, try deleting it from the list of permitted programs
and adding it again. If you use a proxy server, check your proxy
settings or contact your network administrator to make sure the proxy
server is working. If you don't believe you should be using a proxy
server, adjust your proxy settings: Go to the wrench menu > Options >
Under the Hood > Change proxy settings... > LAN Settings and deselect
the "Use a proxy server for your LAN" checkbox.
Error 105 (net::ERR_NAME_NOT_RESOLVED): Unable to resolve the server's
DNS address.
The chrome.override isn't meant for this. Instead you can detect a DNS resolution error using chrome.webRequest API. If you see this error you can load a different URL into the tab. Something along these lines:
chrome.webRequest.onErrorOccurred.addListener(onErrorOccurred, {urls: ["http://*/*", "https://*/*"]});
function onErrorOccurred(details)
{
if (details.error == "net::ERR_NAME_NOT_RESOLVED")
chrome.tabs.update(details.tabId, {url: "..."});
}

How to whitelist custom port entry so Chrome offers the options to enable Camera and Mic

I added a custom port in etc/hosts file
127.0.0.1 testlocalhost.com
When launch server(http not https) from this port, I noticed Chrome banned Camera and Mic permissions, and threw
getUserMedia() no longer works on insecure origins
When launch from localhost directly, I can change these 2 permissions although still seeing Your connection to this site is not secure warning.
I was wondering if it's possible to whitelist the custom port.
thanks!!!
(When test in Firefox, it still gives me the options to change Camera and Mic permissions.)
Right in the error message you must have had, there is a link to this page, where there is a paragraph about Testing Powerful Features which enumerates a few options, and among them,
You can run chrome with the --unsafely-treat-insecure-origin-as-secure="http://example.com" flag (replacing "example.com" with the origin you actually want to test), which will treat that origin as secure for this session. Note that on Android and ChromeOS this requires having a device with root access/dev mode. (This flag is broken in Chrome 63 but fixed in Chrome 64 and later. Prior to Chrome 62, you must also include the --user-data-dir=/test/only/profile/dir to create a fresh testing profile for the flag to work.)
So you just have to start Chrome from command lines with the flag --unsafely-treat-insecure-origin-as-secure="http://testlocalhost.com"
Short answer is no - you cannot bypass the saved word localhost with an IP address which represents it. The reason is that Google Chrome uses the actual word localhost to detect develper debugging and allow using getUserMedia via HTTP. All other addresses, regardless if they represent localhost or not, are only allowed to use getUserMedia via HTTPS or WSS.
Like above post answered, I can run chrome with flag by chrome://flags/ in search bar, search flag: insecure origins treated as secure, enable it, and add your custom ports there, separate with ,

How can I bypass CORS security in a browser?

I have a Javascript application running in a browser, and I want to access some data sitting in a server that can't enable CORS.
It's not a testing application, is meant for the end-user, even if a little techy one.
I considered:
PHP Proxy: Not appropriate. Server on the other side make decision about IP geolocation.
Java/SilverLight: Unfortunately my #1 target is Chrome
JSON: Not available
What are my options?
Please notice that I'm not trying to make any malicious application: if the user need to approve or allow me to make this request is totally fine.
You are trying to do exactly what the Same Origin Policy is designed to prevent (and what CORS is designed to allow the server to permit).
Your options are:
Find a way to work with whomever controls the server
Get the users to download and install software which isn't subject to the Same Origin Policy (such as a stand-alone application or a browser extension).
You need to ask your users to install chrome extension to overcome CORS. I used to use it while developing ionic apps and testing on chrome
https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?hl=en
https://chrome.google.com/webstore/detail/cors-toggle/omcncfnpmcabckcddookmnajignpffnh?hl=en

How to get access permissions when installing an app instead of requesting permission while using it

I'm using Cordova 5.2.0 to build my app for iOS, and then testing it on an iPhone plugged in to the computer. When getting the user's location or trying to access the camera, a notification pops up requesting permission similar to the behavior exhibited by browsers. I'd rather the user be required to allow these to install the app rather than have a popup within the app which, if rejected, will render a good bit of things useless.
From reading the docs and various other posts, I tried adding the following code to config.xml:
<feature name="Geolocation">
<param name="ios-package" value="CDVLocation" />
</feature>
<!-- etc for camera and other features -->
In case it would help, I removed the iOS platform and re-added it. I built the project and tested it on my device, and it is still requesting those permissions within the app. How do I get permissions on installation instead?
iOS's permissions model is different than Android. On Android, you are requested to give the app the necessary permissions on the install phase (that, by the way, is also changing on M version of Android OS, coming out soon). On iOS, the user can install the app, regardless of the requested permissions, and then, he/she is displayed with popups requesting them to approve give each of the necessary permissions. The user can say 'no' to any and all requested permissions and still be able to use the app ( of course, not all of is features, if he/she hasn't gave the necessary permissions). There is no way to change that, and I believe it's much better for the user. I guess Google believes it to, otherwise they wouldn't have changed their permissions model to match the one Apple has on iOS.
You can read this article to see one view about a comparison between the two models: Android vs. iOS permissions model
What you can do, by the way, is determine when the popup will be displayed to the user. The recommended way to go is to show it to him/her only when the user first attempts to use the feature that requires the permissions. But, if you want to display the popup earlier (highly un recommended), you can simply try to "use" the ability which requires the permissions in the background, and the popup will be displayed to the user.
One last note, please notice that the user can, at any time, revoke one of more of the permissions he/she has already granted your app and your app must be able to handle that.
I hope this helps. Good Luck!

how to make use fake ui permanent in chrome?

I have made an application to record a video by following this steps : https://github.com/muaz-khan/RecordRTC,
I want access to allow the camera always 'allow',
i've tried bypass the allow permission in popup allow webcam use start chrome --use--fake-ui--for--media-stream and it's work for me, but when i closed my chrome and then i opened chrome again , the popup permission allow webcam still showing,
what's the solution?
If you serve your application from an https domain, Chrome will remember the user's answer to the permissions dialog after the first use, so if they use it once, permission is granted (they click "allow"), the next time they use it, permission will be granted automatically and they won't be shown the pop up again.

Categories

Resources