【autodesk】浏览器中渲染rvt模型

使用Forge完成渲染

Forge是什么 为什么能够渲染出来rvt模型

  • Forge是由Autodesk开发的一套云端开发平台和工具集。
  • 在Forge平台中，有一个名为"Model Derivative"的服务，它可以将包括RVT（Revit）在内的多种BIM（Building Information Modeling）文件格式转换为可在Web上浏览和渲染的格式。
  • 具体来说，"Model Derivative"服务可以将RVT（Revit）文件转换为SVF（Scalable Vector Graphics）格式。
  • SVF是一种基于Web的轻量级3D模型表示格式，可以实现高性能的3D模型渲染和交互。通过将RVT文件转换为SVF格式，可以在Web端使用Forge提供的Viewer组件加载和展示RVT模型

Forge与Autodesk的关系

  • Autodesk是一家设计软件公司，Forge可以视为Autodesk的云端扩展

渲染步骤：

首先要注册autodesk平台，并创建项目 获取自己的client_id与client_secret

官网地址：Autodesk Platform Services (formerly Forge)

如下图：

配置postman环境 

下面我们演示通过postman上传模型到Forge云端，然后配置Forge的js渲染出来

post环境文件：

BIM.postman collection.json

{"info": {"_postman_id": "aedeb5db-ab5a-4b0e-ba31-d329f6ef66ba","name": "Beijing-Workshop","schema": "https://schema.getpostman.com/json/collection/v2.0.0/collection.json","_exporter_id": "24665034"},"item": [{"name": "1获取access token","event": [{"listen": "test","script": {"exec": ["var data = JSON.parse(responseBody);","postman.setEnvironmentVariable(\"access_token\", data.access_token);","postman.setEnvironmentVariable(\"expires_in\", data.expires_in);","postman.setEnvironmentVariable(\"token_type\", data.token_type);"],"type": "text/javascript"}}],"request": {"method": "POST","header": [{"key": "Content-Type","value": "application/x-www-form-urlencoded"}],"body": {"mode": "urlencoded","urlencoded": [{"key": "client_id","value": "{{client_id}}","type": "text"},{"key": "client_secret","value": "{{client_secret}}","type": "text"},{"key": "grant_type","value": "client_credentials","type": "text"},{"key": "scope","value": "data:read data:write bucket:create bucket:read","type": "text"},{"key": "expires_in","value": "360000","type": "text"}]},"url": "{{base_domain}}/authentication/v1/authenticate"},"response": []},{"name": "2创建的存储桶（bucket）","event": [{"listen": "prerequest","script": {"exec": ["if (request.data) {","    var requestData = JSON.parse(request.data);","    postman.setEnvironmentVariable(\"bucketKey\", requestData.bucketKey);","    postman.setEnvironmentVariable(\"bucketPolicy\", requestData.policyKey);","}"],"type": "text/javascript"}}],"request": {"method": "POST","header": [{"key": "Authorization","value": "Bearer {{access_token}}"},{"key": "Content-Type","value": "application/json"}],"body": {"mode": "raw","raw": "{\n  \"bucketKey\":\"ac-persistent-bucket-test8\",\n  \"policyKey\":\"persistent\"\n}"},"url": "{{base_domain}}/oss/v2/buckets"},"response": []},{"name": "3 查看bucket是否创建成功","request": {"method": "GET","header": [{"key": "Authorization","value": "Bearer {{access_token}}"}],"url": {"raw": "{{base_domain}}/oss/v2/buckets?limit=10","host": ["{{base_domain}}"],"path": ["oss","v2","buckets"],"query": [{"key": "limit","value": "10"}]}},"response": []},{"name": "4往bucket里放置object模型","event": [{"listen": "test","script": {"exec": ["if (responseCode.code === 200) {","    var data = JSON.parse(responseBody);","    postman.setEnvironmentVariable(\"urn\", data.objectId);","    postman.setEnvironmentVariable(\"urnBase64\", window.btoa(data.objectId));","    postman.setEnvironmentVariable(\"file_location\", data.location);","}",""],"type": "text/javascript"}}],"request": {"method": "PUT","header": [{"key": "Authorization","value": "Bearer {{access_token}}"}],"body": {"mode": "file","file": {"src": "/C:/Users/ac135/Desktop/rvtText/data/textOne.rvt"}},"url": "{{base_domain}}/oss/v2/buckets/{{bucketKey}}/objects/aggregate-1.rvt"},"response": []},{"name": "5检查对象模型是否成功上传","request": {"method": "GET","header": [{"key": "Authorization","value": "Bearer {{access_token}}"}],"url": "{{base_domain}}/oss/v2/buckets/{{bucketKey}}/objects"},"response": []},{"name": "6将模型在云端转换成SVF格式","event": [{"listen": "test","script": {"exec": ["var data = JSON.parse(responseBody);","","var setEnvVar = function (tar, src) {","    if (!src) {","        return;","    }","    postman.setEnvironmentVariable(tar, src);","}","","if (data) {","    if (data.urn) {","        setEnvVar(\"urnBase64\", data.urn);","    }","}"],"type": "text/javascript"}}],"request": {"method": "POST","header": [{"key": "Authorization","value": "Bearer {{access_token}}"},{"key": "Content-Type","value": "application/json"},{"key": "x-ads-force","value": "true"}],"body": {"mode": "raw","raw": "{\n    \"input\": {\n        \"urn\": \"{{urnBase64}}\" \n    },\n    \"output\": {\n        \"destination\": {\n            \"region\": \"us\"\n        },\n        \"formats\": [\n        {\n            \"type\": \"svf\",\n            \"views\":[\"2d\", \"3d\"]\n        }]\n    }\n}"},"url": "{{base_domain}}/modelderivative/v2/designdata/job"},"response": []},{"name": "7检查模型是否转化完成","request": {"method": "GET","header": [{"key": "Authorization","value": "Bearer {{access_token}}"},{"key": "Accept","value": "application/vnd.api+json,application/json"}],"url": "{{base_domain}}/modelderivative/v2/designdata/{{urnBase64}}/manifest"},"response": []},{"name": "04-POST job","event": [{"listen": "test","script": {"type": "text/javascript","exec": ["var data = JSON.parse(responseBody);","","","if (data) {","    if (data.urn) {","        postman.setEnvironmentVariable(\"urnBase64\", data.urn);","    }","}"]}}],"request": {"method": "POST","header": [{"key": "Authorization","value": "Bearer {{access_token}}"},{"key": "Content-Type","value": "application/json"},{"key": "x-ads-force","value": "true"}],"body": {"mode": "raw","raw": "{\n    \"input\": {\n        \"urn\": \"{{urnBase64}}\" \n    },\n    \"output\": {\n        \"destination\": {\n            \"region\": \"us\"\n        },\n        \"formats\": [\n        {\n            \"type\": \"svf\",\n            \"views\":[\"2d\", \"3d\"]\n        }]\n    }\n}"},"url": "{{base_domain}}/modelderivative/v2/designdata/job"},"response": []},{"name": "06-GET metadata","request": {"method": "GET","header": [{"key": "Authorization","value": "Bearer {{access_token}}"}],"url": "{{base_domain}}/modelderivative/v2/designdata/{{urnBase64}}/metadata"},"response": []},{"name": "07-GET metadata/​:guid","request": {"method": "GET","header": [{"key": "Authorization","value": "Bearer {{access_token}}"},{"key": "Accept-Encoding","value": "gzip"}],"url": "{{base_domain}}/modelderivative/v2/designdata/{{urnBase64}}/metadata/{{metadata_guid}}"},"response": []},{"name": "08-GET :urn/metadata/:guid/properties","request": {"method": "GET","header": [{"key": "Authorization","value": "Bearer {{access_token}}"}],"url": "{{base_domain}}/modelderivative/v2/designdata/{{urnBase64}}/metadata/{{metadata_guid}}/properties"},"response": []},{"name": "09-bucket details","event": [{"listen": "test","script": {"type": "text/javascript","exec": ["if (responseCode.code === 200 && responseBody) {","    var data = JSON.parse(responseBody);","    postman.setEnvironmentVariable(\"bucketKey\", data.bucketKey);","}"]}}],"request": {"method": "GET","header": [{"key": "Authorization","value": "Bearer {{access_token}}"}],"url": "{{base_domain}}/oss/v2/buckets/{{bucketKey}}/details"},"response": []},{"name": "12-GET formats","request": {"method": "GET","header": [{"key": "Authorization","value": "Bearer {{access_token}}"}],"url": "{{base_domain}}/modelderivative/v2/designdata/formats"},"response": []}]
}

BIM.postman environment,.json

{"id": "63cf71cf-bae6-411f-8e53-7319cf62fd9a","name": "Beijing-Workshop","values": [{"key": "base_domain","value": "https://developer.api.autodesk.com","type": "text","enabled": true},{"key": "client_id","value": "xxxxxxxxx","type": "text","enabled": true},{"key": "client_secret","value": "xxxxxxxxxxx","type": "text","enabled": true},{"key": "urnBase64","value": "dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6YWMtcGVyc2lzdGVudC1idWNrZXQtdGVzdDMvYWdncmVnYXRlLTEucnZ0","type": "text","enabled": true},{"key": "access_token","value": "eyJhbGciOiJIUzI1NiIsImtpZCI6Imp3dF9zeW1tZXRyaWNfa2V5In0.eyJjbGllbnRfaWQiOiJNbDhXdWJFdW52WVRaRk1za2xpQ200YnZCM0dkREVibyIsImV4cCI6MTUyNjExNDc3OCwic2NvcGUiOlsiZGF0YTpyZWFkIiwiZGF0YTp3cml0ZSIsImJ1Y2tldDpjcmVhdGUiLCJidWNrZXQ6cmVhZCJdLCJhdWQiOiJodHRwczovL2F1dG9kZXNrLmNvbS9hdWQvand0ZXhwNjAiLCJqdGkiOiIxMEV2aEVpcGhQMGszTm9FNkFOa2NnR1pKOVJUaUhDazA3dXhWMDFFc1R1M2twS2tVNnB4a2d5d3A5QXBFakpDIn0.prPXmCc9e1oxZcPFSEgPOlonHG8po16RdzDciborQlg","type": "text","enabled": true},{"key": "guid","value": "57873878-6d98-b389-aa22-fead1053823f","type": "text","enabled": true},{"key": "bucketKey","value": "xiaodong-persistent-bucket-test8","type": "text","enabled": true},{"key": "guid","value": "e22cc916-cabd-4b97-9ccd-1ab1e613f707","type": "text","enabled": true},{"key": "objectKey","value": "RevitNative.rvt","type": "text","enabled": true},{"key": "expires_in","value": "3599","type": "text","enabled": true},{"key": "token_type","value": "Bearer","type": "text","enabled": true},{"key": "bucketPolicy","value": "persistent","type": "text","enabled": true},{"key": "urn","value": "urn:adsk.objects:os.object:xiaodong-persistent-bucket-test8/workshop-2.rvt","type": "text","enabled": true},{"key": "file_location","value": "https://developer.api.autodesk.com/oss/v2/buckets/xiaodong-persistent-bucket-test8/objects/workshop-2.rvt","type": "text","enabled": true}],"_postman_variable_scope": "environment","_postman_exported_at": "2023-07-15T15:06:21.850Z","_postman_exported_using": "Postman/10.16.0"
}

 client_secret与client_id记住改成自己的，然后就开始用postman请求上传了

获取access token

https://developer.api.autodesk.com/authentication/v1/authenticate

是用于获取 Autodesk API 的访问令牌（access token）的认证

请求中包含必要的认证信息

  • 客户端 ID（client_id）
  • 客户端密钥（client_secret） 
  • grant_type：授权类型，通常为 "client_credentials"（客户端凭据模式）
  • scope：请求的权限范围，用空格分隔多个权限（如 "data:read data:write"）
  • expires_in：设置合适的过期时间，单位毫秒

响应结果：

创建 Autodesk Forge 中的存储桶（bucket） 

https://developer.api.autodesk.com/oss/v2/buckets

请求中包含必要的认证信息:

  • Authorization：Authorization: Bearer {{access_token}}
  • bucketKey：存储桶的唯一标识符，它必须是全局唯一的。可以使用小写字母、数字、连字符 - 和下划线 _ 来命名。长度应在3到128个字符之间。
  • policyKey：存储桶的访问策略。默认为 transient，表示存储桶中的对象在30天后过期； persistent，表示永久保存

 响应结果：

 查看bucket是否创建成功

https://developer.api.autodesk.com/oss/v2/buckets

请求中包含必要的认证信息:

  • Authorization：Authorization: Bearer {{access_token}}

请求可选的参数信息:

  • limit：指定要返回的存储桶数量的限制。例如，返回最多 10 个存储桶，默认为 10

 响应结果：

 往bucket里放置object模型

https://developer.api.autodesk.com/oss/v2/buckets/{bucketKey}/objects/{objectName}

 请求中包含必要的认证信息:

  • Authorization：Authorization: Bearer {{access_token}}
  • 选择需要放置的rvt模型
  • objectName：每个文件在存储桶中都有一个唯一的标识符

 响应结果：

 检查对象模型是否成功上传到 Autodesk Forge 存储桶（bucket）中

https://developer.api.autodesk.com/oss/v2/buckets/{{bucketKey}}/objects

请求中包含必要的认证信息:

  • Authorization：Authorization: Bearer {{access_token}}
  • bucketKey：查询的存储桶的实际标识符

 响应结果：

将模型在云端转换成SVF格式 

https://developer.api.autodesk.com/modelderivative/v2/designdata/job

请求中包含必要的认证信息:

  • Authorization：Authorization: Bearer {{access_token}}
  • input：指定要转换的对象的 URN（Uniform Resource Name）。将 object_id 的 URN 作为输入。
  • output：指定要生成的输出格式和文件类型。在这里，你可以指定 SVF 格式作为输出。例如，{"formats": [{"type": "svf", "views": ["2d", "3d"]}]}

备注：input中的urn是 objectId转化为Base64格式

响应结果：

检查模型是否转化完成

https://developer.api.autodesk.com/modelderivative/v2/designdata/{base64_urn}/manifest

请求中包含必要的认证信息:

  • Authorization：Authorization: Bearer {{access_token}}
  • base64_urn：经过 Base64 编码的 URN

响应结果：

 图一表示进度，图二代表成功

浏览器渲染：

html渲染模板   将accessToken与documentId替换掉就行

<!DOCTYPE html>
<html><head><title>Autodesk Forge: 3D Viewer App Sample</title><meta http-equiv="cache-control" content="max-age=0" /><meta http-equiv="cache-control" content="no-cache" /><meta http-equiv="expires" content="0" /><meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" /><meta http-equiv="pragma" content="no-cache" /><!-- Third Party package --><script src="https://code.jquery.com/jquery-3.3.1.min.js"></script><!-- Autodesk Forge Viewer files (IMPORTANT) --><link rel="stylesheet" href="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.51/style.min.css"type="text/css"><script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.51/viewer3D.min.js"></script><style>/** Just simple CSS styling to make this page a little nicer **/body {margin: 0;padding: 0;}</style>
</head><body><!-- The Viewer will be instantiated here --><div id="MyViewerDiv"></div><!-- Custom script --><script>var viewer;var options = {env: 'AutodeskProduction',api: 'derivativeV2', // TODO: for models uploaded to EMEA change this option to 'derivativeV2_EU'// getAccessToken: getForgeTokenaccessToken: 'eyJhbGciOiJSUzI1NiIsImtpZCI6IlU3c0dGRldUTzlBekNhSzBqZURRM2dQZXBURVdWN2VhIiwicGkuYXRtIjoiN3ozaCJ9.eyJzY29wZSI6WyJkYXRhOnJlYWQiLCJkYXRhOndyaXRlIiwiYnVja2V0OmNyZWF0ZSIsImJ1Y2tldDpyZWFkIl0sImNsaWVudF9pZCI6IkpCcldjc3p3RVZCQ0dNMm5sY1J6N0tIZXZTbXpYUXM0IiwiYXVkIjoiaHR0cHM6Ly9hdXRvZGVzay5jb20vYXVkL2Fqd3RleHA2MCIsImp0aSI6ImJjWXBRalcwekh5aTZyUEd3QU1kNjdjamlWS1Q2dDZIYXNqcjFmOXR4OUExeGhZY05JWkhINVlibkdDeHVaTWoiLCJleHAiOjE2ODk5MTI0ODB9.JdpIFQAmWmsGc-t2g3tpU677G1Y11RwF4ndTxbwSa4hE5tOjYtLsMK7pR-jGGWIHAEHUkScvDixQWFIUG_o5UWpwhAdH7r06126QhGFNk_Wf1d8OvoDknqdKt9aXns_1xvxucOdPs3VkJ8BWH6j65B3fxZ7GB5jub3zeF7sGuYd1zBL9FdAcQ5_uQUBpEXh8uP4yZ_Y3yDe_mnTx2OxTMyRXsHw7quWjtxXDQXweGq0xDn3ENayOTkYnsru3_GJmGXUE4b-Zl1csHENJyyegkDqrfbaLbMeKagCWxY-RnCikmg80iWDqOd6KvIejRbQdqpjdQWz4i3Qx6Wnj6Lzf4w'};// var documentId = 'urn:' + getUrlParameter('urn');var documentId = 'urn:dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6YWMtcGVyc2lzdGVudC1idWNrZXQtdGVzdDMvYWdncmVnYXRlLTEucnZ0'// 初始化和加载文档的部分Autodesk.Viewing.Initializer(options, function onInitialized() {// Find the element where the 3d viewer will live.    var htmlElement = document.getElementById('MyViewerDiv');if (htmlElement) {// Create and start the viewer in that element    viewer = new Autodesk.Viewing.GuiViewer3D(htmlElement);viewer.start();// Load the document into the viewer.Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);$('.adsk-viewing-viewer').css('height', '80%')$('.adsk-viewing-viewer').css('width', '42%')}});/*** 加载模型的回调函数*/function onDocumentLoadSuccess(doc) {// Load the default viewable geometry into the viewer.// Using the doc, we have access to the root BubbleNode,// which references the root node of a graph that wraps each object from the Manifest JSON.var viewable = doc.getRoot().getDefaultGeometry();if (viewable) {viewer.loadDocumentNode(doc, viewable).then(function (result) {console.log('Viewable Loaded!');}).catch(function (err) {console.log('Viewable failed to load.');console.log(err);})}}/*** 文档加载失败时的回调函数*/function onDocumentLoadFailure(viewerErrorCode) {console.error('onDocumentLoadFailure() - errorCode: ' + viewerErrorCode);jQuery('#MyViewerDiv').html('<p>Translation in progress... Please try refreshing the page.</p>');}</script>
</body></html>

效果图如下：

其他资源分享：

视频教程：通过Forge十分钟实现Web端3D模型浏览_哔哩哔哩_bilibili

有其他问题可以留言 或者私信 

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/71123.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

98. 验证二叉搜索树

98. 验证二叉搜索树

给你一个二叉树的根节点 root &#xff0c;判断其是否是一个有效的二叉搜索树。 有效 二叉搜索树定义如下&#xff1a; 节点的左子树只包含 小于 当前节点的数。节点的右子树只包含 大于 当前节点的数。所有左子树和右子树自身必须也是二叉搜索树。 示例 1&#xff1a; 输入&am…
阅读更多...
嵌入式学习笔记（17）代码重定位实战 上篇

嵌入式学习笔记（17）代码重定位实战 上篇

3.5.1任务&#xff1a;在iSRAM中将代码从0xd0020010重定位到0xd0024000 注解&#xff1a;本练习对代码本身运行无实际意义&#xff0c;我们做这个重定位纯粹是为了练习重定位技能。但是某些情况重定位就是必须的&#xff0c;譬如在uboot中。 3.5.2思路 &#xff08;1&#xff…
阅读更多...
蓝队追踪者工具TrackAttacker，以及免杀马生成工具

蓝队追踪者工具TrackAttacker，以及免杀马生成工具

蓝队追踪者工具TrackAttacker&#xff0c;以及免杀马生成工具。 做过防守的都知道大HW时的攻击IP量&#xff0c;那么对于这些攻击IP若一个个去溯源则显得效率低下&#xff0c;如果有个工具可以对这些IP做批量初筛是不是更好&#xff1f; 0x2 TrackAttacker获取 https://githu…
阅读更多...
如何从ChatGPT中获得最佳聊天对话效果

如何从ChatGPT中获得最佳聊天对话效果

从了解ChatGPT工作原理开始&#xff0c;然后从互动中学习&#xff0c;这是一位AI研究员的建议。 人们利用ChatGPT来撰写文章、论文、生成文案和计算机代码&#xff0c;或者仅仅作为学习或研究工具。然而&#xff0c;大多数人不了解它的工作原理或它能做什么&#xff0c;所以他…
阅读更多...
电商3D资产优化管线的自动化

电商3D资产优化管线的自动化

如果你曾经尝试将从 CAD 程序导出的 3D 模型上传到 WebGL 或 AR 服务&#xff0c;那么可能会遇到最大文件大小、永无休止的进度条和糟糕的帧速率等问题。 为了创作良好的在线交互体验&#xff0c;优化 3D 数据的大小和性能至关重要。 这也有利于你的盈利&#xff0c;因为较小的…
阅读更多...
2023高教社杯全国大学生数学建模竞赛选题建议

2023高教社杯全国大学生数学建模竞赛选题建议

如下为C君的2023高教社杯全国大学生数学建模竞赛&#xff08;国赛&#xff09;选题建议&#xff0c; 提示&#xff1a;DS C君认为的难度&#xff1a;C<B<A&#xff0c;开放度&#xff1a;B<A<C 。 D、E题推荐选E题&#xff0c;后续会直接更新E论文和思路&#xf…
阅读更多...
MaskVO: Self-Supervised Visual Odometry with a Learnable Dynamic Mask 论文阅读

MaskVO: Self-Supervised Visual Odometry with a Learnable Dynamic Mask 论文阅读

论文信息 题目&#xff1a;MaskVO: Self-Supervised Visual Odometry with a Learnable Dynamic Mask 作者&#xff1a;Weihao Xuan, Ruijie Ren, Siyuan Wu, Changhao Chen 时间&#xff1a;2022 来源&#xff1a; IEEE/SICE International Symposium on System Integration …
阅读更多...
正版软件 | CloudDrive 多云盘本地挂载管理工具

正版软件 | CloudDrive 多云盘本地挂载管理工具

前言&#xff1a; CloudDrive 是一个强大的多云盘管理工具&#xff0c;提供一站式的多云盘解决方案&#xff0c;包括云盘本地挂载。旨在无缝集成多个云存储服务&#xff0c;统一整合到一个界面。轻松管理和访问所有云存储服务&#xff0c;无需在不同的应用程序和界面之间切换。…
阅读更多...
【Go基础】编译、变量、常量、基本数据类型、字符串

【Go基础】编译、变量、常量、基本数据类型、字符串

面试题文档下链接点击这里免积分下载 go语言入门到精通点击这里免积分下载 编译 使用 go build 1.在项目目录下执行 2.在其他路径下编译 go build &#xff0c;需要再后面加上项目的路径&#xff08;项目路径从GOPATH/src后开始写起&#xff0c;编译之后的可执行文件就保存再…
阅读更多...
matlab和python做zscore结果不一样的问题

matlab和python做zscore结果不一样的问题

解决matlab和python做zscore标准化结果不一样的问题 总结: matlab和python做zscore时使用的求std公式的默认方法有差异&#xff0c;导致了结果差异。 想要结果相同则使用以下代码&#xff1a; td rand(50,15,39)%td是三维矩阵&#xff0c;求zscore结果 #Python代码&#xf…
阅读更多...
人工智能客服：是跨境电商未来的趋势吗？

人工智能客服：是跨境电商未来的趋势吗？

随着跨境电商的快速发展&#xff0c;客户服务成为了商家们越来越关注的焦点。而在客户服务领域中&#xff0c;人工智能客服正逐渐崭露头角。那么&#xff0c;人工智能客服是否是跨境电商未来的趋势呢&#xff1f;本文将探讨这个问题&#xff0c;并揭示人工智能客服的潜力和优势…
阅读更多...
JS返回NodeList和HTMLCollection详解

JS返回NodeList和HTMLCollection详解

HTML DOM 集合 (Collection) 概述 HTML DOM 集合 (Collection) 是一组 HTML 元素&#xff0c;这些元素可以通过 JavaScript 代码进行访问和操作。HTML DOM 集合通常由一个或多个 HTML 元素组成&#xff0c;并提供了访问和操作这些元素的方法。HTML DOM 集合在 JavaScript 中非常…
阅读更多...
【前端demo】CSVJSON转换器 原生实现：CSV转换为JSON，JSON转换为CSV

【前端demo】CSVJSON转换器 原生实现：CSV转换为JSON，JSON转换为CSV

文章目录 效果过程textareaTooltip提示工具按钮的min-width判断输入是否是CSV或JSONJSON与CSV样例JSON转为CSVCSV转为JSON不足之处 代码HTMLCSSJS 其他demo 效果 效果预览&#xff1a;CSV&JSON Converter (codepen.io) 参照的预览&#xff1a;JSV Converter(gpaiva00.git…
阅读更多...
Redis未授权访问漏洞实战

Redis未授权访问漏洞实战

文章目录 概述Redis概述Redis 介绍Redis 简单使用Redis未授权漏洞危害 漏洞复现启动靶场环境POC漏洞验证EXP漏洞利用 总结 本次测试仅供学习使用&#xff0c;如若非法他用&#xff0c;与平台和本文作者无关&#xff0c;需自行负责&#xff01; 概述 ​ 本文章主要是针对于vulh…
阅读更多...
5、Spring之Bean生命周期源码解析（销毁）

5、Spring之Bean生命周期源码解析（销毁）

Bean的销毁过程 Bean销毁是发送在Spring容器关闭过程中的。 在Spring容器关闭时，比如： AnnotationConfigApplicationContext context = new AnnotationConfigApplicationContext(AppConfig.class); UserService userService = (UserService) context.getBean("userSe…
阅读更多...
​Vue + Element UI前端篇（二）：Vue + Element 案例 ​

​Vue + Element UI前端篇（二）：Vue + Element 案例 ​

Vue Element UI 实现权限管理系统 前端篇&#xff08;二&#xff09;&#xff1a;Vue Element 案例 导入项目 打开 Visual Studio Code&#xff0c;File --> add Folder to Workspace&#xff0c;导入我们的项目。 安装 Element 安装依赖 Element 是国内饿了么公司提…
阅读更多...
Python入门学习12

Python入门学习12

一、Python包 什么是Python包 从物理上看&#xff0c;包就是一个文件夹&#xff0c;在该文件夹下包含了一个 __init__.py 文件&#xff0c;该文件夹可用于包含多个模块文件。从逻辑上看&#xff0c;包的本质依然是模块 包的作用: 当我们的模块文件越来越多时,包可以帮助我们管…
阅读更多...
在外SSH远程连接macOS服务器【cpolar内网穿透】

在外SSH远程连接macOS服务器【cpolar内网穿透】

文章目录 前言1. macOS打开远程登录2. 局域网内测试ssh远程3. 公网ssh远程连接macOS3.1 macOS安装配置cpolar3.2 获取ssh隧道公网地址3.3 测试公网ssh远程连接macOS 4. 配置公网固定TCP地址4.1 保留一个固定TCP端口地址4.2 配置固定TCP端口地址 5. 使用固定TCP端口地址ssh远程 …
阅读更多...
划片机实现装片、对准、切割、清洗到卸片的自动化操作

划片机实现装片、对准、切割、清洗到卸片的自动化操作

划片机是一种用于切割和分离材料的设备&#xff0c;通常用于光学和医疗、IC、QFN、DFN、半导体集成电路、GPP/LED氮化镓等芯片分立器件、LED封装、光通讯器件、声表器件、MEMS等行业。划片机可以实现从装片、对准、切割、清洗到卸片的自动化操作。 以下是划片机实现这些操作的步…
阅读更多...
既然有 HTTP 协议，为什么还要有 RPC

既然有 HTTP 协议，为什么还要有 RPC

HTTP和RPC 什么是HTTP HTTP协议&#xff08;Hyper Text Transfer Protocol&#xff09;&#xff0c;又叫做超文本传输协议。平时上网在浏览器上敲个网址就能访问网页&#xff0c;这里用到的就是HTTP协议。 什么是RPC RPC&#xff08;Remote Procedure Call&#xff09;&…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023