小编pfo*_*oti的帖子

Chrome中的SVG有时无法渲染

第三次编辑:这是一个工作测试用例.看起来它与缓存svg spritesheet有关.如果我在我的服务器上配置缓存控制,以便没有SVG的缓存,则会发生此行为.随意查看源代码(它只在一个文件中,但我不想在这里全部包含它).

https://stuff.spherical.fish/svgtest.html

第二个编辑:下面列出的修复程序(直接在index.html中注入元素而不是使用外部spritesheet)刚刚停止在Chrome v49(我的beta频道浏览器刚更新到)中工作.v48具有间歇渲染问题,但v49一直不会渲染任何引用的<svg><use></use></svg>模式; 但只能在一个大而复杂的角度页面中.一个无聊的简单测试用例工作正常.为任何可以直接指出我已知问题或者可能来自哪里的人添加了奖励.它绝对不是文件未找到的,因为它仍然是一个间歇性的错误,并且整个页面在firefox和safari中呈现得很好.

编辑:这肯定与引用外部资源有关.当我将SVG直接嵌入index.html并引用它们时,<use xlink:href="#id"></use>它们可以正常工作,但如果我在<use>元素中引用外部文件,它们有时只会加载.

我在chrome中有一些奇怪的行为(只有 - 这不会发生在opera,firefox,safari上); 至少在40年代早期,我一直在看它,版本明智.

我的行为是在重复的角度结构中间.一切都是一样的 - 有一堆divs一起使用.还有一个SVG元素,如下所示:

<svg class="icon-3">
  <use xlink:href="/assets/trellis-icons.svg#icon-users"></use>
</svg>
Run Code Online (Sandbox Code Playgroud)

非常简单.

问题是,对于这些重复元素中的一些,图标不会呈现.检查chrome dev工具中的<use>元素表示渲染的SVG 元素具有高度和宽度,而未渲染的元素具有零高度和宽度.

这并不像这里有任何真正的区别; 我甚至手动编辑了DOM,使其中一个违规条目完全匹配其中一个,但是svg仍然没有渲染.这是一个相关的截图.

奇怪的svg渲染问题

您可以在下面看到(并忽略我的按钮填充问题)第一行没有小头和单词气泡图标.这是一个间歇性问题 - 如果我重新加载页面,它可能没问题,或者可能没有任何图标会加载.

我想知道:是否存在某种与使用精灵表相关的模糊问题(所有表现出这种行为的SVG都在同一个大SVG文件中并被#id引用)异步加载或其他什么?

如果这真的是未知/新行为,我将努力设计一个测试用例,但构建一些可能依赖于某种并发性bug的东西是很难的.所以我想我先问一下.

编辑添加:如果我将单个svg作为独立导出并以某种<img src="icon.svg">方式使用它,则不会发生此行为.如果我在单个独立文件中对图标进行svg使用,它仍然会失败.

编辑:根据@ kaiido的要求,这里是相关的svg.

<svg xmlns="http://www.w3.org/2000/svg">
  <!-- thirty other symbols snipped -->
  <symbol id="icon-users" viewBox="0 0 512 512">
    <path d="m352 397c-15-16-78-32-109-48c-21-11-32-33-32-53c0-10 7-19 13-26c5-6 9-14 13-24c8-4 18-12 18-31c0-12-2-19-5-24c1-11 2-22 3-34c4-45-42-90-89-90c-47 0-92 45-88 90c1 12 2 23 …
Run Code Online (Sandbox Code Playgroud)

svg google-chrome

46
推荐指数
2
解决办法
3万
查看次数

是否可以对redis查询运行字符串注入攻击?

我正在为我的(基于rails的)api服务器构建一个基于令牌的认证库,它使用redis来存储生成的auth令牌.我担心的是:user_id = $redis.get("auth:#{token}"),令牌是传递给authenticate_or_request_with_http_token的地方.

如果这是SQL,那将是一个巨大的红旗 - 字符串插值SQL查询非常不安全.但是,据我所知,在redis密钥查询上进行字符串插值并不安全.

我上面提到的声明的来源是redis文档:http://redis.io/topics/security (在字符串转义和nosql注入标题下),但我想确保在我得到一个Bobby之前就是这种情况表攻击.

ruby-on-rails redis

9
推荐指数
3
解决办法
4500
查看次数

检测postgres更新触发器中的列更改

我有一个postgres数据库,有几个表我想看更新,如果有任何更新,我想发一个"嘿,改变了一些"的更新.这适用于基本情况,但现在是时候改进了.

CREATE FUNCTION notify_update() RETURNS trigger AS $notifyfunction$
BEGIN
  PERFORM pg_notify('update_watchers',
    $${"event":"update", "type": "$$ || TG_TABLE_NAME || $$", "payload": {"id": $$ || new.id || $$}}$$);
  RETURN new;
END;
$notifyfunction$ LANGUAGE plpgsql;
Run Code Online (Sandbox Code Playgroud)

工作得很好.我把它附在桌子上,如下:

CREATE TRIGGER document_update_body
AFTER UPDATE ON documents
FOR EACH ROW EXECUTE PROCEDURE notify_update();
Run Code Online (Sandbox Code Playgroud)

(作为一个侧面问题:如果json.stringify我的触发结果比触发器功能中的mess'o' $$更好/更容易,请告诉我.平衡引号并不好玩).

我想要做的是在pg_notify调用中附加已更改的列的列表.除了迭代表中的列并检查NEW.col是否与OLD.col不同之外,似乎没有任何简单的方法可以做到这一点.执行此操作的不好方法是在我的通知过程中对列名进行硬编码(脆弱,如果我更改模式则更新另一件事等).

我也非常喜欢编写plpgsql,所以我不确定在哪里寻求帮助.理想情况下(如果没有我在文档中没有看到的updated_columns块变量),有一种方法可以在通知块中获取表的模式而不会导致过于严重的性能开销(因为这些表将更新为公平的).

sql postgresql plpgsql

8
推荐指数
1
解决办法
3230
查看次数

仅刷新物化视图的一部分?

我的核心问题是我有一个 jsonb 数据库列,其中数据的形状如下:

{"ops": [
  {"insert": "yaaaah "},
  {"insert": {"atmention": {"id": "183"}}}, 
  {"insert": "  "},
  {"insert": {"hashtag": "potato"}},
  {"insert": " \n"}
]}
Run Code Online (Sandbox Code Playgroud)

(它是前端鹅毛笔字段的输出,我不想改变该结构)。目前,我的 API 注意到该字段有一个hashtag条目,并通过提取主题标签条目(在本例中为“马铃薯”)并更新存储标签的 text[] 列来手动刷新数据库中的标签列。然后我可以通过执行 查询匹配项@> tags,或通过 获取所有标签的列表select distinct unnest(tags) from documents

这是功能性的,但有些不令人满意,因为它使标签数据非规范化 - rich_text 列是权威值,但需要计算和更新标签列以进行查询。

我想我想做的是制作文档-标签对的物化视图,例如:

create materialized view hashtags
with taglist as (
  select documents.id, 
  jsonb_array_elements(rich_text->'ops') as ops from documents
) 
select 
  taglist.id,
  ops->'insert'->'hashtag'
from taglist 
where ops->'insert'->'hashtag' is not null;
Run Code Online (Sandbox Code Playgroud)

这是可行的,但现在每次更新、删除或插入文档时我都必须刷新物化视图,而且我认为这不会很好地扩展 - 因为它基本上需要顺序扫描每个文档。

我想知道是否有某种方法可以说,“嘿,通过删除 id = 1 …

postgresql

7
推荐指数
1
解决办法
8196
查看次数

position:fixed 应该如何在影子 DOM 根中工作?

我有一个带有 的 div position: fixed,假设它应该附加到视口的底部而不是滚动,至少根据MDN是这样。

相反,我得到的是一个 div,它卡在其初始位置(渲染页面时视口的底部),但随后使用 Shadow-dom 滚动器上下滚动。

编辑:

这是一个 codepen,其元素位于核心支架内。请注意,这支笔中的红色 div 的位置:固定,如下面我的代码中所述。

http://codepen.io/ericeslinger/pen/bdedgp

这是一个 codepen,其元素位于核心支架之外。这是我想要的行为,但 div 在结构上位于核心支架内部(出于角度范围的原因)。

http://codepen.io/ericeslinger/pen/jPrPyy

FWIW,我使用的是聚合物 0.5。这是我正在运行的草图:

<head>
<style type="text/css">
.testClass {
  position: fixed;
  z-index: 1000;
  bottom: 0;
  left: 0px;
  right: 0px;
  height: 150px;
  background-color: red;
}
</style>
</head>
<body unresolved>
<core-scaffold>
  <div main vertical layout>
    <span>woo</span>
    <div class="testClass">This is some stuff at the bottom</div>
    <div style="min-height: 2000px" flex></div>
  </div>
</core-scaffold>
Run Code Online (Sandbox Code Playgroud)

如果我将 testClass div 移到 core-scaffold 之外,它会执行预期的操作并粘在窗口底部。如果我将其保留在核心支架内,则不会。

css shadow-dom polymer

6
推荐指数
2
解决办法
5959
查看次数

Google的oauth2端点 - v1与v2的变化?

我知道这就像一个'RTFM'问题,但我不能为我的生活找到有关此问题的可靠文档.

具体来说,我有一项服务,使用谷歌的oauth2 REST api来验证用户.我正在使用的库(贝尔)最近开始调用API端点的/ v2版本.这些调用似乎不再支持approval_prompt=force查询字符串(或者沿着那些行,我不再能够使用特殊路径来强制新的刷新令牌).

实际上,我需要做的就是阅读文档,了解oauth2库从v1到v2的变化,甚至找到v2特定的信息.关于developers.google.com的所有文档似乎都与v1 api有关.

google-api google-oauth hapijs google-oauth2

5
推荐指数
1
解决办法
800
查看次数

使用Joi/Hapi,如何验证所有密钥的哈希条目?

我想允许我的前端将值的哈希值推送到后端.散列可以具有任何(JSON合法)密钥,但每个密钥的值必须适合特定的模式.把它想象成:

extended: {
  tubers: {
    potato: {weight: 1, cost: 2},
    yam: {weight: 1, cost: 1}
  }
}
Run Code Online (Sandbox Code Playgroud)

所以扩展对象有块茎场.块茎领域有许多键,但每个值必须具有整数的权重和成本.

我似乎无法将其映射到我的普通Joi对象模式框架中.

hapijs joi

2
推荐指数
1
解决办法
905
查看次数

使用subscription.next()是否是反模式?

我有一个订阅,我想用一段中间件代码来表示事件。所以我有一件事想要订阅一个可观察的东西,而另一件事则不是一个可观察的东西。

我考虑过为此使用主题-这就是它们的用途:

const repeater = new Rx.Subject();

function subscribe(observer) {
  return repeater.subscribe(observer);
}

// in some other function, call repeater.next(val)
Run Code Online (Sandbox Code Playgroud)

但是后来我开始查看常规的subscription()调用返回了什么。我可以改为:

let sub = null;
function subscribe(observer) {
  return Rx.Observable.create((o) => sub = o);
}
// elsewhere sub.next(val)
Run Code Online (Sandbox Code Playgroud)

但是也?

let unsub = null;
function subscribe(observer) {
  unsub = Rx.Observable.create(() => false).subscribe(observer)
}
// elsewhere unsub.next(val)
Run Code Online (Sandbox Code Playgroud)

所有这些事情将向订户发出val信号。我在这里不了解的怪异之处是订阅返回有next()可用的内容-我认为next()只存在于Observable上下文中的观察者上。

无论如何,我都需要处理取消订阅的事务-当中间件被拆除时,我需要发出信号流完成并释放一些资源。令我惊讶的是,unsub接下来又起作用了。

这向我发出信号,就观察者,可观察对象和主题等而言,我还只是简单地了解了一些RxJS。通常,我了解如何将事件源和其他类似内容连接到可观察的流中。这实际上只是在从无聊的函数调用中构建可观察的流的上下文中-每当外部库调用该函数时,该流就表示已更新可观察的流。

rxjs rxjs5

2
推荐指数
1
解决办法
2105
查看次数

使用自定义功能扩展Observable

我的情况:我有一个数据存储,可以在其中获取可以使用RxJS Observables进行观察的模型。通用类型签名是

const foo = new Model({id: 123}, dataStore);
foo.asObservable().subscribe((v) => /* do stuff with values of this model */ );
Run Code Online (Sandbox Code Playgroud)

一般的观念是将数据视为可观察数据有两种方式:(a)当您遇到高速缓存情况(例如浏览器的localStorage包含一些过时的数据)但仍希望在实际数据显示时显示一些信息(b)当您已经加载了正确的数据时,但是在本地或在后端进行了更改,需要向上传播。到目前为止,这还算不错。

下一个问题是模型与其他模型有关系(例如,父母有很多孩子)。按照惯例,我可以做类似

foo.asObservable().subscribe(v => console.log(v.relationships.children))
Run Code Online (Sandbox Code Playgroud)

和(忽略此处的空错误),当将4添加到父子关系时,我会先得到[1、2、3],然后得到[1、2、3、4]。到目前为止和我在一起?

问题是我经常想以自己的权利访问这些子项,而不是以索引的形式,而是以可观察的模型访问(因此,我可以显示用户社区的所有成员的名字,例如,社区和所有成员是数据模型)。我目前在我的控制器代码中使用大量样板进行此操作,涉及到的许多调用.combineLatest

我想做的就是为这种类型的对象定义一个自定义运算符,这样我就可以将它们全部重做。理想的情况是:

foo.asObservable().inflateRelationship('members').subscribe(
  (v) => // v === [{name: 'steve'}, {name: 'gertude'} ...] etc
);
Run Code Online (Sandbox Code Playgroud)

我实际上有部分工作,但是问题是从实际链开始的。我正在遵循扩展Observable说明,创建一个新的实现的CustomObservable类lift,但是我的问题是我不能在这里使用静态的Observable方法(例如Observable.merge())在中生成我的初始Observable Model.asObservable

我的问题来了:

const preload$ = Observable... 
  // create the "load from cache and backend observable"
const update$ = Observable ... 
  // create the "update after load when the …
Run Code Online (Sandbox Code Playgroud)

rxjs rxjs5

2
推荐指数
1
解决办法
1762
查看次数

indexedDB会耗尽空间吗?

我正在将localforage与indexedDB驱动程序配合使用。我的indexedDB存储空间很大,但给我的印象是indexedDB从未真正用完空间,它只是使旧内容过期。

但是,在挂起60秒后,对indexedDB的大量请求失败,并显示错误:“ DOMException:事务由于不活动而超时。”。

如果我只是做一个简单的

function testWrite(n) {
  localforage.setItem(`test:${n}`, Math.random().toString(16).slice(2))
  .then((v) => console.log(x))
  .catch((err)=>console.log(err))
}
for (var x = 0; x < 10; x++) {
  testWrite(x)
}
Run Code Online (Sandbox Code Playgroud)

在指向我的Web应用的隐身窗口中,它可以正常工作。如果在非隐身窗口中执行相同的操作,则会发生超时。重要的是:即使将循环大小增加到某个较大的值(即使是在新的会话中),也会遇到相同的超时问题。因此,感觉有些地方有些不正确。

google-chrome blink indexeddb localforage

1
推荐指数
1
解决办法
701
查看次数