0
私は以下の設定をしています。私は単純なindex.htmlをApache経由で提供しています。それは次のように見えます。DjangoとApacheで動作するchart.jsを取得する
<!DOCTYPE html>
<html lang='en'> <meta http-equiv="content-type" content="text/html; charset=UTF8"> <head> <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.4/Chart.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> </head> <body> <canvas id="myChart"></canvas> <script language="JavaScript" src="/customcharts.js"> </script> </body> </html>
上記のことは、ブラウザに折れ線グラフを配置してみることです。それはchart.jsを使用します。これを達成するために、customcharts.jsは、ローカルに実行するdjangoサーバーに接続しようとします。 Djangoはポートで8090
を実行しながら、上記のhtmlはさらに
function renderChart(data){
console.log(data)
console.log(data.labels)
defaultLabels = data.labels
defaultData = data.defaultData
var ctx = document.getElementById("myChart").getContext('2d');
var myChart = new Chart(ctx, {
type: 'line',
data: {
labels: defaultLabels,
datasets: [{
lineTension: 0,
label: 'Activity Profile',
data: defaultData,
}]
}
})
}
var endpoint = 'http://localhost:8090/polls/alice/'
var defaultData = []
var defaultLabels = []
$.ajax({
url: endpoint,
dataType: "JSONP",
success: renderChart,
method: 'GET'
}
);
を次のようにcustomcharts.jsが見え、私のdjangoビューは
def json_response(func):
"""
A decorator thats takes a view response and turns it
into json. If a callback is added through GET or POST
the response is JSONP.
"""
def decorator(request, *args, **kwargs):
objects = func(request, *args, **kwargs)
if isinstance(objects, HttpResponse):
return objects
try:
data = simplejson.dumps(objects)
if 'callback' in request.REQUEST:
# a jsonp response!
data = '%s(%s);' % (request.REQUEST['callback'], data)
return HttpResponse(data, "text/javascript")
except:
data = simplejson.dumps(str(objects))
return HttpResponse(data, "application/json")
return decorator
epoch = datetime.datetime.utcfromtimestamp(0)
r = redis.StrictRedis(host='localhost', port=6379, db=0)
threat_list = ['date', 'categories', 'mix']
@json_response
def index(request, uid):
print uid
uid = uid.rstrip('/')
_key = uid
retjsondict = {}
input_keys = [_key + ':' + x for x in threat_list]
k = input_keys[0]
retdict = {}
if r.exists(k):
retvalue = r.get(k).strip('"')
xdata_dt = [x.split(':')[0] for x in retvalue.split(' ')]
ydata_dt = [x.split(':')[1].rstrip(',') for x in retvalue.split(' ')]
retdict['defaultLabels'] = xdata_dt
retdict['defaultData'] = ydata_dt
print retdict
return JsonResponse(retdict)
indexでポート8080でのApacheの実行によって提供されています実際の見解であり、json_responseはデコレータです。しかし
、私は試してみて、私はXMLHttpRequestのはhttp://localhost:8090/polls/alice/をロードすることはできません
次のエラーを取得する
http://localhostを使用してブラウザ上に表示します。いいえ 要求された リソースに 'Access-Control-Allow-Origin'ヘッダーが存在します。 Origin 'http://localhost'はアクセスできません。
誰かが私に何をしているのか指摘できますか？ ヘルプ/ポインターありがとうございます。
は静的リソースで、「customcharts.js」ですか？ –
はい静的リソース – broccoli