小编dou*_*lin的帖子

我尝试使用express.js CORS 包将 CORS 请求的来源限制为每个路由的一个特定域，如下所示：

const express = require('express');
const cors = require('cors');

const port = process.env.PORT || 3000;

let app = express();

app.get('/', cors({origin: 'http://example.com'}), (req, res, next) => {
  res.sendStatus(200);
});

app.post('/', cors({origin: 'http://whatever.com'}) (req, res, next) => {
  res.sendStatus(200);
});

app.listen(port, () => {
  console.log(`Started on port ${port}`);
});

然而，这似乎没有任何效果，因为我可以GET进出POST任何域。然后，我尝试使用以下命令将所有路由限制为一个来源，但得到了相同的结果：

app.use(cors({origin: 'http://example.com'}));

我在 localhost 上的开发环境和 Heroku 上的生产环境中都遇到了这种情况。知道我缺少什么吗？

我正在一个新闻网站上工作，该网站上将有文章，每篇文章都有一个或多个各自的作者。如果单击作者的姓名，它将带您到一个页面，显示他们的信息和他们撰写的文章列表。

因此，每篇文章都有一个authors属性，该属性又是author具有属性的对象数组：全名，slug（全名的小写版本，用空格代替破折号），等等。

定义查询时是否可以按特定作者的文章过滤文章？

query authorQuery($slug: String!) {
  allContentfulArticle(filter: { //not sure what to do here }) {
    edges {
      node {
        title
        slug
        authors {
          name
          slug
        }
      }
    }
  }
}

我的另一个选择是加载所有文章，然后在组件中设置过滤器，如下所示：

const articles = data.allContentfulArticle.edges.filter(({ node }) => {
  return node.authors.some((author) => author.slug === data.contentfulAuthor.slug);
});

这不是世界末日，但是它违反了仅加载所需数据的GraphQL原则。

我将描述我想要完成的事情,如果我的方法看起来很愚蠢,请随时告诉我:

我有一个带有视频库和flash视频播放器iframe的页面.当用户点击视频缩略图时,它开始在框架中播放.

用户还可以通过将文件路径附加到url的末尾 - blabla.com/videogallery?videofilepath来转到加载到iframe中的特定视频的页面.我进行了设置,以便轻松分享视频.

我希望能够为facebook/twitter添加分享按钮,但我无法让它们工作并使用正确的元数据(图像和标题)正确呈现自己.

所以我想把Share按钮放在播放器iframe中,然后在视频发生变化时动态更新元数据标签,但我不确定如何解决这个问题.

任何帮助将不胜感激,谢谢.

我一直在寻找一种方法来做这件事,因为看起来他们应该是一个.

我只是想从SoundCloud页面自动拉出5个最近的曲目,并将它们放在我的网站上的"最新音频"部分下.

SoundCloud甚至自己做到了这一点.如果你去特定的曲目,在页面的右下角有一个"USERNAME的更多曲目",请看一下:http: //soundcloud.com/goldenstatewarriors/mark-jackson-on-the-dan

我发现的最接近的是:

http://api.soundcloud.com/tracks?client_id={client_id}

但为此你需要一个client_id,用于soundcloud应用程序.我尝试注册一个应用程序,但是当我client_id将上面的内容输入到上面时,我得到了一堆不属于我的音轨:

http://api.soundcloud.com/tracks?client_id=02db8e29aa2fb5bf590f478b73137c67

我只知道必须有办法做到这一点......

说我有以下内容:

<div id="content">content</div>

我想在它之前插入一些东西(注意未闭合的div):

$("#content").before("<div>pre-pre-content</div><div>pre-content ");

然后一些更多(注意我现在关闭div):

$("#content").after(" post-content</div><div>post-post-content</div>");

我想要的输出是:

<div>pre-pre content</div>
<div>
    pre-content <div id="content">content</div> post-content
</div>
<div>post-post content</div>

相反,我得到的是:

<div>pre-pre content</div>
<div>pre-content</div>
<div id="content">content</div>
<div>post-content</div>
<div>post-post content</div>

因为jQuery会自动"纠正"未关闭的标签.

小提琴

有没有办法使用.wrap()在元素之前和之后添加不同的内容而不自动关闭标签？

请注意,由于不相关的限制,我无法执行以下操作:

$("#content").html("<div>Content before " + $("#content).html() + " Content after</div>")

后解编辑

这是一个Yeoman生成器,用于基础和Browserify建立一个项目:https://github.com/dougmacklin/generator-foundation-browserify

我正在试图找出如何正确地将基础框架 js与browserify捆绑在一起.

在我的项目文件夹中,我将它与jQuery一起安装(它依赖于它):

npm install jquery foundation-sites --save

然后在我的main.js我有以下内容:

var $ = jQuery = require('jquery');
var foundation = require('foundation-sites');
$(document).foundation();

我包括$ = jQuery = ...因为如果我不这样做我会收到jQuery is not defined错误.

但是,js组件不起作用.例如,警报元素无法正常关闭.

<div data-alert class="alert-box">
    <!-- close functionality not working -->
    <a href="#" class="close">&times;</a>
</div>

如果有帮助,这里是一个plunkr,包括我index.html,main.js,bundle.js,package.json和gulpfile.js.

我仍然在使用browserify,我应该使用browserify-shim,还是我做错了什么？

根据其w3schools页面(我知道每个人最喜欢的资源),该.children物业返回

一个实时HTMLCollection对象,表示元素节点的集合

这个对象可以循环,好像它是一个像这样的数组:

var elements = document.getElementById('test').children;

for (var i=0; i < elements.length; i++) {
  console.log(elements[i]);
}

<div id="test">
  <p>paragraph 1</p>
  
  <p>paragraph 2</p>
  
  <p>paragraph 3</p>
</div>

但是,尝试使用该.map函数会引发错误:

var elements = document.getElementById('test').children;

var x = elements.map((element, index) => {
  console.log(element);
});

<div id="test">
  <p>paragraph 1</p>

  <p>paragraph 2</p>

  <p>paragraph 3</p>
</div>

有没有更好的方法来获取子DOM元素数组,或者我是否必须遍历该对象并手动创建一个数组才能使用数组方法,如.map()？注意,我不想使用jQuery.提前致谢.

完成以下任务的正确方法是什么:

$("#btn").click(function1);

调用函数:

function function1 (event) {
    event.preventDefault();
}

这似乎有效,但是我不明白function1如何理解事件参数在没有被传入的情况下引用的内容.这样的监听器设置是否更有意义:

$("#btn").click(function1(event));

这是一个小提琴.

这是一个jsfiddle,展示了以下问题.

我正在使用Foundation 5框架并试图在Reveal Modal中包含一个Orbit Slider,但由于某种原因,滑块没有给出合适的高度.

<-- Button to Reveal Modal -->
<a href="#" data-reveal-id="myModal" data-reveal class="button radius">Click For Modal</a>

<!-- Modal Popup that is revealed -->
<div id="myModal" class="reveal-modal" data-reveal>
    <ul data-orbit>
        <li><img src="http://placekitten.com/400/300" /></li>
        <li><img src="http://placekitten.com/400/300" /></li>
        <li><img src="http://placekitten.com/400/300" /></li>
    </ul>
</div>

请注意,如果您在模式打开的情况下调整浏览器窗口的大小,它会自动将自身更正为适当的高度.此问题存在于以前版本的Foundation中,因此出现了像这样的hacky修复:

$('.reveal-modal').on('opened', function(){
    $(this).find('[data-orbit]').css('height','');  
    $(window).trigger('resize.fndtn.orbit');
});

但是,此修复程序不再适用于最新版本的Foundation.有没有办法让它运作？

请注意,我不想简单地指定一个min-height css属性,因为我的滑块中的内容将具有可变高度,更不用说响应,因此像素值不起作用.