I am trying to access my USB device through web pages (over HTTPS).
My USB device is up and running and has also enabled Experimental Web Platform features chrome://flags/#enable-experimental-web-platform-features. Even though I have provided the correct vendorId and productId in the code, chrome shows the message "No compatible devices found".
Where am I going wrong?
Below is my code
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<button id="request-device">Request Device</button>
<script>
document.getElementById("request-device").addEventListener("click", ()=>{
navigator.usb.requestDevice({filters: [{vendorId: 0x03F0}, {productId: 0x5A07}]})
.then((usbDevice)=>{
console.log("product name: "+usbDevice.productName);
})
.catch((e)=>{
console.log("There is no devie...."+e);
});
});
</script>
</body>
</html>
There are a few reasons why the device may not appear:
The first is that Chrome is not detecting that the device has been connected. Chrome logs each USB device it discovers in chrome://device-log. Check there that your device has been detected. It will also provide detailed device information in the "Devices" tab of chrome://usb-internals.
The other reason is that Chrome may be hiding the device because it does not implement any interfaces which a website is allowed to claim using the WebUSB API. For example, if the device is a USB mass storage device that interface is not claimable and if there are no other interfaces the device will be hidden. Due to a bug in Chrome 90, if the device has no interfaces it will not appear either. This will be fixed in Chrome 91 and you can verify that fix in the latest beta-channel update.
Related
I have a Trusted Web Activity app that is displaying a Progressive Web Application by using the Android Browser Helper. The documentation and code indicates that the mobile app only runs properly when the Chrome Browser is 72 or above. The address bar is visible when the Chrome Browser is outdated. I believe I have the option of a Webview-fallback but I prefer not to use Webview as some of the app's functionality is incompatible with Webview.
While testing, when the Chrome Browser is updated on the same device, the trusted web activity runs without any issues.
What options do I have where the address bar isn't visible?
Is the min SDK the only way to set the minimum browser requirements or can I explicitly set a min Chrome Browser version in the Play Console for the app before the user downloads it? (which prompts the user to update the browser before installation)
Thanks in advance!
It's not possible to set a browser version requirement on the Play Console.
Besides falling back to a WebView, or showing the application with the URL bar, the other solution would to block the application from loading and ask the user to update / install a browser that supports Trusted Web Activity.
I am trying to complement existing offline appCache-based setup with a service worker for Chrome/Chromium(other browsers, namely Safari are still expected to use appCache).
Simplified [pseudo]code looks as follows:
<html manifest="offline.manifest">
...
<script type="text/javascript">
if (!window.applicationCache && navigator.serviceWorker && (/chrome/gi).test(navigator.appVersion)) {
navigator.serviceWorker.register('/service-worker.js');
}
</script>
...
</html>
My questions are:
is there a way to figure out whether Chrome 82 will tolerate <html manifest=offline.manifest> attribute? (by the time of writing this question, people installing Chrome 82 Canary report appCache is still available)
did anyone have a chance to use sw-appcache-behavior scripts in production?
Thanks.
UPD 08/05/20: AppCache removal has been moved to M85
A few hints are available in the HTML spec update.
It looks like manifest attribute will still be honored but no actual caching is going to happen.
There seem to be a way for testing disabled appCache using [reverse] Origin Trial.
Details are available in blink-api-owners Google Group.
Despite sw-appcache-behavior being suggested by Chromium maintainers, its readme section indicates that it is not intended to be used in Prod yet.
I'm trying to load the native messaging example app in an external webpage as follows:
test.html
<html>
<head>
</head>
<body>
<iframe src="chrome-extension://knldjmfmopnpolahpmmgbagdohdnhkik/main.html"</iframe>
</body>
</html>
I have added the web_accessible_resources property in the app's manifest:
manifest.json
{
// <some code snipped>
"web_accessible_resources": ["main.html"]
}
However, when I use the app within test.html, I get the following error in the console, coming from a JavaScript file within the app:
Developer Console
Uncaught TypeError: Object # has no method 'connectNative'
main.js:51
The problematic line of code is the following:
main.js
port = chrome.runtime.connectNative(hostName);
Here's a screenshot - the problem happens when I click on the Connect button (which calls the connect function):
Obviously, this works when the app is run standalone. How can I go about loading the app in a webpage?
You can't. With very few exceptions, Chrome avoids proprietary extensions to the open web. You're asking for exactly that: an external web page that has nonstandard abilities simply because it's opened in Chrome rather than another browser. As the web is today, that kind of behavior would lead to a poor developer and user experience. The native-messaging documentation suggests that the functionality you want is available to Chrome extensions and Chrome apps. And as you're finding out, that's indeed the case: it works as an app, but not as a web-standard iframe. This is by design.
You probably want to write a Chrome extension. Your webpage should detect whether the Chrome extension is installed and whether the user's browser is Chrome. If it's not Chrome, it should give an appropriate error message. If it is Chrome but the extension is not installed, it should urge the user to install your extension.
The goal is to start casting a content (video or other), from chrome mobile. Just like it is possible on standard Chrome for youtube or netflix videos, through the dedicated extension. I'm not talking about displaying the content of the mobile tab on the TV but just launching a cloud or LAN video on the big screen.
I know extensions are not available on chrome mobile (yet) but I was just wondering if there were any plans on making that possible in Chrome Mobile (with or without extensions).
It would be cool to be able to write a webapp that could launch videos on the big screen. The same webapp could be used on a smartphone, on a tablet or a on desktop computer.
Update:
I was thinking it could be easy to write a simple standalone js library for Google Cast device discovery. This could also be used to control the playback of cloud/LAN files within a webapp.
By looking at the chrome extension code, it looks like the discovery of Google Cast devices is done through the chrome.dial.* API. This API is not public yet. The extension asks for the following permissions:
"permissions": [
"tabs",
"tabCapture",
"dial",
"storage",
"networkingPrivate",
"https://*/*",
"http://*/*"
],
At this point, there is probably no hope of writing a standalone js library that would do the device discovery through chrome.dial.* as its access is restricted to extensions having asked for the specific permission.
Conclusion: To leverage the chrome.dial.* API, an extension is needed. And there are no public plans for extensions in Chrome Mobile.
Interesting links:
http://www.dial-multiscreen.org/dial-protocol-specification
http://en.wikipedia.org/wiki/Simple_Service_Discovery_Protocol
It is a little unclear what you're asking, but it seems like you're asking if there is any hope of getting a native extension on the mobile version of Chrome.
From https://developers.google.com/chrome/mobile/docs/faq
Does Chrome for Android support apps and extensions?Chrome apps and extensions are currently not supported on Chrome for Android. We have no plans to announce at this time.
I wouldn't plan on having extensions anytime soon. You could always write a native application to the operating system and broadcast from there.
i have done an ap using html and javascript for blackberry 10 os.when i submitted in appworld,i got the following error
Please fix the following issue(s) and resubmit your application as a new release.
I am testing your app on the BlackBerry Dev Alpha Device (OS version 10.0.9.1103). After launching the app, it doesn't appear properly on the device as it launch on portrait mode and it appears to small on the screen (30% on the top screen). Please fix the scaling issue.
here is the recommended way of setting the initial scaling for now, include this in your of index.html
<!-- new way of setting the meta tag -->
<script>
var meta = document.createElement("meta");
meta.setAttribute('name','viewport');
meta.setAttribute('content','initial-scale='+ (1/window.devicePixelRatio) + ',user-scalable=no');
document.getElementsByTagName('head')[0].appendChild(meta);
</script>