WebBLE 1.1 (iOS app) with bookmark support available!

Posted on
Page
of 2
/ 2
Next
  • Apple have accepted an enhancement I made over the weekend to add bookmarks support to WebBLE, so it's now easy to save your favourite Web Bluetooth pages and return to them later.

    The update should get pushed out to everyone soon.

    See the WebBLE announcement conversation for more info on WebBLE on iOS.

    Also fixed in this version:

  • Just to add, the app itself can be downloaded with this link: https://itunes.apple.com/us/app/webble/i­d1193531073

  • Just tested, and this now works with the Web IDE! A little fine-tuning needed (to be honest the IDE's always been a bit fiddly with phones/tablets) but it's basically there

  • What is the URL for the online version of the web ide?

    Perhaps this could be added as one of the bookmarks?

  • https://www.espruino.com/ide

    And yes, hopefully it will be soon :)

  • Really excited about this!

    The only BLE device I have around me is a Sphero BB-8, and the test page I use doesn't show any Bluetooth devices when I try to connect. Not sure where things are breaking down.

    I'll try another BLE device later (a BBQ thermometer) and see if I have any luck.

    One thing that might help diagnose what's going on: is there a way to enable Safari Remote Debugging inside the browser, so I could see if there's a Web Bluetooth error being thrown somewhere?

  • At the moment there isn't anything as far as I know - but if you can modify the webpages yourself it's easy enough to add a textbox and then overwrite console.log - which might give you some clues what's going on I guess.

    Also, you could change requestDevice on the BB8 page so it wasn't as strict about the types of devices it displayed in the menu.

    Hopefully the BBQ thermometer will work though? I'd be interested to see what happens.

    It's a bit hard for @daphtdazz to try with different hardware though - even ignoring the time it takes, it gets quite expensive buying lots of random BLE stuff to test on :)

  • @user73018: as Gordon says there is no way to enable Safari Remote Debugging in the browser unfortunately. A console window is next on my todo list for the app, but can't say when I might get around to it... sooner if more people ask for it!

  • @Gordon @daphtdazz No such luck on the BBQ thermometer. Even after setting acceptAllDevices: true in navigator.bluetooth.requestDevice no devices show up.

    I overrode console.log, but nothing super strange going on there, either.

    Here's what I'm seeing: https://www.youtube.com/watch?v=Nz8O4WYw­h04

    And the code in particular: https://gist.github.com/mattdsteele/0fa9­cafc4a95738181137547eae21fc8#file-app-js­

    Anyhow this is mostly FYI. Not expecting you to debug my code, or buy more BLE devices :)

  • What Apple device are you using? Is it possible that it doesn't have BLE support or Bluetooth is turned off?

    I've had a lot of success with WebBLE. I didn't manage to get it to fly my Parrot minidrone, but even then it managed to show it in the device selector window.

  • iPhone SE, which is Bluetooth 4.2 I believe. BLE works in other apps, so I'm hesitant that it's a hardware issue.

  • I tried the WebBle app to connect to acceptAllDevices using the puck.js as a starting point. The script seems to work on everything but the webBle iOS app. Any ideas? cheers! -thomas

    https://github.com/hydronics2/ble_testin­g

  • I could be wrong, but it looks like you're defining and using options1, but you're actually setting acceptAllDevices on options (which isn't defined?). That won't be helping.

    Having said that, I don't know if WebBLE actually supports acceptAllDevices - @daphtdazz? It's probably quite a rare thing to want to do (apart from for debugging).

  • ( @hydronics your published code had a small bug, where you used options instead of options1, but that's just FYI.)

    WebBLE says it supports it so I guess it should :-) However, it doesn't seem to work at the moment, and looking at the code it looks like I didn't implement it. Given I said it is supported I think I should make it so! I'll try and get an update submitted to Apple today or tomorrow.

    Edit: also this might help @user73018

  • thanks for all the responses.

    @gordon, yes, you're right just for prototyping..

    Are you saying if I filter for a certain Ble device it should work? Which type of filter should I use?

    Here are some filter options from google's bluetooth examples....

      let filterService = document.querySelector('#service').value­;
      if (filterService.startsWith('0x')) {
        filterService = parseInt(filterService);
      }
      if (filterService) {
        filters.push({services: [filterService]});
      }
    
      let filterName = document.querySelector('#name').value;
      if (filterName) {
        filters.push({name: filterName});
      }
    
      let filterNamePrefix = document.querySelector('#namePrefix').va­lue;
      if (filterNamePrefix) {
        filters.push({namePrefix: filterNamePrefix});
      }
    
      let options = {};
      if (document.querySelector('#allDevices').c­hecked) {
        options.acceptAllDevices = true;
      } else {
        options.filters = filters;
      }
    
      log('Requesting Bluetooth Device...');
      log('with ' + JSON.stringify(options));
      navigator.bluetooth.requestDevice(option­s)
      .then(device => {
        log('> Name:             ' + device.name);
        log('> Id:               ' + device.id);
        log('> Connected:        ' + device.gatt.connected);
      })
      .catch(error => {
        log('Argh! ' + error);
      });
    
  • I tried filtering with a name. It works on mac Safari but not WebBle...

        let filters = [];
        let options1 = {};
        // if (1) {
        //   options1.acceptAllDevices = true;
        // }
        if (1) {
          filters.push({name: 'Bluefruit HRM'});
        }
    
        options1.filters = filters;
    
        console.log('Requesting Bluetooth Device...');
        console.log('with ' + JSON.stringify(options1));
    
        navigator.bluetooth.requestDevice(option­s1)
        .then(device => {
          console.log('> Name:             ' + device.name);
          console.log('> Id:               ' + device.id);
          console.log('> Connected:        ' + device.gatt.connected);
        })
        .catch(error => {
          console.log('Argh! ' + error);
    
  • In the current version (1.1.1) the only filters that should be supported are "services" and "namePrefix". I'll add "name" to 1.1.2, which I'm preparing now.

  • thanks! I'll try services.

    I meant mac Chrome... not mac Safari.

  • hmmmm... I guess I need to develop my ble device attributes a little better... they come up as 'undefined' when I call them in chrome browser

        navigator.bluetooth.requestDevice(option­s1)
        .then(device => {
          console.log('> Services:         ' + device.services);
          console.log('> namePrefix:         ' + device.namePrefix);
          console.log('> Name:             ' + device.name);
          //console.log('> Id:               ' + device.id);
          //console.log('> Connected:        ' + device.gatt.connected);
        })
    
  • I'm not sure requestDevice should return namePrefix (or services?) - it'd be worth taking a look at what's done in the puck.js library: https://github.com/espruino/espruino.git­hub.io/blob/master/js/puck.js#L162

    I think even the following would work fine:

    navigator.bluetooth.requestDevice({
            filters:[
              { namePrefix: 'Puck.js' },
            ]}).then(function(device) {
           return device.gatt.connect();
        }).then(function(server) {
    
  • @Gordon... thanks I think that works... off to the races...

  • WebBLE 1.1.2 has now been accepted by Apple, so if you upgrade you should be able to use acceptAllDevices too.

  • what's the best way to debug with web ble? ... see the console.. I was using jsconsole.com but it's been down for the last couple of days.

  • Coincidentally I just updated the faqs with this very thing!

    Could you post here if it works? I'd like to know if my guide was clear enough / works on someone else's device.

  • My desktop can see safari running on my ipad and I can see the remote console of the current safari tab but their is no option to select web ble from the develop menu on the desktop.

  • Post a reply
    • Bold
    • Italics
    • Link
    • Image
    • List
    • Quote
    • code
    • Preview
About

WebBLE 1.1 (iOS app) with bookmark support available!

Posted by Avatar for daphtdazz @daphtdazz

Actions