如何編寫用於在Flask服務器上進行ajax調用的Dart HttpRequest？

Question

我想了解如何從Dart製作ajax調用。我對網絡編程的理解非常有限。

我在客戶端簡單的服務器ajax.py:-

#!/usr/bin/env python 

from datetime import timedelta 
from flask import Flask, make_response, request, current_app, jsonify 
from functools import update_wrapper 
app = Flask(__name__) 

#Decorator for CORS request 
def crossdomain(origin=None, methods=None, headers=None, max_age=21600, attach_to_all=True, automatic_options=True): 
    if methods is not None: 
     methods = ', '.join(sorted(x.upper() for x in methods)) 
    if headers is not None and not isinstance(headers, basestring): 
     headers = ', '.join(x.upper() for x in headers) 
    if not isinstance(origin, basestring): 
     origin = ', '.join(origin) 
    if isinstance(max_age, timedelta): 
     max_age = max_age.total_seconds() 

    def get_methods(): 
     if methods is not None: 
      return methods 

     options_resp = current_app.make_default_options_response() 
     return options_resp.headers['allow'] 

    def decorator(f): 
     def wrapped_function(*args, **kwargs): 
      if automatic_options and request.method == 'OPTIONS': 
       resp = current_app.make_default_options_response() 
      else: 
       resp = make_response(f(*args, **kwargs)) 
      if not attach_to_all and request.method != 'OPTIONS': 
       return resp 

      h = resp.headers 

      h['Access-Control-Allow-Origin'] = origin 
      h['Access-Control-Allow-Methods'] = get_methods() 
      h['Access-Control-Max-Age'] = str(max_age) 
      if headers is not None: 
       h['Access-Control-Allow-Headers'] = headers 
      return resp 

     f.provide_automatic_options = False 
     return update_wrapper(wrapped_function, f) 
    return decorator 

@app.route('/index') 
@crossdomain(origin='*') 
def index(): 
# print request.json() 
    return "Hello World" 

@app.route('/sum') 
@crossdomain(origin='*') 
def add_numbers(): 
    a = request.args.get('a', 0, type=int) 
    b = request.args.get('b', 0, type=int) 
    return jsonify(result = a + b) 

if __name__ == '__main__': 
    app.run() 

飛鏢代碼： -

import 'dart:html'; 
//import 'package:http/http.dart' as http; 

void main() { 
    String url = 'http://localhost:5000/index'; 
    HttpRequest.getString(url).then((val) => print("received::$val")); 
    HttpRequest.request(url).then((val) => print("received33::${val.response}")); 
    String url2 = 'http://localhost:5000/sum'; 
    HttpRequest.request(url2, sendData:"{'a':1, 'b':2}", responseType:'json').then((val) => print("received33::${val.response}")); 
} 

這裏是我的輸出： -

received::Hello World 
received33::{result: 0} 
received33::Hello World 

1. 怎麼辦我寫Dart Httprequest來調用add_numbers（sum），a = 1和b = 2？

Answer 1

我還不確定是否應該這樣做。然而這是使通信成爲可能的代碼更新。如果有人能對更習慣的方式發表評論，我將不勝感激。

的Ajax服務器（燒瓶）： -

#!/usr/bin/env python 

from datetime import timedelta 
from flask import Flask, make_response, request, current_app, jsonify 
from functools import update_wrapper 
app = Flask(__name__) 

def crossdomain(origin=None, methods=None, headers=None, max_age=21600, attach_to_all=True, automatic_options=True): 
    if methods is not None: 
     methods = ', '.join(sorted(x.upper() for x in methods)) 
    if headers is not None and not isinstance(headers, basestring): 
     headers = ', '.join(x.upper() for x in headers) 
    if not isinstance(origin, basestring): 
     origin = ', '.join(origin) 
    if isinstance(max_age, timedelta): 
     max_age = max_age.total_seconds() 

    def get_methods(): 
     if methods is not None: 
      return methods 

     options_resp = current_app.make_default_options_response() 
     return options_resp.headers['allow'] 

    def decorator(f): 
     def wrapped_function(*args, **kwargs): 
      if automatic_options and request.method == 'OPTIONS': 
       resp = current_app.make_default_options_response() 
      else: 
       resp = make_response(f(*args, **kwargs)) 
      if not attach_to_all and request.method != 'OPTIONS': 
       return resp 

      h = resp.headers 

      h['Access-Control-Allow-Origin'] = origin 
      h['Access-Control-Allow-Methods'] = get_methods() 
      h['Access-Control-Max-Age'] = str(max_age) 
      if headers is not None: 
       h['Access-Control-Allow-Headers'] = headers 
      #print h 
      return resp 

     f.provide_automatic_options = False 
     return update_wrapper(wrapped_function, f) 
    return decorator 

@app.route('/index') 
@crossdomain(origin='*') 
def index(): 
# print request.json() 
    return "Hello World" 

@app.route('/sum', methods = ['GET', 'POST']) 
@crossdomain(origin='*', methods=['POST','GET']) 
def add_numbers(): 
#  print request.headers 
#  print request.get_data() 
#  print request.get_json() 
#  print request.environ 
#  print request.get_json(True) 
#  print request.args 
#  a = request.args.get('a', 0, type=int) 
#  b = request.args.get('b', 0, type=int) 
    data = request.get_json(True) 
    a = data['a'] 
    b = data['b'] 
    return jsonify(result = a + b) 

if __name__ == '__main__': 
    app.run() 

飛鏢的HttpRequest（flask.dart）： - 使用http包鏢（Flask_io.dart）

import 'dart:html'; 
//import 'package:http/http.dart' as http; 
//import 'package:http/browser_client.dart'; 
import 'dart:convert' show JSON; 

void main() { 
    String url = 'http://localhost:5000/index'; 
    HttpRequest.getString(url).then((val) => print("received::$val")); 
    HttpRequest.request(url).then((val) => print("received33::${val.response}")); 
    String url2 = 'http://localhost:5000/sum'; 
    var data = JSON.encode({'a':6, 'b':2}); 
    HttpRequest.request(url2, method:'POST', mimeType:'application/json', sendData: data, responseType:'json').then((val) => print("received33::${val.response['result']}")).catchError((e)=> e.toString()); 

// var client = new BrowserClient(); 
// client.get(url).then((response) => print(" My server says: ${response.body}")); 
// client.get(url2).then((response) => print(" My server says: ${response.body}")); 
// client.close(); 
} 

HTTP請求： -

import 'package:http/http.dart' as http; 
import 'dart:convert' show JSON; 


void main(){ 
    String url = 'http://localhost:5000/index'; 
    String url2 = 'http://localhost:5000/sum'; 
    var client = new http.Client(); 
    client.get(url).then((response) => print(" My server says: ${response.body}")); 

    var data = JSON.encode({'a':2,'b':3}); 
    client.post(url2, body:data).then((response) => print(" My server says: ${JSON.decode(response.body)['result']}")); 
// client.close(); 
}