小编fre*_*447的帖子

我有一个API端点,我试图用谷歌应用程序测试:'邮递员'.我需要设置使用"基本身份验证"的标头.我不确定'Header:Value'应该怎么做

这就是管理员说标题应该设置的方式:"头部值是'基本'一词,后跟你的组织名称,你的Api键用冒号和base64编码分隔."

我尝试了很多东西,但我没有做得很对.我得到的错误是"消息:令牌未设置".

我想渲染一个iframe,源代码是Github,如下所示:

<iframe src="https://gist.github.com/user45445/9bf8d568e3350146ba302d7d67ad576f"> </iframe>

这是我在控制台中遇到的错误: Refused to display 'https://gist.github.com/fresh5447/9bf8d568e3350146ba302d7d67ad576f' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'none'".

我正在研究如何Content Security Policy在我的Node服务器中指定我,以指定它应该接受任何iframegithub

所以我安装了csp-helmet并将其添加到我的服务器代码中:

var csp = require('helmet-csp')

app.use(csp({
  // Specify directives as normal.
  directives: {
    frameAncestors: ['*.github.com'],  //I thought these two did the same, so I tried them both.
    childSrc: ['*.github.com']
  },

  // Set to true if you only want browsers to report errors, not block them.
  // …

不确定问题是我如何设置套接字 - 或者我是否错误地尝试使用React渲染数据.

我可以使用我的套接字成功引入数据 - 但是当新数据发布到服务器时它不会处于更新状态.我的目的是让React中的状态自动呈现新数据,由于套接字连接,它始终处于活动状态.

这是我的客户端应用程序从服务器获取消息并呈现它们:

var Chat = React.createClass({
  getInitialState: function() {
    return {
      messages: null
    }
  },
  componentWillMount: function(){
    var self = this;
    socket.emit('getMessages');
    socket.on('serverMessages', function (data) {
      self.setState({messages: data})
    });
  },
  render: function() {
    var messages = this.state.messages ? <MessageList messages={this.state.messages}/> : null
    return (
      <div className="jumbotron">
        { messages }
        <MessageForm submitMessage={this.submitMessage}/>
      </div>
      );
  }
});

以防万一这是我的服务器代码发出数据:

io.on('connection', function (socket) {

  socket.on('getMessages', function (data) {
    Message.find(function(err, messages){
      socket.emit('serverMessages', messages);
    })
  });

});

我使用Webpack带Hot Module Reloading.我还使用chrome扩展React Developer Tools来在开发时检查反应树.当我检查页面并查看组件树时,我希望看到实际组件的名称,但是,对于名称显示的每个组件Proxy Component.

我可以让你了解更多关于我的细节Webpack,但我正在努力甚至谷歌正确解决这个问题.

以下是我用于webpack的工具:

"webpack": "^1.9.6",
"webpack-dev-middleware": "^1.2.0",
"webpack-dev-server": "^1.14.1",
"webpack-hot-middleware": "^2.0.0"

webpack.config.js

var path = require('path');
var webpack = require('webpack');

module.exports = {
  devtool: 'eval',
  entry: [
    'webpack-hot-middleware/client',
    './client/index'
  ],
  output: {
    path: path.join(__dirname, 'static'),
    filename: 'bundle.js',
    publicPath: '/static/'
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin()
  ],
  module: {
    loaders: [
      {
        test: /\.json$/,
        loader: 'json'
      },
      {
        test: /\.js$/,
        loader: 'babel-loader',
        include: path.join(__dirname, 'client'), …

我有一个充满对象的资源数组。每个对象都有包含对象的类别数组。我正在尝试应用过滤器以仅返回具有特定名称的类别对象的资源。我在嵌套数据对象时遇到了一些麻烦。

这是我正在使用的数据：

const resources = [
  {
    title: 'Learn JS',
    categories: [
      {
        name: 'javascript'
      },
      {
        name: 'css'
      }
    ]
  },
  {
    title: 'Learn CSS',
    categories: [
      {
        name: 'css'
      }
    ]
  },
  {
    title: 'Learn other stuff',
    categories: [
      {
        name: 'jQuery'
      },
      {
        name: 'javascript'
      }
    ]
  },
  {
    title: 'Learn node',
    categories: [
      {
        name: 'node'
      }
    ]
  },
  {
    title: 'Learn React',
    categories: [
      {
        name: 'react'
      }
    ]
  },

];

这是我的两次尝试。两者都返回空数组。尝试使用maps和filters …

我正在创建一个主 - 细节导航,就像这里的示例反应路由器示例 ;

我有一个容器组件OneCheckpointContainer,它呈现一个导航面板CheckpointNav(链接)和一个数据组件OneCheckpointData(这个人在加载时获取数据,并呈现OneCheckpointView.

当我单击其中一个链接CheckpointNav时,除了浏览器中的URL发生更改外,没有任何反应.直到我刷新页面才会获取新数据,然后在子视图中呈现新组件.(也没有错误)

我不确定这个错误是否因为子组件还负责获取数据以及视图.

以下是我设置路线的方法:

  <Route path="/modules/:id" component={OneCheckpointContainer}>
    <Route path="/modules/:id/checkpoints/:cp_id" component={OneCheckpointData} />
  </Route>

OneCheckpointContainer

import React from 'react';
import CheckpointNav from './CheckpointNav';

class OneCheckpointContainer extends React.Component {
  constructor(props, context) {
    super(props, context);

    this.state = {
      checkpoints: null,
      user: null
    };

  }

  componentWillMount() {
    this.loadCheckpoints();
    this.context.getUser((data) => this.setState({ user: data }));
  }

  loadCheckpoints() {
    $.ajax({
      url: `/api/v1/modules/student/${this.props.params.id}/checkpoints`,
      method: 'GET',
    }).done((data) => {
      this.setState({ checkpoints: data });
    }); …