Month: 4月 2023

推特的推荐算法

admin 编程 暂无评论 233 浏览

Twitter 旨在为您提供当今世界上发生的最好的事情。这需要一种推荐算法，将每天发布的大约 5 亿条推文提炼成少数几条热门推文，最终显示在您设备的For You时间轴上。该博客介绍了该算法如何为您的时间线选择推文。

我们的推荐系统由许多相互关联的服务和工作组成，我们将在本文中详细介绍。虽然应用程序的许多区域都推荐推文——搜索、探索、广告——但这篇文章将重点关注主页时间线的“为你推荐”提要。

我们如何选择推文？

Twitter 推荐的基础是一组核心模型和功能，它们从推文、用户和参与数据中提取潜在信息。这些模型旨在回答有关 Twitter 网络的重要问题，例如“您将来与其他用户互动的可能性有多大？” 或者，“Twitter 上有哪些社区，其中有哪些热门推文？” 准确回答这些问题使 Twitter 能够提供更相关的推荐。

推荐管道由使用这些功能的三个主要阶段组成：

  1. 在称为候选采购的过程中从不同的推荐来源获取最佳推文。
  2. 使用机器学习模型对每条推文进行排名。
  3. 应用启发式和过滤器，例如过滤掉来自您已阻止的用户的推文、NSFW 内容和您已经看过的推文。

负责构建和提供 For You 时间线的服务称为 Home Mixer。Home Mixer 建立在 Product Mixer 之上，Product

…
Read more

关于html5：脚本和样式元素的HTML“nonce”属性的目的是什么？

admin web前端 暂无评论 506 浏览

What’s the purpose of the HTML “nonce” attribute for script and style elements?

W3C说HTML5.1中有一个新的属性，叫做nonce，用于style和script，可以被网站的内容安全策略使用。

我在google上搜索了一下，但最后还是没有得到它，这个属性实际上做了什么，在使用它时会发生什么变化？

 

 相关讨论

 

  • 看起来这对你的站点来说只是一个额外的安全措施，你把它添加到一个链接或表单中，当页面被服务时，如果这个nonce与你的不匹配，那么你就不服务于页面了。
  • @皮特，你是说没人能装你的script和style？像hotlink禁令？
  • 它也适用于普通页面和表单验证

 

 

nonce属性使您能够"白名单"某些内联script和style元素，同时避免使用csp unsafe-inline指令(这将允许所有内联script和style指令)，因此您仍然保留一般不允许内联script和style的关键csp功能。

因此，nonce属性是一种告诉浏览器特定脚本或样式元素的内联内容不是由某些(恶意)第三方注入到文档中，而是由控制文档的服务器的人故意放入文档中的方法。

https://developers.google.com/web/fundamentals/security/csp/如果您必须使用，它提供了一个很好的示例，说明如何使用nonce属性，具体步骤如下：

 

  • 对于您的Web服务器收到的针对特定文档的每个请求，让您的后端从加密安全的随机数生成器(如EDNnf03nceIOfn39fn3e9h3sdfa)生成一个包含至少128位数据的随机base64编码字符串。那是你的现在。
  • 以步骤1中生成的nonce为例，对于任何要"白名单"的内联script/style，使后端代码在通过线发送之前在文档中插入nonce属性，该nonce作为值：
    1
    <script nonce="EDNnf03nceIOfn39fn3e9h3sdfa">…
  • 使用步骤1中生成的nonce，将nonce-预先发送给它，并使您的后端生成一个csp头，其中包含script-src或style-src的源列表值：
    1
    Content-Security-Policy: script-src 'nonce-EDNnf03nceIOfn39fn3e9h3sdfa'

 

因此，使用nonce的机制是一种替代方法，而不是让您的后端生成您希望允许的内联script或style的内容散列，然后在CSP头中的相应源列表中指定散列。

…
Read more

一文搞懂 script 标签

admin web前端 暂无评论 914 浏览

前端开发应该都知道 HTML 中 <script> 标签的作用——引入 JS 代码，不过由于脚手架和打包工具的普及，我想很少有人再亲手写 <script> 了。本期就借机写一下这个快被遗忘了的 <script> 教程，看看大家是否真的掌握了这个元素。

基本功能

废话不多说了，直入正题。<script> 引入 JS 的方式主要有三种：内联、外置，以及动态引入。

内联

直接将 JS 代码写到 script 标签内：

 

<html>
  <head>
    <script>
      console.log("Hello");
…
    
Read more

13 个前端可能用得上的 CSS技巧

admin web前端 暂无评论 18 浏览

13 个前端可能用得上的 CSS技巧

修改输入占位符样式、多行文本溢出、隐藏滚动条、修改光标颜色、水平和垂直居中。多么熟悉的场景！前端开发者几乎每天都会和它们打交道，本文收集 13 个CSS技巧，一起来来温故一下吧。

1. 解决图片5px间距问题

是否经常遇到图片底部多出 5px 间距的问题？不着急，有4种方法可以解决。

  • 解决方案 1：将其父元素的 font-size:0px
  • 解决方案 2：将 img 的样式增加 display:block
  • 解决方案 3：将 img 的样式增加 vertical-align:bottom
  • 解决方案 4：将父元素的样式增加 line-height:5px

2. 如何让元素高度与窗口相同

在现在前端中，CSS有一个单位是 vh，将元素高度样式设置为 height:100vh

3. 修改输入框 placeholder 样式

这个是表单输入框占位符属性，如何来修改默认样式，如下：

input::-webkit-input-placeholder {
…
Read more