gogogoo
前端
：)
获得徽章 8
之前知道iframe页面嵌入有安全限制，以为只是被嵌入方做限制，防止自己被其他网站使用。
今天爆出来才发现嵌入方也需做限制，防止嵌入其他站点的iframe。
问ai的：为什么需要 “双向限制”？
只限制 A 的frame-src：A 能确保自己不嵌恶意页面，但 B 仍可能被其他陌生站点嵌入（B 的安全无法保障）；
只限制 B 的frame-ancestors：B 能防止被陌生站点嵌入，但 A 可能因漏洞被注入恶意 iframe（A 的用户体验受影响）；
双向限制：A 主动控制嵌入范围，B 被动拒绝非法来源，形成安全闭环，同时保护双方的安全和利益。
今天爆出来才发现嵌入方也需做限制，防止嵌入其他站点的iframe。
问ai的：为什么需要 “双向限制”？
只限制 A 的frame-src：A 能确保自己不嵌恶意页面，但 B 仍可能被其他陌生站点嵌入（B 的安全无法保障）；
只限制 B 的frame-ancestors：B 能防止被陌生站点嵌入，但 A 可能因漏洞被注入恶意 iframe（A 的用户体验受影响）；
双向限制：A 主动控制嵌入范围，B 被动拒绝非法来源，形成安全闭环，同时保护双方的安全和利益。
展开
评论
1
http://localhost/#/priceMsg/expenseLook
http://localhost/#/priceMsg/expenseLook?orderId
上述不同路由对orderId取参竟然返回的分别是undefined和null
http://localhost/#/priceMsg/expenseLook?orderId
上述不同路由对orderId取参竟然返回的分别是undefined和null
评论
点赞
在vscode的控制台使用powerShell无法运行终端命令的解决方式：
是由于 PowerShell 的执行策略限制导致的，禁止运行脚本文件。可以按照以下步骤修复：
1.按下Win + X，选择 “Windows PowerShell (管理员)”
2.输入命令并回车：Get-ExecutionPolicy，通常会显示Restricted（受限制）
3.输入以下命令并回车： Set-ExecutionPolicy RemoteSigned，当出现确认提示时，输入Y并回车
4.再次执行Get-ExecutionPolicy，确认显示为RemoteSigned
5.关闭并重新打开 VSCode 的终端，再次尝试运行终端命令
是由于 PowerShell 的执行策略限制导致的，禁止运行脚本文件。可以按照以下步骤修复：
1.按下Win + X，选择 “Windows PowerShell (管理员)”
2.输入命令并回车：Get-ExecutionPolicy，通常会显示Restricted（受限制）
3.输入以下命令并回车： Set-ExecutionPolicy RemoteSigned，当出现确认提示时，输入Y并回车
4.再次执行Get-ExecutionPolicy，确认显示为RemoteSigned
5.关闭并重新打开 VSCode 的终端，再次尝试运行终端命令
展开
评论
点赞
{ passive: true } 是事件监听时的一个优化选项，主要用于解决 滚动 / 触摸事件的性能问题，核心作用是 提升页面滚动流畅度，避免因事件处理逻辑导致的卡顿。
具体作用：
在浏览器中，当监听 touchmove（触摸滑动）、scroll（滚动）等与页面滚动相关的事件时，浏览器需要判断事件处理函数中是否调用了 event.preventDefault()（用于阻止默认行为，比如阻止页面滚动）。
如果没加 passive: true（现代浏览器中，可能默认设置了passive： true。）：浏览器会先等待事件处理函数执行完毕，确认是否有 preventDefault()，再决定是否执行默认滚动行为。这个等待过程可能导致 滚动延迟（尤其是在移动端，会出现 “滚动卡顿”）。
加了 passive: true 后：相当于告诉浏览器：“这个事件处理函数不会调用 preventDefault()，你可以直接执行默认滚动行为，不用等我处理完”。这样浏览器会同步执行默认滚动，避免等待，从而提升滚动流畅度（尤其是高频触发的 touchmove 事件）。
这就是为什么看很多库都手动添加了passive：true的原因，为了滚动优化的操作
具体作用：
在浏览器中，当监听 touchmove（触摸滑动）、scroll（滚动）等与页面滚动相关的事件时，浏览器需要判断事件处理函数中是否调用了 event.preventDefault()（用于阻止默认行为，比如阻止页面滚动）。
如果没加 passive: true（现代浏览器中，可能默认设置了passive： true。）：浏览器会先等待事件处理函数执行完毕，确认是否有 preventDefault()，再决定是否执行默认滚动行为。这个等待过程可能导致 滚动延迟（尤其是在移动端，会出现 “滚动卡顿”）。
加了 passive: true 后：相当于告诉浏览器：“这个事件处理函数不会调用 preventDefault()，你可以直接执行默认滚动行为，不用等我处理完”。这样浏览器会同步执行默认滚动，避免等待，从而提升滚动流畅度（尤其是高频触发的 touchmove 事件）。
这就是为什么看很多库都手动添加了passive：true的原因，为了滚动优化的操作
展开
评论
点赞
🟢 vendor.js：长期缓存（第三方库很少更新）
🟡 app.js：短期缓存（业务代码经常更新）
🔴 runtime.js：不缓存或短期缓存（包含模块映射）
🟣 vendor-async.js：按需加载（路由懒加载时才下载）
🟡 app.js：短期缓存（业务代码经常更新）
🔴 runtime.js：不缓存或短期缓存（包含模块映射）
🟣 vendor-async.js：按需加载（路由懒加载时才下载）
评论
1
export PATH=/usr/local/node-v20.17.0/bin:$PATH
export NPM_CONFIG_CACHE=/opt/ci-cache/npm
npm set cache "$NPM_CONFIG_CACHE"
export XDG_CACHE_HOME=/opt/ci-cache/node_modules_cache
npm set audit false
npm set fund false
npm set progress false
npm set registry
registry.npmmirror.com
if [ -f package-lock.json ]; then
npm ci --ignore-scripts --loglevel=error
else
npm install --ignore-scripts --loglevel=error
fi
npm run build:${ENV}
前端cicd构建优化
export NPM_CONFIG_CACHE=/opt/ci-cache/npm
npm set cache "$NPM_CONFIG_CACHE"
export XDG_CACHE_HOME=/opt/ci-cache/node_modules_cache
npm set audit false
npm set fund false
npm set progress false
npm set registry
registry.npmmirror.comif [ -f package-lock.json ]; then
npm ci --ignore-scripts --loglevel=error
else
npm install --ignore-scripts --loglevel=error
fi
npm run build:${ENV}
前端cicd构建优化
展开
评论
点赞
赞了这篇文章
代码提交错了分支，甚至不知道在哪个分支提交的，通过下述方式找回并切到正确分支：
找分支： git log --all --grep="提交的关键词" --oneline
切换到对应的分支：git cherry-pick abc123
找分支： git log --all --grep="提交的关键词" --oneline
切换到对应的分支：git cherry-pick abc123
评论
点赞
<script setup>
import { ref, onMounted } from 'vue'
const list = ref([
/* ... */
])
const itemRefs = ref([])
onMounted(() => console.log(itemRefs.value))
</script>
<template>
<ul>
<li v-for="item in list" ref="itemRefs">
{{ item }}
</li>
</ul>
</template>
itemRefs原来有数组的用法
import { ref, onMounted } from 'vue'
const list = ref([
/* ... */
])
const itemRefs = ref([])
onMounted(() => console.log(itemRefs.value))
</script>
<template>
<ul>
<li v-for="item in list" ref="itemRefs">
{{ item }}
</li>
</ul>
</template>
itemRefs原来有数组的用法
展开
1
1