检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
建议使用Google Chrome浏览器访问上述三个环境，其他浏览器也可以访问，但是使用Google Chrome浏览器访问效果最佳，用户体验最好。 父主题： 产品咨询类
通过在线编辑器完善组件。 测试结果基本满足预期，但是由于图片尺寸不同，有些图片未能完全展示，还需优化。本例中向您介绍AstroZero平台提供的，在线组件开发工具。 单击组件详情页中的“编辑”，在跳转到的“组件编辑”页面进行组件代码开发，完成后单击“发布”，即可完成组件更新。
对于自定义组件的开发和调试，AstroZero提供Scaffolding脚手架工具，可实现本地开发组件的实时在线调测。对于前台页面中常遇到的样式或功能问题，可借助浏览器内置的开发者工具来对问题进行调试和定位。
对于前台页面中常遇到的样式或功能问题，可借助浏览器内置的开发者工具来对问题进行调试和定位。 前台页面常用调测方法 在高级页面的开发中，常借助浏览器内置的开发者工具对样式或功能问题进行定位和分析。下面以Chrome浏览器为例，简单介绍浏览器开发者工具中常用的调测方法。
图1 商品列表组件的响应式设计 操作步骤 参考在线开发高级组件中操作，下载组件模板widgetVueTemplate（组件名称设置为“commodityListWidget”）。
若对方服务没有提供根证书且其根证书为标准证书，可通过以下方式获取： 打开浏览器，输入对方服务地址，参考图1及图2查看对方服务的根证书信息。 图1 获取根证书1 图2 获取根证书2 打开浏览器设置页面，依次选择“安全和隐私设置 > 安全> 管理证书”。
本章节以开发网站中常用的标签切换页面为例，向您介绍如何基于组件模板在线开发组件。参考消费者业务网站（如图1所示），页面中主要包含标签栏和详情展示模块两部分，可以通过切换标签来控制详情展示模块中的展示内容。
若对方服务没有提供根证书且其根证书为标准证书，可通过以下方式获取： 打开浏览器，输入对方服务地址，参考图1及图2，查看对方服务的根证书信息。 图1 获取根证书1 图2 获取根证书2 打开浏览器设置页面，依次选择“安全和隐私设置 > 安全 > 管理证书”。
检查页面性能 打开要进行性能检查的高级页面，在浏览器开发者工具中，勾选“Disable cache”属性。 在Chrome浏览器中，按下“F12”或者“Ctrl + Shift + I”，开启开发者工具。
方式三：直接在浏览器中，输入“https://AstroZero域名/studio/console.html”，进入控制台页面进行数据调试。 查询到冲突的数据后，采取以下几种方式处理。 删除安装包内的数据。 删除环境内的数据。 使用前后置脚本，删除或修改目标环境中已有数据。
WebSocket协议支持Web浏览器，使得客户端和服务端之间可以创建长久连接并进行双向数据传输，即服务端可以主动向客户端推送数据，客户端也可以主动向服务端发送信息，是服务端推送技术的一种。
脚本引擎，在线低码开发复杂业务逻辑 支持自定义开发，定制更灵活 现代化的编辑界面，语法高亮显示，代码联想提示。 在线IDE，智能提示，自动补全，快速编译。 支持页面调测和性能查看，快速定位逻辑Bug。
站点设置 合并并压缩资源：勾选后，在发布该应用时，对应用中所有高级页面涉及的css和js文件进行合并及压缩，这样可以有效降低运行时服务器压力，但从终端浏览器首次访问该站点页面时，访问时间会稍微增加。 资源延迟加载：勾选后，在body标签中加载资源。
若为公共接口，支持查看接口参数并进行在线测试。若为私有接口，只可查看接口的入参和出参。 图2 公共接口 图3 私有接口 单击接口URL后的，可查看接口的参数。 若为公共接口，单击“测试一下”，填写输入参数，单击“执行”，可运行该接口。返回成功响应，表示接口调用成功。
若为公共接口，支持查看接口参数并进行在线测试。若为私有接口，只可查看接口的入参和出参。 单击接口URL后的，可查看接口的参数。 若为公共接口，单击“测试一下”，填写输入参数，单击“执行”，可运行该接口。返回成功响应，表示接口调用成功。
浏览器需要依据Content-Type来解析 resp.setBody(stream); 父主题： 应用后端开发
表示浏览器将返回内容解析为json对象。 是 access-token 当用户登录系统鉴权成功后，后台会生成一个token，在响应消息中携带，并存在浏览器中。下次再调用请求后，会带上这个token，表示这个用户已经被鉴权过。
图5 设置绝对布局屏幕大小 绝对布局一般情况下，不能进行自适应，在运行环境，若终端屏幕大小或浏览器窗口尺寸小于设定屏幕尺寸，会出现滚动条，如图6所示。如果终端屏幕大小或浏览器窗口尺寸大于设定屏幕尺寸，则内容居中外加背景。
打开要进行性能检查的高级页面，在浏览器开发者工具中，勾选“Disable cache”属性。 在Chrome浏览器中，按下“F12”或者“Ctrl + Shift + I”，开启开发者工具。 在“Network”页签，勾选“Disable cache”属性（即禁用缓存）。
切换菜单时记录浏览器历史：切换菜单时，是否记录在浏览器历史中。 是否全屏：是否全屏显示页面，全屏后会折叠左侧菜单。 隐藏国际化按钮：是否隐藏右上方国际化按钮。 禁止应用切换：是否禁用应用切换。禁用后，在运行态Portal中，单击左上角应用图标，不会再弹出切换应用的界面。
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
