我正在尝试使用Challonge API
创建一个简单的应用程序我想要实现的目标是在我的个人页面上显示我在Challonge上创建的所有比赛。
我已经使用了请求,并且我能够以JSON格式从我的帐户中获取锦标赛数据,但我不知道如何在index.html中显示它。
var express = require('express');
var request = require('request');
var path = require("path");
var app = express();
app.get('/', function(req, res, next) {
request({
uri: 'https://api.challonge.com/v1/tournaments.json',
qs: {
api_key: '<key_here>'
}
}).pipe(res);
});
app.listen(3000, function(){
console.log('Server listening on port 3000');
});
这是检索到的JSON数据:
[
{
"tournament": {
"id": 3117104,
"name": "Test",
"url": "39ikguh0",
"description": "Testing",
"tournament_type": "single elimination",
"started_at": null,
"completed_at": null,
"require_score_agreement": false,
"notify_users_when_matches_open": true,
"created_at": "2017-01-10T01:26:36.602+03:00",
"updated_at": "2017-01-10T01:26:36.602+03:00",
"state": "pending",
"open_signup": false,
"notify_users_when_the_tournament_ends": true,
"progress_meter": 0,
"quick_advance": false,
"hold_third_place_match": false,
"pts_for_game_win": "0.0",
"pts_for_game_tie": "0.0",
"pts_for_match_win": "1.0",
"pts_for_match_tie": "0.5",
"pts_for_bye": "1.0",
"swiss_rounds": 0,
"private": false,
"ranked_by": "match wins",
"show_rounds": true,
"hide_forum": false,
"sequential_pairings": false,
"accept_attachments": false,
"rr_pts_for_game_win": "0.0",
"rr_pts_for_game_tie": "0.0",
"rr_pts_for_match_win": "1.0",
"rr_pts_for_match_tie": "0.5",
"created_by_api": false,
"credit_capped": false,
"category": null,
"hide_seeds": false,
"prediction_method": 0,
"predictions_opened_at": null,
"anonymous_voting": false,
"max_predictions_per_user": 1,
"signup_cap": null,
"game_id": 194,
"participants_count": 0,
"group_stages_enabled": false,
"allow_participant_match_reporting": true,
"teams": false,
"check_in_duration": 360,
"start_at": "2017-01-12T01:26:00.000+03:00",
"started_checking_in_at": null,
"tie_breaks": [
"match wins vs tied",
"game wins",
"points scored"
],
"locked_at": null,
"event_id": null,
"public_predictions_before_start_time": false,
"ranked": false,
"grand_finals_modifier": null,
"predict_the_losers_bracket": false,
"description_source": "Testing",
"subdomain": null,
"full_challonge_url": "http://challonge.com/39ikguh0",
"live_image_url": "http://challonge.com/39ikguh0.svg",
"sign_up_url": null,
"review_before_finalizing": true,
"accepting_predictions": false,
"participants_locked": false,
"game_name": "Counter-Strike: Global Offensive",
"participants_swappable": true,
"team_convertable": false,
"group_stages_were_started": false
}
},
{
"tournament": {
"id": 3117146,
"name": "name-alexnodeapitest",
"url": "alexnodeapitest",
"description": "",
"tournament_type": "single elimination",
"started_at": null,
"completed_at": null,
"require_score_agreement": false,
"notify_users_when_matches_open": true,
"created_at": "2017-01-10T01:49:51.205+03:00",
"updated_at": "2017-01-10T01:49:51.205+03:00",
"state": "pending",
"open_signup": false,
"notify_users_when_the_tournament_ends": true,
"progress_meter": 0,
"quick_advance": false,
"hold_third_place_match": false,
"pts_for_game_win": "0.0",
"pts_for_game_tie": "0.0",
"pts_for_match_win": "1.0",
"pts_for_match_tie": "0.5",
"pts_for_bye": "1.0",
"swiss_rounds": 0,
"private": false,
"ranked_by": null,
"show_rounds": false,
"hide_forum": false,
"sequential_pairings": false,
"accept_attachments": false,
"rr_pts_for_game_win": "0.0",
"rr_pts_for_game_tie": "0.0",
"rr_pts_for_match_win": "1.0",
"rr_pts_for_match_tie": "0.5",
"created_by_api": true,
"credit_capped": false,
"category": null,
"hide_seeds": false,
"prediction_method": 0,
"predictions_opened_at": null,
"anonymous_voting": false,
"max_predictions_per_user": 1,
"signup_cap": 8,
"game_id": null,
"participants_count": 0,
"group_stages_enabled": false,
"allow_participant_match_reporting": true,
"teams": null,
"check_in_duration": null,
"start_at": null,
"started_checking_in_at": null,
"tie_breaks": null,
"locked_at": null,
"event_id": null,
"public_predictions_before_start_time": null,
"ranked": false,
"grand_finals_modifier": null,
"predict_the_losers_bracket": null,
"description_source": "",
"subdomain": null,
"full_challonge_url": "http://challonge.com/alexnodeapitest",
"live_image_url": "http://challonge.com/alexnodeapitest.svg",
"sign_up_url": null,
"review_before_finalizing": true,
"accepting_predictions": false,
"participants_locked": false,
"game_name": null,
"participants_swappable": true,
"team_convertable": false,
"group_stages_were_started": false
}
}
]
如何在Node.JS index.html页面中显示我在Challonge上创建的所有锦标赛?
我的index.pug模板:
doctype html
html(lang='en')
head
title Tournaments
body
h1 #{tournaments}
谢谢,祝你有愉快的一天!
答案 0 :(得分:0)
你的物体形状不是很好。以下是应该看起来像null
而不是像你的情况那样做另一个嵌套。使用这种形状的对象,您可以使用:[{tournament1}, {tournament2}
轻松迭代集合(使用的是数组)。然后你可以使用像pug这样的模板引擎(被称为jade)并将它传递给锦标赛对象,然后在我的情况下在名为index的视图中循环。阅读有关如何在express中设置模板引擎的文档。
tournaments.forEach(function(tournament){ /*do something with this tournament */ }
&#13;
`