Jon*_*Jon 14 javascript php jquery trello
我的公司列出了Trello(私人董事会)的当前项目,我们希望通过连接到董事会在我们的网站上显示它们,以便它们始终是最新的.
使用此示例,我现在可以拉出卡片并在页面上渲染它们,但只有在您单击"连接到Trello"之后.
为什么用户需要连接？它们是我在MY板上的MY卡,所以有没有办法只是......向他们展示卡片(他们只需要是只读的......用户无法编辑/与他们互动)？Trello应该只需要验证我,而不是访问我网站的访问者.
有没有代码解决方案？
这是我目前的JS片段:
<script src="https://api.trello.com/1/client.js?key=[MY-APP-KEY]"></script>
<script>
var onAuthorize = function() {
updateLoggedIn();
$("#projects").empty();
Trello.members.get("me", function(member){
var $item = "<tr><td class='subhead disabled'>Loading projects...</td></tr>";
$("#projects").html($item);
// Output a list of all of the cards that the member
// is assigned to
Trello.lists.get("[MY-TRELLO-LIST-ID]/cards", function(cards) {
$("#projects").html("");
$item = "";
$.each(cards, function(ix, card) {
// OUTPUT THEM ON THE PAGE
$("#projects").append($item);
});
});
});
};
var updateLoggedIn = function() {
var isLoggedIn = Trello.authorized();
$("#loggedout").toggle(!isLoggedIn);
$("#loggedin").toggle(isLoggedIn);
};
var logout = function() {
Trello.deauthorize();
updateLoggedIn();
};
Trello.authorize({
interactive:false,
success: onAuthorize
});
</script>
Jon*_*Jon 11
在浏览网页后,我在HappyPorch上找到了一个很棒的解决方案.
来自HappyPorch的Ondrej的电子邮件主题:
高级概述如下:
您需要一个可以访问电路板的Trello帐户.您可以使用您的个人,或创建"服务帐户"以保持事物(权限)孤立.
您需要使用Trello API创建一个小型管理应用程序,它将提示登录,并请求访问令牌.您将看到一个登录对话框,您将使用所需的(服务)帐户登录.然后,使用Javascript API,您将提取安全令牌.
在您的实际应用程序中,您将再次使用Trello API.您可以设置先前提取的令牌,而不是提示登录; 然后,用户将代表用于生成令牌的帐户与Trello API进行交互.
用例是你拥有你想要向别人展示的板子,所以他们没有理由(用户......你网页的访问者......无论谁)需要验证任何东西,更不用说甚至需要一个Trello账号一点都不 他们是你的董事会,所以Trello只需要验证你有权访问......而不是其他任何人.
根据HappyPorch的教程,我创建了一个很小的authenticate.html页面,否则它是空的.我访问此页面一次以验证服务帐户并通过将其打印到控制台来获取令牌.
authenticate.html
<html><head></head><body>
<script src="https://api.trello.com/1/client.js?key=APP-KEY-FOR-SERVICE ACCOUNT"></script> <!-- Get yours here https://trello.com/app-key -->
<script>
// Obtain the token
var authenticationSuccess = function () {
var TOKEN = Trello.token();
console.log(TOKEN);
};
var authenticationFailure = function () {
alert("Failed authentication");
};
// Force deauthorize
Trello.deauthorize();
Trello.authorize({
name: "Preauthorize a Shared Service Account",
scope: {
read: true,
write: true
},
type: "popup",
expiration: "never",
persist: false,
success: authenticationSuccess,
error: authenticationFailure
});
</script>
</body></html>
从您的小型身份验证应用程序获取令牌后,您现在可以在要显示Trello卡的任何页面上使用它.如果您使用Trello的client.js方法,请使用您打印到控制台的令牌并在下面设置令牌.
// USING THE STORED TOKEN (ON EACH PAGE YOU WANT TO DISPLAY BOARDS)
Trello.setToken('THE_TOKEN');
Trello.get("members/me/cards", function(cards) {
$cards.empty();
$.each(cards, function(ix, card) {
$("<a>")
.attr({href: card.url, target: "trello"})
.addClass("card")
.text(card.name)
.appendTo($cards);
});
});
上面的代码片段来自这个jsFiddle,但我只是展示了令牌如何适应从Trello中提取数据的流程.
好吧,你是对的.这就是为什么服务器端做这个东西更好的原因.
所以相反,我使用这个小的Trello PHP包装器来帮助我完成所有这个服务器端.
这就是我想要显示我的Trello卡的页面上的样子.在下面的示例中,我将从特定列表中提取.如果您正在尝试查找自己的listID,请查看此页面上的第3部分.
无论-你想做某些秀,cards.php
<?php
include "PATH-TO/Trello.php"; // Trello.php is from the PHP wrapper mentioned above
$key = "SERVICE-ACCOUNT-APP-KEY"; // get yours at https://trello.com/app-key
$token = "TOKEN-YOU-GOT-FROM-YOUR-TINY-AUTHENTICATE.HTML-APP";
$trello = new \Trello\Trello($key, null, $token);
foreach($trello->lists->get("YOUR-LIST-ID/cards") as $card) {
echo($card->name." | ".$card->url."\n");
}
?>
创建一个新的Trello"服务"帐户,您可以将其添加到要显示的任何板上.服务帐户不是必需的......您自己可以成为帐户...但保持独立可以保护您免受离开公司的人等.
创建一个小应用程序(实际上只是一次性使用的网页),通过常用的Trello身份验证过程与弹出窗口,而不是.您将从刚刚创建的服务帐户登录/验证.这将为您提供一个独特的令牌,让Trello知道您是合法的,并且您有权访问.
在要显示卡片的任何页面上使用此令牌(将其视为VIP访问徽章).您的用户将永远不会看到Trello身份验证弹出窗口,因为我们已经向Trello展示了我们的VIP访问徽章.
打印出卡片,板卡等!高兴,因为你现在可以显示任何卡,而不需要Trello账户.
非常感谢Ondrej和HappyPorch的人们提供了有用的帖子,并愿意帮助那些喜欢假装知道如何编写代码的用户体验设计师:)