Javascript доступ к локальным JSON файлам в приложении flask - PullRequest
Новая
       5

Javascript доступ к локальным JSON файлам в приложении flask

0 голосов
/ 03 марта 2020

Я запускаю приложение flask локально, и моя цель - передать словарь от python до Javascript. В настоящее время я могу сохранить словарь в виде файла json в локальной папке, однако мой запрос ajax не может получить доступ к локальному json. Почему это не работает, и есть ли модуль flask, который позволяет мне передавать python словари в javascript локально? 

# app.py
dictionary_a = {
    "a": {
        "b": {
            "function_handler": c,
            "defaults": {'d':e, 'f':g},
        },
        "h": {
            "function_handler": i,
            "defaults": {'d':l},
        },
    },
}

def dumper(obj):
    try:
        return obj.toJSON()
    except:
        return obj.__dict__


@app.route('/')
def index():
    jsonn = json.dumps(dictionary_a, default=dumper, indent=2)
    with open('data.json', 'w') as json_file:
        json.dump(jsonn, json_file)
    return render_template('home.html')

Это мой код python, 

# code.js
$.getJSON("../../data.json", function(json) {
    console.log(json); // this will show the info it in firebug console
});

Это код в javascript

Структура папки: 

>project
  -app.py
  >static
    >js
      -code.js
  -data.json

сообщение об ошибке: GET http://localhost: 5000 / data. json 404 (НЕ НАЙДЕНО)

Ответы [ 2 ]

0 голосов
/ 03 марта 2020

Вы пытаетесь преобразовать свой словарь python в файл HTML? вам следует рассмотреть возможность использования Jinja.

Если вы добавите словарь в свой ответ, он будет получен как JSON вашей страницей html, с flask 1.1 . 

# app.py
dictionary_a = {
    "a": {
        "b": {
            "function_handler": c,
            "defaults": {'d':e, 'f':g},
        },
        "h": {
            "function_handler": i,
            "defaults": {'d':l},
        },
    },
}


@app.route('/')
def index():
    jsonn = dictionary_a
    return render_template('home.html', jsonn=jsonn)

, тогда вы можете справиться с этим на странице html, используя Jinja .

Вы можете l oop через его элементы, добавить операторы if и т. Д. c ...

вашего дома. html должно выглядеть примерно так: 

<html>
...
    <body>
    ...
    {{jsonn}}
    ...
    </body>
...
</html>

Вы также можете передать его непосредственно в свой код javascript и обрабатывать его как json, если необходимо 

<script>
const jsonn = `{{jsonn | safe}}`
</script>
0 голосов
/ 03 марта 2020

Решено: 

# code.js
var script = document.currentScript;
var fullUrl = script.src;

Эти строки позволяют получить путь к коду. js

var jsonUrl = fullUrl.replace("code.js", "data.json") // hard coded jsonUrl

$.getJSON(jsonUrl, function(from_to_conversions) {
    console.log(from_to_conversions)
});

У меня есть файл json, выгруженный в static / js папка для этой работы

...