Реагировать на загрузку файлов - PullRequest
0 голосов
/ 25 апреля 2018

У меня есть простое приложение реакции.Я добавил react-fine-uploader к нему.У меня есть сервер Flask, который принимает файлы и помещает их в базу данных MongoDB.Код для сервера выглядит следующим образом:

from flask import Flask, render_template, request
from pymongo import MongoClient
import os
import time
from json import dumps, loads

app = Flask(__name__)


global index
map_dir = 'maps'

client = MongoClient(
    '<connection_string>')

db = client.business


@app.route('/maps', methods=['GET'])
def process():
    cursor = db.maps.find({}, {'_id': False})
    maps = {'maps': []}
    for doc in cursor:
        try:
            maps['maps'].append(doc['filename'])
        except Exception:
            pass
    return dumps(maps)


@app.route('/map/<map_name>', methods=['GET'])
def get_map(map_name):
    doc = db.maps.find_one({'filename': map_name}, {'_id': False})
    return dumps(doc)


@app.route('/uploader', methods=['GET', 'POST'])
def upload_file():
    if request.method == 'POST':
        f = request.files['file']
        parsed = loads(f.read())
        filename = ''.join(f.filename.split('.')[:-1]) + str(index) + '.json'
        parsed['filename'] = filename
        try:
            result = db.maps.insert_one(parsed)
            return 'File uploaded successfully'
        except Exception:
            return 'Error while uploading a file'


if __name__ == '__main__':
    global index
    index = len(os.listdir('maps')) + 1
    app.run(debug=True)

Он работает со стандартной формой HTML input с указанием цели как localhost:5000/uploader.Теперь я хочу, чтобы моя форма fine-uploader сделала то же самое.В коде это выглядит так:

const uploader1 = new FineUploader({
    options: {
        request: {
            endpoint: "localhost:5000/uploader"
        },
        resume: {
            enabled: true
        },
        retry: {
            enableAuto: true,
            showButton: true
        }
    }
});

И где-то в методе render() я получил: <Gallery uploader={uploader1} />

Теперь я могу выбрать файл, но когда он выбран, форма пытаетсязагрузить его, и это не удается.Сервер работает, и я не вижу запроса на него в терминале.Я что-то не так делаю?

@ Edit Я включил режим отладки, и он выдает что-то вроде этого в консоль разработчика:

Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https

...