1

我正在学习羽毛,我正在尝试将一些数据发送到我创建的服务。当我未经任何授权使用它时,它工作正常。当我添加授权时,我可以使用邮递员手动发送 JWT 令牌。但是,当我发送帖子时,我不确定如何在标头中发送令牌或处理此问题的最佳方式。我发现的示例使用了 socket.io。有没有办法通过一个简单的帖子来做到这一点?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <meta name="viewport"
        content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=0">
  <title>Feathers Chat</title>
  <link rel="shortcut icon" href="favicon.ico">
  <link rel="stylesheet" href="//cdn.rawgit.com/feathersjs/feathers-chat/v0.1.0/public/base.css">
  <link rel="stylesheet" href="//cdn.rawgit.com/feathersjs/feathers-chat/v0.1.0/public/chat.css">
</head>
<body>
<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script type="text/javascript" src="//unpkg.com/feathers-client@^1.0.0/dist/feathers.js"></script>
<script type="text/javascript">
  var host = 'http://localhost:3030';
  // Set up Feathers client side
  var app = feathers()
    .configure(feathers.rest(host).jquery(jQuery))
    .configure(feathers.hooks())
    .configure(feathers.authentication({ storage: window.localStorage }));
  // authenticate using your JWT that was passed in the short lived cookie
  app.authenticate().then(function(result){
    console.log('Authenticated!', result);
    alert('Your JWT is: ' + app.get('token'));
  }).catch(function(error){
    console.error('Error authenticating!', error);
  });
</script>

<main class="login container">
  <div class="row">
    <div class="col-12 col-6-tablet push-3-tablet text-center">
      <h1 class="font-100">Post</h1>
    </div>
  </div>
  <div class="row">
    <div class="col-12 col-6-tablet push-3-tablet col-4-desktop push-4-desktop text-center">
      <form class="form" method="post" action="/posts">
        <fieldset>
          <input class="block" type="text" name="title" placeholder="title">
        </fieldset>
        <fieldset>
          <input class="block" type="text" name="description" placeholder="description">
        </fieldset>
        <button type="submit" class="button button-primary block login">
          Post
        </button>
      </form>
    </div>
  </div>
</main>
</body>
</html>

谢谢你的帮助!到目前为止,我真的很喜欢羽毛。

4

4 回答 4

1

使用羽毛客户端。app您用来进行身份验证的相同。

// Get the Posts service to work with
var postsService = app.service('posts');

// Create a post
postsService.create({
    title: $('#title').val(),
    description: $('#description').val()
});

// Do something when a Post is created
postsService.on('created', function (post) {
    // `post` is the newly created post
    // this callback will run whenever a post is created
    console.log(post);
});

您甚至可以postsService.create在事件处理程序中使用该方法,例如……</p>

$('form').on('submit', function () {
    postsService.create({
        title: $('#title').val(),
        description: $('#description').val()
    });
});
于 2016-09-16T16:01:01.807 回答
1

好的,这就是我所做的,似乎工作正常。我不确定羽毛在创建后是否以某种方式自动处理了身份验证令牌。一旦我将帖子设置为通过 jquery 发送并设置授权标头,它就可以正常工作。感谢所有的帮助。到目前为止,我非常喜欢羽毛!

  $(document).ready(function() {
    $( ".test-form" ).submit(function( event ) {
var token =  app.get('token');

    event.preventDefault();

    $.ajax({
      url: 'http://localhost:3030/posts/',
      type: 'post',
      data: {
      title: $("#title").val(),
        description: $("#description").val()
      },
      headers: {
        Authorization: token
      },
      dataType: 'json',
      success: function (data) {
        console.info(data);
      }
    });
  });});

于 2016-09-06T17:27:51.700 回答
0

当您发布数据时,在您登录时获得的Authorization -> token中设置标题字段。

在此处输入图像描述

于 2017-09-20T04:59:25.823 回答
0

阅读本节:http ://docs.feathersjs.com/authentication/client.html

您可以使用app.get('token').

于 2016-09-06T13:14:11.317 回答