Search code examples
javascriptpythoneel

Sending data from Python to Javascript using EEL


I am trying to send data from python to Javascript using EEL and their documentation and it does not seem to work... I keep getting null in my html / js page.

Here is what I have. Basically I want to get the link of the BING wallpaper and use it in my page as a background. But until then, I want to first get the result.

BING py script:

import bs4
import requests
import json


def scrape_bing():
   BASE_PATH = 'http://www.bing.com'
   BASE_REST = '/HPImageArchive.aspx?format=js&idx=0&n=1&mkt=en-US'
   URL = BASE_PATH + BASE_REST

   r = requests.get(url=URL)

   if r.status_code == 200:
      data = r.json()
      wallpaper_path = BASE_PATH + data['images'][0]['url']
      print(wallpaper_path)
   else:
      raise ValueError("[ERROR] non-200 response from Bing server for '{}'".format(URL))

   def main():
      scrape_bing()

   if __name__ == '__main__':
      main()

The script works and it returns my URL in the Python console.

My main.py which has EEL is as following:

import eel
from inc.bing import scrape_bing

eel.init('web')

myDef = scrape_bing()

@eel.expose
def bingR():
   return myDef

try:
   eel.start('index.html', mode='chrome', host='localhost', port=8274)

except (SystemExit, MemoryError, KeyboardInterrupt):
   pass

print ('Closed browser log...!')

I have used an async command just as in their examples, like so:

    <script type="text/javascript" src="/eel.js"></script>
    <script type="text/javascript">

    async function run() {
        let n = await eel.bingR()();
        console.log('Got this from Python: ' + n);
    }

    run();

    </script>

Please help me understand how all this works.


Solution

  • Not sure if you accidentally formatted your code wrong, but it's a little off. Also you imported bs4 and json when you don't need to.

    Your scrape_bing() function was not returning anything. It needs to return a value to "myDef" when assigning it in "myDef = scrape_bing()".

    I changed yours up a bit and came up with this example that will hopefully get you started. Hope this helps.


    main.py

    import eel
    import requests
    
    eel.init('web')
    
    @eel.expose
    def bingR():
        BASE_PATH = 'http://www.bing.com'
        BASE_REST = '/HPImageArchive.aspx?format=js&idx=0&n=1&mkt=en-US'
        URL = BASE_PATH + BASE_REST
        r = requests.get(url=URL)
        if r.status_code == 200:
            data = r.json()
            wallpaper_path = BASE_PATH + data['images'][0]['url']
            print(wallpaper_path)
            return wallpaper_path
        return 'No wallpaper found'
    
    try:
        eel.start('index.html', mode='chrome', host='localhost', port=8274)
    except (SystemExit, MemoryError, KeyboardInterrupt):
        pass
    
    print ('Closed browser log...!')
    

    web\myscript.js

    async function run() {
        let n = await eel.bingR()();
        console.log('Got this from Python: ' + n);
        document.getElementById('output').value = n;
    }
    run();
    

    web\index.html

    <!doctype html>
    <html lang="en">
    <head>
      <meta charset="utf-8">
      <title>Test</title>
    </head>
    <body>
      <script type="text/javascript" src="/eel.js"></script>
      <script type="text/javascript" src="/myscript.js"></script>
      <input id="output" value="Output here" style="width: 700px;">
    </body>
    </html>
    

    Also thanks for introducing me to eel. First time using it and really like it :)