Chrome 开发工具devtools 网络抓包修改重放，无法修改cookies及其他值。 我使用chrome network 分析网络，想通过修改某个请求的cookies值验证哪些参数有效 "图片.png" (https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20250121/f977c55c7e00f1a2ff42d77d178e07ee.png) 我想修改cookies。 我通过chrome自带的 copy as fetch或者copy as node fetch,然后到控制台修改参数值，重放请求。但都失败了。 "图片.png" (https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20250121/e7b08d849b0c2aab68043e3d5abff10d.png) 为什么我无法修改相关参数值？？？

这问ai不就行了? "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250112/7ab70f4fecb171651e554a745a67294a.png) // 声明一个字符串变量 let str = 'aabbccddeeffgghhiijjkkllmm'; // 截取掉前8位，赋值给新的变量 let newStr = str.slice(8); // 声明一个空数组，用来存放分割后的字符串 let data = []; // 使用循环，每次取出两个字符，放入数组 for (let i = 0; i newStr.length) { data.push(newStr.slice(i)); break; } // 否则，取出两个字符，放入数组 data.push(newStr.slice(i, i + 2)); } // 打印结果 console.log(data); // ['ee','ff','gg','hh','ii','jj','kk','ll','mm','f']

"jsbin - link -demo" (https://link.segmentfault.com/?enc=8A%2FzeKNgtlSKJ0KLPkyP%2Bg%3D%3D.2p%2BEiIrfrd781gNDcKPpaS8SJF4r6AHtEXqJWi9D3%2FrEof5f8%2FOQzrsM2GZrhxuaE%2FsFKk5RHWR3hcbD2AFgAA%3D%3D) promise-load function loadImageAsync(url) { return new Promise((resolve, reject) => { let img = new Image() img.src = url img.onload(()=>resolve(img)) img.onerror(()=>reject()) console.log(3); }) } loadImageAsync('https://avatarsabc.githubusercontent.com/u/54520846?s=400&u=5220402538d51b3c67cf208ea16f93cb218fe4d2&v=4').then((imgDom) => { console.log('success'); document.body.appendChild(imgDom) }).catch(() => { console.log('error-Load'); }) 为什么console.log(3) 没有执行

"isUndef(vnode.text)"的主要目的不是判断文本内容是不是空，而是为了判断是不是文本节点，包括后面判断不是文本节点的话有没有子元素 "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250109/a43708f7e9745cdfafd7b92a8b1c8d23.png)

"fonttools" 通过 "pip install" 成功后，提示"fonttools: command not found"? 这种要怎么修改 ？ 目前 "python" 和 "pip"均已安装成功？ "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250110/c69995a10507a3dc23d2785fd8847e38.png)

«目前想到的是：在token中携带登录时的设备IP，同时采用对token进行签名避免篡改，在请求数据的时候验证IP是否一致，不一致则返回重新登录。» 移动设备（手机）的IP，十分不稳定，网络条件发生变化就可能变。另外，如果用户处于 WiFi 和 流量 的边缘，那不是一会儿连上 WiFi 又要重新登录，WiFi 断了又要重新登录？ 正确的做法就是上 HTTPS。

Hello. 比方说,重定向到文件我会(>号),那重定向到套接字(也就是某个给定的IP地址和端口的组合)呢? 我能想到的就是先定向到某个文件,再开一个后台程序,不断监视这个文件的内容是否更新,一更新就socket出去...总感觉很糟糕. 有什么更灵巧的办法吗?

比如flex "https://developer.mozilla.org/zh-CN/docs/Web/CSS/flex" (https://link.segmentfault.com/?enc=njAbCopZ%2FLaQsXEBcydHOQ%3D%3D.fWHMDU2lNhuh4BYxIVkFd0%2BgcKXr3MhHG455NlO4OCCayFlZsmsWFTfPFV2dBWBo68l8WiSNLuX7YSDOG1G8KA%3D%3D) as each of the properties of the shorthand: flex-grow: 0 flex-shrink: 1 flex-basis: auto 直译是 作为简写的每个属性 但是我不理解什么意思 *** 我大概知道什么意思，就是flex的初始值是flex: 0 1 auto 但是看这个“as each of the properties of the shorthand:”实在有点别扭

这两者功能差不多，有什么差异吗？

生产环境是多个客户共用的SAAS类型, 应用环境是前端UI和两个java应用, 环境运行过程中需要连接本机或其他数据库, 请教一下如何使用DockerFile编排镜像, 思路或者想法皆可留言, 具体应该怎么编写Dockerfile? 拜谢!

const fs = require('fs'); function A() { console.log(1); } function process(obj) { return JSON.stringify(obj, function(key, value) { if (typeof value === 'function') { return value.toString(); } return value; }); } fs.writeFile('output.json', process({ a: A }), (err) => { if (err) throw err; console.log('The file has been saved!'); }); 没错： const fs = require('fs'); function A() { console.log(1); } function process(obj) { const entries = Object.entries(obj).map(([key, value]) => { if (typeof value === 'function') { return `${key}: ${value.toString()}`; } return `${key}: ${JSON.stringify(value)}`; }); return `{ ${entries.join(', ')} }`; } fs.writeFile('output.js', process({ a: A }), (err) => { if (err) throw err; console.log('The file has been saved!'); }); 用的时候： const obj = require('./output.js'); obj.a();

如题，本身from后的数据表是用子查询出来的，无法用某种方式进行order by，但是要取查询结果的最后一条应该怎么写？

用Eager Loading： $users = User::with('posts')->get(); 用缓存： $value = Cache::remember('users', $minutes, function () { return DB::table('users')->get(); });

你这两台电脑是windows吧，然后使用了不同的系统主题，或者自定义了主题的一些样式吧。

估计是当前dev和master处于同一个提交，代码一致

我尝试在一个经过transform:scale()修改后的父元素“playground”上设置其子元素“ball”的offset属性，但是过程中出现了难以描述的异常，似乎每一次设置offset，其都会与offset所提供的数值有所偏差，必须经过多次修改，其才能正确地符合offset提供的位置。 我的代码如下： var new_scale = parseInt(一个输入值，小于3且大于0.3) $("#playground").css({ transform: 'scale(' + new_scale + ')', }); $("#ball").on("click",function(){ $("#ball").offset({ left: 300, top: 300 }) }) 我猜想，或许可能与offset不兼容scale，或者scale并没有直接修改元素的位置有关，但是我的代码非常简单，我就只是希望ball能够到达这么一个位置，事实上他的确能移动，但是需要多次点击才行，我毫无头绪，希望能够得到任何建议，谢谢你们！

就是打印一个文件,并且监视,或者等待它的追加,如果有,就把追加的内容也打印.

有两张表 "article" 与 "tag" 多对多关联 ArticleSchema.belongsToMany(CategorySchema, { through: { model: ArticleCategory, unique: false // 取消联合主键的约定 }, as: 'category', foreignKey: 'articleId', constraints: false }) CategorySchema.belongsToMany(ArticleSchema, { through: { model: ArticleCategory, unique: false }, as: 'article', foreignKey: 'categoryId', constraints: false }) 我现在需要通过"tag"来筛选关联的"article"应该怎么写呢 尝试了在 "where" 中查询，但是关联的属性是报错的，在 "include" 中来做筛选的话，将 "tag" 也进行了筛选 https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241211/e5f9e201f2237660bdce92f0ffa8e123.png 想要得到的结果就是 "tag" 传入 "10" 或者 "11" 或者 "10和11" "tag" 都能返回图中的结果 有什么办法可以很简单的拿到呢

uni.saveImageToPhotosAlbum保存图片到本地微信相册，没有保存在系统默认相册？ 1是默认相册，2是微信相册，如何保存在1默认相册里面 https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241209/7c4a5180f0ad83ca42da4f7757137675.png

因为这是语法规定呀，...是与赋值运算符前面的做匹配的

在 python 里，3 / 4 = 0.75 。int(3) / int(4) = 0.75 。 但是 int(3 / 4) = 0 。 所以，cx = ax / a0 * 2 之后，int(cx) 跟 cx 可能不相等。但 float(cx) 和 cx 是相等的。

只有cookie和url参数

自己写一个，进度div居右，长度等于（总长度/100）*进度，圆点定位在进度div最右边，

"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241121/bd0211095d0648870a4f06b7c5352bc7.png) 如上图红圈中布局，怎么实现 1：如果三个都存在就如"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241121/3d881503b1c968060cf6813e7c4ea7af.png)这样显示。 2：如果“开卡建档”不存在就"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241121/0ee73281341c75f43323fa5d0d60daaa.png)这样显示。 3：如果“门诊充值”不存在就"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241121/37cf379ed5ba6f79265eba0c43008124.png)这样显示。 4：如果“缴费”不存就"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241121/2e71fb78b8b6f90f8470bfeb5cea53ad.png)这样显示。 5：如果“门诊充值”和“缴费”都不存在就"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241121/dbcaee2459c5d95758a51cf4ef32096f.png)这样显示。 方位不错就行，宽度不一定按画的。这样画是为了省劲儿。

amh在Debian 11 x64安装时报错。 --2023-11-16 07:33:36--"https://dl.amh.sh/amh.sh" (https://link.segmentfault.com/?enc=uLbERgrJJ2PDCS0qGOj1LQ%3D%3D.Wv9b01VD5gBaVf1zPcIkBgwif5D75CEllYuCmkSkusA%3D) Resolving dl.amh.sh (dl.amh.sh)... 45.79.70.161 Connecting to dl.amh.sh (dl.amh.sh)|45.79.70.161|:443... connected. ERROR: The certificate of ‘dl.amh.sh’ is not trusted. ERROR: The certificate of ‘dl.amh.sh’ has expired.

wangeditor富文本编辑器，如何隐藏工具栏，只显示文本内容 目前只实现工具栏禁用启用

你只要html的话,完全都不需要编译和脚手架,直接通过 cdn 引入 vuejs就行了 Button Try Element new Vue({ el: '#app', data: function() { return { visible: false } } }) 如果用vue3脚手架开发,html就正常部署也可以啊,直接正常开发编译一下不就成了,有什么问题吗

想起以前遇到过的一个问题，不知道大家有没有类似的经历，https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241114/25a6e585276e4162a66d1c3920559fa1.pnghttps://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241114/c0008732efdcecd7d881b8a9bfab06a4.png我从前置守卫中拿到to参数，在本地运行没有问题，发版测试环境就会报错 后来发现有一个灰色的constructor函数，不知道是不是这里的原因，把path和query这些需要的东西单独拿出来后就解决了，有没有佬能细说一下里面的原理

公司内网安装了安全软件（HUES），安装后，为什么百度云，微信，有道云笔记等软件就无法打开了？ 命令行启动exe文件，控制台输出空白，也不报错 有什么思路可以解决这个问题？

都有docker desktop了,为啥不用docker来使用centos ?

点击编辑配置 "image.png" (https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20241105/af8505085a06ec5623310fe6746b0c69.png) 点击，选择不执行任何操作 "image.png" (https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20241105/3ccabc7cf6d0888d68da06cc94616947.png) 这样就行了，再想有热更新的话 点击修改选项 "image.png" (https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20241105/c82d89fed3dbf14fb6f90a051f9021f9.png) 选择执行更新操作时 ，再根据需要选择相应的热更新操作。 "image.png" (https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20241105/ca3415d305a10e61836ad063968caf40.png)

因为不是固定版本，版本号前有一个 "^" 符号。如果要固定，删除前面的 "^" 符号，然后重新 "install" - "vue": "^3.3.4" + "vue": "3.3.4" 具体可以阅读这篇文章👇 "npm - package.json版本号规则" (https://segmentfault.com/a/1190000019935845)

关于uniapp获取位置的api，你可以查看uniapp官网，是通过uni.getLocation(OBJECT)来进行实现的,需要使用第三方服务商来进行授权，列如高德，百度，腾讯等地图开放平台,需填写三方地图服务平台的秘钥（key）。key配置：manifest.json ---> H5配置 ---> 定位和地图 ---> key。 推荐使用uni.getLocation时，指定 type 为 gcj02

typescript 中为什么推荐使用 unknown 代替 any 声明？ unknown 和 any 各自的作用

"image.png" (https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20241103/0e146ae970a4b319371ee585d30c8ed8.png) 修改package.json文件的这一行， 添加 export NODE_OPTIONS=--openssl-legacy-provider

"测试地址" (https://link.segmentfault.com/?enc=J%2BUXpIOOXe74NSLRIjhG5g%3D%3D.O4L1tD3FqmFlUR3gX8B%2FLS%2Bfc5Tp99tjbJGgk%2BtlCfuCV5suuuscMkD2Dk2ecKw1) 如何修改中心点？包括拖拽操作的中心。 我希望靠左一些。 *** 可以通过 "left: '±14%'", 达到效果。 但"right"为什么展示出来的状态如同无效一般呢？

我想知道这个ios端的操作栏真没解决办法吗？ 我将对应路由的push修改成replace也还是不行，请问各位大佬以及工作人员是如何处理的？劳驾"image.png" (https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20241029/a2de2bece846605eadb4fb343be14e2b.png)

依赖包的问题， 我在前期开发时候由于网不好下载不下来依赖包，就从别的博主项目里面复制的依赖包，但是没有复制 package。json文件。我本地的 是159版本，但是实际的包确实140的包。因此有这问题出现 正确版本 "three": "^0.140.2",

如何获取图片中的内容信息，内容可以是物品（我提供的一张图片），信息是图片中物品的数量和坐标？ 有个场景，我需要识别拍照图片中的内容信息，如图片中有几个车，几个人，它们的坐标是什么（相对图片）， 我搜索了过网上的图片识别开源库，但感觉都和我想要的结果不大匹配，有大佬告知吗？

接你上面的回答，"热更新"是通过 websocket 来实现的，只要开启了热更新，构建工具就会起一个 websocket 连接 这个和是否配置了本地代理没有关系，但你的代理配置确实影响了 ws，你的 "proxy" 配置了将 根路径下的所有请求都代理到了另一个服务，但这个 "ws" 连接是和 "构建工具" 起的本地服务 进行交互的，而你代理到的目标服务上显然也没有 "/ws" 这个路由，就造成了一直在 "失败重试" 而你的解决方案虽然能解决问题，但并不通用，假如业务上也有 websocket 需要代理，就搞不定了。通常前端会在请求前面加一个 "baseUrl"，proxy配置中代理这个 "baseUrl" 下的请求即可. 如果这个 baseUrl 不是目标服务需要的，通过 "rewrite" 将 "baseUrl" 剔除掉也就可以了

getDetail函数放在 react useEffect钩子中调用

你检查一下,怎么ecosystem.config.json 变文件夹了" /home/node/ecosystem.config.json/.nuxt/dist/server"

如题，百度都是用的systemctl、service 都不行，到底用的哪个命令启动？ "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241016/9104324f240397bdd12aa56d2e15f44c.png) "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241016/8348ae795ce86102ea4a7ba9c3a392c8.png) "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241016/36d7684d0c5eaa5ace58a5c77cda8420.png)

因为阿里云的云 Redis 根本不是 Redis，而是 Tair，只是兼容了 Redis 协议而已。 这种协议兼容的产品在业内其实挺多的，比如前几年火过一阵儿的 Dragonfly，它不但兼容了 Redis 协议、还兼容了 Memcached 协议。 *** 再补充一点，可能你会好奇它是怎样在兼容了 Redis 协议的基础上增加了账号。 原因很简单，它是把 Tair 这层的账号+密码，拼在一起作为了 Redis 协议里的密码。而跟账号相关的访问控制能力，由 Tair 提供，而不是 Redis 协议里带的。 «"https://help.aliyun.com/zh/redis/user-guide/logon-> methods" (https://link.segmentfault.com/?enc=Hg37mY03AsXigpDT%2FcXr4Q%3D%3D.4TJxZfEBpCwKkfWBnMCTI3KKP%2B1bg9n4Ld0ILJayj5dvQlwg6h7JgOUY67qHJvl%2FCLNOzB50CCY9mBrJpxmS%2Fw%3D%3D)» *** 继续补充。 "@vishun" (/u/vishun) 提到了 Redis 6.x 的新特性 ACL。但首先阿里云这个是从 4.X 开始就支持 ACL 了，所以显然不是利用了 Redis 本身的特性。 其次阿里云其实本身就是 Redis 社区的第二大贡献者（第一大当然是 Redis Labs，因为老祖宗 antirez 从 2019 年就不咋参与维护、2020 年直接官宣彻底退出项目了），现在 Redis 新版本里的很多特性就是阿里云在 Tair 项目里得到验证后反哺给 Redis 社区的。 所以虽然我没有具体去翻过 git log，但很有可能 Redis 6.x 里的 ACL 特性有一部分就来自于阿里云的贡献。 这也算是一个冷知识吧。

我自己写了一个弹窗组件，在一种情况下会报错，但是找不到报错原因。 打开弹窗后，在弹窗中使用ant-design-vue的图片预览功能，然后关闭弹窗时会报错。 "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241015/f918efbad387481bfcbc64872815de77.png) 弹窗代码如下： resetFields()"> --> {{title}} {{cancelText}} {{okText}} import { ref, reactive, watch, onBeforeMount, onBeforeUnmount } from 'vue' const mDialogWrapperRef = ref(); const mDialogRef = ref(); const emit = defineEmits(['update:visible', 'ok', 'cancel', 'closed']) const props = defineProps({ visible: { type: Boolean, default: false }, width: { type: String, default: '' }, maxWidth: { type: String, default: '' }, title: { type: String, default: '' }, footer: { type: Boolean, default: true }, showOk: { type: Boolean, default: true }, showCancel: { type: Boolean, default: true }, okText: { type: String, default: '确认修改' }, cancelText: { type: String, default: '暂不修改' }, // 确认按钮-加载中 okLoading: { type: Boolean, default: false }, // 点击蒙层是否允许关闭 maskClosable: { type: Boolean, default: true }, // 内容样式 bodyStyle: { type: Object, default: () => ({}) }, // 层级 - 如果设置了就是固定层级，如果不设置从最多层级1000开始往上加 zIndex: { type: Number, default: 0 }, // 是否加到body节点下 appendToBody: { type: Boolean, default: true }, // 当关闭 Dialog 时，销毁其中的元素 destroyOnClose: { type: Boolean, default: true }, // 为 Dialog 启用可拖拽功能 draggable: { type: Boolean, default: false } }) const _d = reactive({ show1: false, // 控制v-if show2: false, // 控制display show3: false, // 控制动画 zIndex: 1000, // 最低层级 width: !props.width && !props.maxWidth ? '400px' : props.width, // 宽度 maxWidth: props.maxWidth, // 最大宽度 // 拖动参数 drag: { // 是否点下 isDown: false, // 整个页面你最大宽高 pageWidth: 0, pageHeight: 0, // 弹窗宽高 dialogWidth: 0, dialogHeight: 0, // 左右最大移动距离 minX: 0, maxX: 0, minY: 0, maxY: 0, // 移动结果 resultX: 0, resultY: 0, // 鼠标点下是历史移动距离 startX: 0, startY: 0, // 鼠标点下时相对于page的位置 downX: 0, downY: 0, // 鼠标移动位置 moveX: 0, moveY: 0, } }) watch(() => props.visible, (newVal) => { setVisible(); }) onBeforeMount(() => { setVisible(); // 绑定鼠标事件 window.addEventListener('mousemove', dragMove); window.addEventListener('mouseup', dragUp); }) onBeforeUnmount(() => { // 如果appendToBody属性为true, 移除掉插入到body上面的弹框组件，别说这一点我都忘了，严谨 let $el = mDialogWrapperRef.value; if (props.appendToBody && $el && $el.parentNode) { $el.parentNode.removeChild($el); } // 解绑鼠标事件 window.removeEventListener('mousemove', dragMove); window.removeEventListener('mouseup', dragUp); }) // 设置显示状态 function setVisible () { if(props.visible) { new Promise((resolve, reject) => { if(!_d.show1) { // 第一次通过v-if添加节点到dom树 setZIndex(); _d.show1 = true; _d.show2 = true; setTimeout(() => { // 判断是否加到body节点下 if(props.appendToBody) { let lastChild = document.body.appendChild(mDialogWrapperRef.value); } setTimeout(() => { resolve(); }, 15); }, 15); } else { // 关闭后不删除节点，再显示弹窗 _d.show2 = true; setTimeout(() => { resolve(); }, 30); } }).then(() => { document.body.style.overflow = "hidden"; _d.show3 = true; }) } else { // 关闭弹窗 _d.show3 = false; // 关闭时动画效果 setTimeout(() => { _d.show2 = false; // 设置display:none if(props.destroyOnClose) { _d.show1 = false; // 通过v-if销毁节点 } document.body.style.overflow = ""; emit('closed'); }, 250) } } // 显示的时候设置z-index function setZIndex() { let max = 1000; // 判断是否有自定义的层级 if(props.zIndex) { max = props.zIndex; } else { let aMd = [...document.querySelectorAll('.m-dialog.show')]; aMd.forEach(obj => { let num = getStyle(obj, 'z-index'); if(max 0) { minX = 0; } if(minY > 0) { minY = 0; } if(maxX > _d.drag.pageWidth - _d.drag.dialogWidth) { maxX = _d.drag.pageWidth - _d.drag.dialogWidth; } if(maxY > _d.drag.pageHeight - _d.drag.dialogHeight) { maxY = _d.drag.pageHeight - _d.drag.dialogHeight; } _d.drag.minX = minX; _d.drag.maxX = maxX; _d.drag.minY = minY; _d.drag.maxY = maxY; // 开始位置 _d.drag.startX = _d.drag.resultX; _d.drag.startY = _d.drag.resultY; // 鼠标点下时相对于page的位置 _d.drag.downX = e.pageX; _d.drag.downY = e.pageY; } function dragMove(e) { if(!props.draggable) { return; } if(!_d.drag.isDown) { return; } // 移动距离 _d.moveX = e.pageX-_d.drag.downX; _d.moveY = e.pageY-_d.drag.downY; // 涉及结果位置 let resultX = _d.drag.startX+_d.moveX; let resultY = _d.drag.startY+_d.moveY; if(resultX _d.drag.maxX) { resultX = _d.drag.maxX; } if(resultY _d.drag.maxY) { resultY = _d.drag.maxY; } _d.drag.resultX = resultX; _d.drag.resultY = resultY; } // 鼠标抬起 function dragUp(e) { if(!props.draggable) { return; } if(!_d.drag.isDown) { return; } _d.drag.isDown = false; } // 获取节点到body的高度 function getDistanceBody (obj) { var oBody = document.body; var oHtml = document.documentElement; var oParent = null; var oDistance = { top: 0, left: 0 } do { oDistance.top += obj.offsetTop; oDistance.left += obj.offsetLeft; oParent = obj.offsetParent; obj = oParent; } while(oParent && oParent != oBody && oParent != oHtml) return oDistance; } .m-dialog-wrapper { position: fixed; z-index: 1000; top: 0; right: 0; left: 0; bottom: 0; background: rgba(0,0,0,0.25); transition: opacity .25s; opacity: 0; overflow: auto; &.show { opacity: 1; .m-dialog { transform: scale(1); } } &.is-drag { -moz-user-select:none; /*火狐*/ -webkit-user-select:none; /*webkit浏览器*/ -ms-user-select:none; /*IE10*/ -khtml-user-select:none; /*早期浏览器*/ user-select:none; .m-dialog-title { cursor: move; } } .m-dialog-modal { display: table; padding: 20px 0 40px; min-height: 100%; min-width: 100%; box-sizing: border-box; } .m-dialog-cell { display: table-cell; vertical-align: middle; } .m-dialog-container { margin: 0 auto; } .m-dialog { position: relative; z-index: 2; border-radius: 2px; overflow: hidden; background: #fff; transition: transform .25s; transform: scale(0.9); box-shadow: 0 3px 6px -4px #0000001f, 0 6px 16px #00000014, 0 9px 28px 8px #0000000d; .m-dialog-title { position: relative; box-sizing: border-box; padding: 16px 24px; border-bottom: 1px solid #f0f0f0; color: #000; font-size: 16px; line-height: 22px; word-wrap: break-word; min-height: 55px; .m-dialog-close { position: absolute; top: 50%; right: 0; margin-top: -27px; width: 54px; height: 54px; display: flex; justify-content: center; align-items: center; font-size: 16px; color: #666; cursor: pointer; &:hover { color: #333; } } } .m-dialog-content { padding: 24px; min-height: 100px; } .m-dialog-footer { padding: 10px 16px; text-align: right; background: transparent; border-top: 1px solid #f0f0f0; border-radius: 0 0 2px 2px; .btn { padding: 4px 15px; font-size: 14px; color: #333; border: 1px solid #d9d9d9; background: #fff; height: 32px; font-weight: 400; cursor: pointer; outline: medium; border-radius: 2px; &:not(:last-child) { margin-right: 8px; } } } } } 项目地址："codesandbox上测试项目" (https://link.segmentfault.com/?enc=UZXd7qH%2BzJPxJDT1puB%2Fwg%3D%3D.ViozVakQmKUtVxf8ri6FRsTDRT01XS%2Fdt2HEwO0Z1YFeAg5yhpYjdk6GaCfdiyoTMz2q2k%2Bt5FivNE%2BOzDt6CA%3D%3D) 如果将配置项（:appendToBody="false"）设置为false，不添加到body下，使用是没有问题的。设置为true，添加到body后，使用了预览图片功能，之后就会报错。 希望有人帮忙找出报错原因，及解决办法

SpringCloud微服务运维最佳实践，如何动态定义各种启动参数？ «笔者是一名Java服务端程序员，学习微服务后，在部署时发现过程复杂，且做的重复工作非常多，因此学习基本运维。目标是，使用Kubernetes和容器技术进行微服务编排和部署。» 本文只讨论服务容器化，不涉及K8s和Jenkins相关内容。 问题概述 在服务容器化时，一些参数必须动态传入，以适应不同的部署环境。变化的参数包括： * 部署环境（开发环境、测试环境、预发环境、生成环境） * 服务版本（0.0.1、1.0.2、1.0.1-beta） * 服务发现（部署时将服务注册到注册中心如Nacos） 我的Java项目（Example）由多个微服务构成：如Example-core，Example-auth，Example-gateway等。以Example-auth这个微服务作为切入点，打包为Docker容器的代码为： # 使用官方的OpenJDK 17作为基础镜像 FROM openjdk:17 # 镜像环境变量： # 开发环境：dev # 测试环境：test # 预发环境：staging # 生产环境：prod, 默认生产环境 ARG ENVIRONMENT=prod # Jar包的版本，默认0.0.1-SNAPSHOT ARG JAR_VERSION=0.0.1-SNAPSHOT # 注册中心服务地址 ARG SERVER_NAME=www.nacos-server.cn # 维护者 MAINTAINER xlxing@bupt.edu.cn # 拷贝文件到Docker容器中 COPY target/auth-${JAR_VERSION}.jar /app/auth-${JAR_VERSION}.jar # 暴露服务端口 EXPOSE 8999 # 容器启动项 ENTRYPOINT ["java", "-jar", "/app/auth-${JAR_VERSION}.jar", "--spring.profiles.active=${ENVIRONMENT}", "--spring.cloud.nacos.discovery.ip=${SERVER_NAME}"] 在构建容器时可以动态传入参数（jar包版本为1.1.0，环境是dev，服务发现地址www.my-auth.cn，构建的容器命名为myapp/example:auth-dev-1.1.0）： docker build --build-arg JAR_VERSION=1.1.0 ENVIRONMENT=dev SERVER_NAME=www.my-auth.cn -t myapp/example:auth-dev-1.1.0 . 该内容产生了以下两个具体问题： 1. 如何动态获取JAR_VERSION 在构建项目时，仍然需要手动传入项目版本，实际上该信息存在于项目中，如该微服务auth的pom.xml文件： auth 0.0.1-SNAPSHOT auth 权限微服务 理想情况是：后端程序员来定义项目的版本，而流水线只需要依赖项目即可。 但是在当前情况下：当auth项目的version变更时，构建Docker镜像的指令也需要同步变化。该问题可以总结为，构建容器时如何从项目中获取JAR_VERSION？ docker build --build-arg JAR_VERSION=1.1.0 ENVIRONMENT=dev SERVER_NAME=www.my-auth.cn -t myapp/example:auth-dev-1.1.0 . 2. 如何自动获取宿主机的SERVER_NAME 微服务启动时，将该服务注册到Nacos上，声明自己的服务地址。当部署到具体的服务器上时，该地址才被绑定，如auth服务可以部署在server-a上，也可以部署到server-b上。如何在运行时 确定服务地址而不是构建时 。 补充内容： auth服务的配置文件 spring: application: name: auth # Nacos配置 cloud: nacos: server-addr: www.nacos-server.cn # 服务发现 discovery: cluster-name: BEIJING # 设置为非临时实例 ephemeral: true # 设置命名空间 namespace: e35500e1-2441-4001-b60f-3f7d55bxxxxx # 配置中心 config: file-extension: yaml # 文件后缀名 namespace: e35500e1-2441-4001-b60f-3f7d55bxxxxx group: DEFAULT_GROUP dubbo: # 将Dubbo注册到Nacos中，这样可供消费者直接使用 application: name: dubbo-auth protocol: name: dubbo port: -1 registry: address: nacos://www.nacos-server.cn?namespace=228df068-54b7-405e-9e32-72c759d79ed9 group: DEV_DUBBO_GROUP 拓展问题：使用K8s和容器在分布式环境下部署微服务项目最佳实践？ 其中涉及到很多配置相关的问题，缺乏一个系统性的文章探讨如何部署和运维。 一些尝试： 1. 我有两台服务器A和B，我在部署前已经计划将auth服务部署到B上，因此构建时参数SERVER_NAME=B，构建好的容器无法直接在其他服务器上启动。 一条可行的方法是，在构建容器时不指定SERVER_NAME，在"docker run"时动态传入参数。 "ARG SERVER_NAME=www.nacos-server.cn" 改为"ENV SERVER_NAME=www.nacos-server.cn" 2. JAR_VERSION目前是手动更改。 *** 第一个问题： 我们在构建开发流水线的时候，会写一个脚本（比如Jenkins）。类似于这样的一个过程： 1. 从pom.xml中获取version值，记为VERSION 2. 使用脚本更改Dockerfile中的JAR_VERSION，此时Dockerfile中的JAR_VERSION=${VERSION} 3. 生成新的Docker Image，例如 "docker build -t myapp/auth:${VERSION} ." 总的来说，我们无法直接在Dockerfile中获取pom.xml中的VERSION，但是可以在流水线脚本中往Dockerfile中插入静态值。 第二个问题： 我们可以将流水线部署分为两个部分，构建 和部署 你的回复没有解决部署 时的环境变量问题，SERVER_NAME是与所属的服务器相关的，在使用K8s时构建的配置文件如k8s-prod.yaml中，env也是一些动态参数。使用环境变量只是解决了可以在运行时变更参数的作用。 比如k8s架构有3个子节点k8s-node01、k8s-node02、k8s-node03，在部署的时候将auth这个微服务部署到哪一个节点，对运维工程师来说是透明的。 此时想到了一个笨重的方法：在k8s-node01、k8s-node02、k8s-node03的系统中提前准备好环境变量MY_IPV4，然后在"docker run"的时候参数除了在k8s的yaml文件中定义，也可以从服务器的环境变量中获取。例如，gateway将auth服务路由到"lb://auth"，而"lb://auth"信息是从注册中心拿到的，如"http://111.229.38.208:8999"。 在传统的微服务部署中，我可以基本使用nacos作为注册中心使用。K8s中的注册中心原理是DNS服务器。我现在尝试将传统微服务半自动化部署迁移到k8s部署上来，对于服务注册与发现可能有一些理解不充分。希望前辈指正。 主要问题是：传统部署微服务时，微服务启动时总是将自身（自身所在节点的ip）注册到Nacos，如何使得微服务部署是无状态的。 spring: application: name: gateway cloud: # SpringCloudGateway配置 gateway: default-filters: # http请求的Header中增加 k, v - AddRequestHeader=gateway-env, gateway-dev # 前端个请求uri会拼接一个版本前缀发送到特定的服务 routes: - id: auth uri: lb://auth filters: # 服务版本前缀 - PrefixPath=/api/v1 predicates: - Path=/auth/** - id: multimedia uri: lb://multimedia filters: - PrefixPath=/api/v1 predicates: - Path=/multimedia/** - id: core uri: lb://core filters: - PrefixPath=/api/v1 predicates: - Path=/core/** # Gateway不使用Servlet而是WebFlux main: web-application-type: reactive # 微服务分布式鉴权专用Redis # Gateway和Auth共享一个权限管理Redis数据库 data: redis: client-type: lettuce database: 0 host: www.xingxiaolin.cn port: 6379 lettuce: pool: enabled: true max-active: 8 max-idle: 8

搞定了： int alternatingSubarray(int* nums, int numsSize){ int maxlength = -1,currentlength = 1; int i = 1,t = 1,flag = 0; for(i = 1;i maxlength) maxlength = currentlength; } if(maxlength == 1 && flag != 1) return -1; return maxlength; } for循环里面的第一个if判断加一个 t = 1就行了。

"el-image" 的懒加载是有条件的：存在属性 "overflow: auto;" 或者 scroll 的父级元素，且通过滚动时间触发。 在 "el-carousel" 中使用有问题，是 element-ui 的问题，他在判断是否需要加载时，是通过 "isInContainer" 方法。这个方法在获取 "display: none;" 元素下的元素位置数据时 ，是通过 "getBoundingClientRect()" 方法获取，这是全部位置数据为 0 。所以这里判断出了问题："https://github.com/ElemeFE/element/blob/290e68ea6aa6c56b7d83182b650e3be4f77ff1b0/packages/image/src/main.vue#L167" (https://link.segmentfault.com/?enc=yXpl%2Bse91sIeiUIjI%2FUrrQ%3D%3D.HYqZrpRuXgcKv5tHhkKeABPTE5MAJY6Tb5mEoHuCHXCe6W9CkBnaMpTR6%2FmR%2FXI2Sgwu2WfZ63TLlDfQEKUhfqbt8xPwDr4zncKMUnJ5ZiUxNquKIQzadZRo7WMEu%2F9OY6i61cgucCWDVjswyIsoDPE4Sy3jB2Itvaxg5RyRnBI%3D) 。 解决方法也很简单： * 方案1：不使用 "lazy" 属性，因为这里没啥用，"el-carousel" 默认渲染了全部的 "el-carousel-item"，没起到懒加载的作用。 * 方案2：监听 "el-carousel" 当前的索引，动态的设置 "el-image" 的src 或者 lazy属性。

这是 yarn add 命令的特性，执行时会检查 package.json 和相关lock文件，以方便其他人能直接使用。 参考官方文档："https://classic.yarnpkg.com/en/docs/cli/add#toc-adding-depend..." (https://link.segmentfault.com/?enc=oqZ2edAVvMpyB%2FYSrOUNIg%3D%3D.iN%2Bh2pDk%2BJfkvZ1Da4aqqkLD320R4WSmJG4UctKK2oOV7wiLT1Ha11ycG%2B62Y0xmO3Ipj7wgqSpqMnCB91Ou0UZFf0W4v1sw1EM7l7Az9MjaXZGZLwOc9l4pJ6SMIrwN4leQ2gJaV6NF%2BBF2qY39azZhtvlcfd5UJAWDydOOW0ahwLmKXKuQ9utLbENzOJ7iOG3X08ecuwnQ2nn%2FxTkmIQxityk4JpJiBnIfOsUnZDWOz6TjBF6%2FWXJAQA6q3yI8cXTblsww5%2BnkYLKy1oHai2t8dWxwvGneVK7ifvlaspJcLCk3OJEer1HBvgFah1cAvhHNfFP4Woh9vJxI6FO8ruflGz2%2BfmI0RyW%2BxqDICVMyG%2BNkTU1r8INg8dy5vh9PA3e2Z4vINBlBOFbqZUDrr%2FB%2FnLLg%2BaznfFT0hTNFwP8%3D)

两种方式来实现。 1. 一种是层层传值 在顶级组件 A 组件中用 "const [value, setValue] = useState("")"来存储textarea中的值，然后将value和 setValue传递到D组件中，同时将value给到C组件，这样C组件就能获取到textarea中的值了。 "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241012/044b07d10600a5c5425c5a2600482dbd.png) 2. React中的context React中自带处理上下文的hook，可以把A组件中的 value 和 setValue 传递到任意的子组件。 1. 先用 "createContext()" 来创建生产者，这个来包裹住所有要用到更新数据的组件； 2. 用 "useContext()" 或 "Consumer" 来使用数据； const { useState } = require("react"); // store.js const TextareaContext = React.createContext(""); // 传入初始值，这里只存储textarea的值，因此可以默认是空字符窜 // A组件中 const AppA = () => { const [value, setValue] = useState(""); // 把 value 和 setValue 传递过去 return ( ); }; // B组件中不用任何处理，直接引用即可 // D组件 const AppD = () => { const { value, setValue } = useContext(TextareaContext); return ; }; // C组件 const AppC = () => { const { value } = useContext(TextareaContext); return alert(value)}>get; };