使用Axure RP和内网穿透技术制作静态站点并实现公网访问

news2024/11/18 18:47:30

文章目录

    • 前言
    • 1.在AxureRP中生成HTML文件
    • 2.配置IIS服务
    • 3.添加防火墙安全策略
    • 4.使用cpolar内网穿透实现公网访问
      • 4.1 登录cpolar web ui管理界面
      • 4.2 启动website隧道
      • 4.3 获取公网URL地址
      • 4.4. 公网远程访问内网web站点
      • 4.5 配置固定二级子域名公网访问内网web站点
        • 4.5.1创建一条固定数据隧道
        • 4.5.2 找到“保留二级子域名”栏位
        • 4.5.3 重新编辑之前建立的临时数据隧道

前言

AxureRP对于产品经理来说,是一款经常使用的网站原型设计工具。它可以用来创建和设置图表样式,为图表页面和元素添加交互性和注释,并能将正在设计中或设计完成的页面随时发布到HTML,使用Web浏览器查看。但除了在局域网中访问,很多时候也会有出差在外,需要使用公网访问的需求,这时候可以利用cpolar内网穿透工具实现在公网访问内网的本地web展示站点,方便随时查看并提出修改意见。

1.在AxureRP中生成HTML文件

简单设计好页面后,点击上方导航中的发布-生成HTML文件,如下图所示,然后进入下一步。

1692336390395

在弹出下方提示框后,点击按钮本地发布(可更改页面发布路径)

image-20230818134258461

随便选择一个浏览器打开即可查看该页面

image-20230818133325635

页面展示效果与页面保存路径如下图:

1692337520863

2.配置IIS服务

目前只是利用AxureRP生成了一个静态HTML页面,但是想要在局域网内其他用户访问该页面,需要先在本地进行IIS服务配置,搭建静态web站点。

打开控制面板程序和功能打开或关闭windows功能,选中Internet信息服务中的IIS相关服务,点击确定。

0

然后打开控制面板管理工具Internet信息服务(IIS)管理器添加网址

1

在打开的界面中配置本地站点相关信息:包括网站名称物理路径端口等。

2

image-20230818145818576

添加好网站后,可以看到我命名为arpce的本地站点已经启动,此时在浏览器中输入:http://localhost:8080 即可本地浏览该页面。

1692343235633

3.添加防火墙安全策略

打开控制面板–windows防火墙,点击高级设置,进入设置界面。

3

点击入站规则,右侧新建规则,点击端口,下一步,输入特定本地端口,就是上边IIS配置中你输入的端口号,一直下一步,规则就建立了。

4

5

然后,运行cmd进入命令提示符,输入ipconfig,即可获取到本机IP地址。

7

此时,想要让局域网内其他用户访问到你用Axure生成的静态站点,只需要发送给它这个地址,用浏览器打开即可:

http://你的IP地址:端口号(冒号要用英文)

6.1

4.使用cpolar内网穿透实现公网访问

但目前该站点只能在局域网内被访问到,其他公网用户无法访问。接下来我们使用cpolar内网穿透将该站点发布到公网,实现公网用户也可以正常访问到。

4.1 登录cpolar web ui管理界面

在浏览器上访问127.0.0.1:9200,使用注册的cpolar账号密码登录cpolar web UI管理界面。(默认为本地9200端口)

20221117173937

4.2 启动website隧道

由于我们的演示站点端口在8080端口下,所以我们可以直接使用website隧道。

登录进入cpolar web ui界面后,我们点击左侧仪表盘的隧道管理——隧道列表,找到website隧道,并点击启动,显示状态为active

-windows20221117173943

或者,我们也可以重新创建一个新的隧道:点击左侧仪表盘的创建隧道

  • 隧道名称:可自定义,注意不要重复
  • 协议:选择http
  • 本地地址:填写8080端口
  • 域名类型:选择随机域名(可以免费使用)
  • 地区:可根据实际适用地区进行选择,支持CN、HK、US、TW、EUR

隧道信息填写完成后,点击创建即可

image-20230825152958595

4.3 获取公网URL地址

点击左侧仪表盘的状态——在线隧道列表,可以在线隧道所生成的公网地址,可以看到website隧道的公网地址有两个,一个是http协议,一个是https协议,将公网地址复制下来。

image-20230825152826367

4.4. 公网远程访问内网web站点

在浏览器上访问cpolar所生成的公网地址,本例为:https://64a3463b.r5.cpolar.top

成功将内网web站点发布到公网可访问。

image-20230825153106520

4.5 配置固定二级子域名公网访问内网web站点

在上一步中,我们已经能在公网访问内网web站点,不过此时的数据隧道处于临时状态(随机域名,每24小时重置一次),大多用于测试场景。想要长期稳定的访问利用Axure制作中的站点,随时查看并提出修改意见。我们还需要进一步的设置,将临时数据隧道转为固定隧道(需要成为cpolar的VIP会员)。现在,就让我们开始吧。

4.5.1创建一条固定数据隧道

要创建一条固定数据隧道,我们需要从隧道的进口端和出口端两个方面,将漂移的端口固定下来。首先我们在cpolar web ui界面(浏览器上访问127.0.0.1:9200)点击左下角的转到cpolar官网

image-20230825153319388

在cpolar官网登录进入仪表台界面后,点击左侧的“预留”按钮。

img

img

4.5.2 找到“保留二级子域名”栏位

在“预留”界面,我们找到“保留二级子域名”栏位。在这里设置的,就是数据隧道的公共互联网入口端。与cpolar客户端的设置类似,我们也要在这里进行一些简单设置。首先是“地区”栏,只要按实际使用地区填写即可(这里我们填入China VIP);“名称”则是我们对数据隧道的命名,不过与cpolar客户端不同,这里的名称会编入最终生成的URL中(这里我们选择填入NAS);而最后的“备注”,这是这条数据隧道的提示,这里我们填入test。

image-20230825154659616

在各栏都填写完毕后,就可以点击右侧的“保留”按钮,将cpolar云端的数据隧道入口保留下来。

image-20230825154836525

4.5.3 重新编辑之前建立的临时数据隧道

接着我们转回cpolar客户端,在客户端“隧道管理”项下的“隧道列表”页面,重新编辑我们之前建立的临时数据隧道(隧道名称:website),将cpolar云端数据隧道的入口,与cpolar本地端数据隧道的出口关联起来,这样我们才能使用重定义的数据隧道,访问位于内网的Axure静态站点。

image-20230825155112010

点击编辑按钮

修改隧道信息,将二级子域名配置到隧道中:

  • 域名类型:改为选择二级子域名
  • Sub Domain:填写我们刚刚所保留的二级子域名(本例为Axuretest

修改完成后,点击更新

image-20230825160140639

隧道更新成功后,点击左侧仪表盘的状态——在线隧道列表,可以看到website隧道的公网地址,已经更新为二级子域名了,将公网地址复制下来。

image-20230825160555666

打开浏览器,我们来测试一下访问配置成功的二级子域名。

image-20230825161103001

测试成功,可以正常访问。现在,我们全网唯一的私有二级子域名,就创建好了。

转载自cpolar极点云文章:AxureRP制作静态站点发布互联网,内网穿透实现公网访问

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【LeetCode:1726. 同积元组 | 哈希表】

🚀 算法题 🚀 🌲 算法刷题专栏 | 面试必备算法 | 面试高频算法 🍀 🌲 越难的东西,越要努力坚持,因为它具有很高的价值,算法就是这样✨ 🌲 作者简介:硕风和炜,…

Echarts:双折线图的值一样,高度却不一样

问题 在使用Echarst绘制双折线图的时候,2条线在相同的横坐标下,y轴的值是一样的,但是展示在图上的时候2条折线在那个横坐标值下的高度却不一样即xx1时,y12,y22,但是显示在图上的却是:xx1时&…

Kafka Tool(Kafka 可视化工具)安装及使用教程

Kafka Tool(Kafka 可视化工具)安装及使用教程 Kafka Tool 工具下载 下载地址 http://www.kafkatool.com/download.html 下载界面 不同版本的Kafka对应不同版本的工具,个人使用的是2.11,所以下载的是最新的2.0.8版本&#xff…

璞华科技再次赋能,助力成都市温江区“码”上维权不烦“薪” !

科技赋能护“薪”行动 “码”上维权不烦“薪” 为保障劳动者工资收入的合法权益,提升人社部门智能化咨询服务能力,2023年10月17日,成都市温江区人力资源和社会保障局发布“码上护薪”小程序,助力劳动者“码”上维权不烦”薪”。…

Ant Design Form表单组件手动清楚校验信息(提示文字及红框)

出现场景 当我们的表单项是按条件验证的情况,或者该表单项是不可编辑然后是关联赋值(比如选择某个下拉框,赋上关联值),并且你还先点击了按钮进行验证,那么即使赋上了值也不能触发该表单二次验证。所以就需…

ZGC关键技术分析

一、引言 垃圾回收对于Javaer来说是一个绕不开的话题,工作中涉及到的调优工作也经常围绕垃圾回收器展开。面对不同的业务场景没有一个统一的垃圾回收器能保证可GC性能。因此对程序员来说不仅要会编写业务代码,同时也要卷一下JVM底层原理和调优知识。这种…

tika解压遇到压缩炸弹如何继续解压

1.问题 项目中要对10层压缩的zip、7z等文件用tika解压遇到错误:tika zip bomb detected 也就是说tika认为这是个压缩炸弹。 “压缩炸弹”是一个压缩包文件的木马程序,通常只有几百KB,解压后会变成上百MB或者上GB庞然大物。把你本地磁盘占满…

PTE-精听学习(三)

目录 WFD 答题技巧 多写单词不扣分数 RS 只有三秒钟准备时间 空挡时间1-2秒钟 WFD 犹豫 扣分点 fluency 单词一致顺序也是一致 总会有题目简单到有短又容易理解 预测的命中率 抽屉理论 印度发音其实是算标准的 反正就是归于模仿 影子跟读法 打拍子 看前缀…

UE4 Ultradynamicsky进行地面交互

第一步: 找到地面材质,进入地面材质 找到该节点 找到之前本该连在这里的,现在连到这个节点上,然后把这个节点的输出连到材质输出节点上 新建一个物理材质 然后给过来 找到Ultra_Dynamic_Weather,把Enable Dynamic Lan…

airflow报ModuleNotFoundError: No module named ‘dags‘原因和解决方法

ModuleNotFoundError: No module named ‘dags’ 原因:airflow默认是从dags目录下开始搜所有模块,如果你加上dags目录名,就相当于在dags目录下找dags包。 解决方法:导入的时候,去掉dags,详细可以参考下面案…

Python中的With ...as... 作用

Python中的with … as …作用: 1、通过with语句可以得到一个上下文管理器 2、执行对象 3、加载__enter__方法 4、加载__exit__方法 5、执行__enter__方法 6、as 可以得到enter的返回值 7、拿到对象执行相关操作 8、执行完了之后调用__exit__方法 9、如果遇到异常&a…

Android之使用GirdLayoutManager时候给Item设置边距

效果: 一、自定义设置边距方法 SpaceItemDecoration.java package com.custom.jfrb.ui.jfrb.finishedProduct; //自己包名位置import android.graphics.Rect; import android.view.View;import androidx.annotation.NonNull; import androidx.recyclerview.widg…

threejs(2)-Geometry进阶详解

一、全面讲解UV与应用 在本节中,我们将讨论Three.js中的UV映射,包括UV映射的概念、与顶点位置的关系和区别以及如何在Geometry中设置UV坐标。我们将使用BufferGeometry进行示例说明。 颜色对应 什么是UV映射? UV映射是一种将二维纹理映…

【根据车间号[81321000]未找到ERP逻辑仓】

以条码Z42310062781622举例,WMS集成报错。 先说业务逻辑: 新建包装工单,维护包装批次管制时,会把包装批次管制里的部门信息传给115。 赛龙捷包装后,会根据115里的这个部门对应的车间号,返还给MES。 MES会…

程序连接oracle查询数据的环境配置

连接oracle 数据库真麻烦,还是MySQL方便 Oracle Instant Client 这个东西的版本跟oracle的版本是有讲究的,引用文档的说明 Oracle 标准的客户端-服务器网络互操作性允许不同版本的 Oracle 客户端和 Oracle 数据库之间的连接。有关经过认证的配置&#…

springboot之quartz动态可控定时任务

Quartz Quartz是一个开源的任务调度框架,可以用来实现定时任务的调度,如定时发送邮件、定时备份数据等。Quartz具有很高的可靠性和灵活性,支持集群部署和分布式调度,并且提供了丰富的API和插件,可以轻松实现复杂的调度…

2023年中国GPS导航设备产量、销量及市场规模分析[图]

GPS导航设备行业是指生产和销售用于导航、定位和监控目的的GPS设备的行业,可以用于汽车、船只、飞机、人员和其他物体的定位和导航,以及用于地理信息系统(GIS)、测绘、海洋抢险、森林监测、地质勘探、气象预报、交通管理、物流跟踪…

中国地级市-环境规制18个相关指标数据(2002-2021年)

本次数据为地级市-环境规制相关指标,主要用于计算城市的环境规制、污染排放水平。指标数目总计18个,数据来源为《中国城市统计年鉴》,存在一定缺失。数据包含原始、线性插值、回归填补3个版本,希望对大家有用 一、数据介绍 数据…

uni-app:js二维数组与对象数组之间的转换

一、二维数组整理成对象数组 效果 [ ["前绿箭","DI10","RO1"], ["前红叉","DI2","RO2"], ["后绿箭","DI12","RO3"], ["后红叉","DI4","RO6"] ] …

2023国考证件照要求什么底色?证件照换背景底色的方法

2023年国家公务员考试报名已经开始了,我们在考试平台提交报名信息的时候,有一项就是需要上传证件照片,对于证件照片也会有具体的要求,比如背景底色、尺寸大小、dpi和kb大小。今天就为大家详细介绍一下关于国考证件照背景色的内容&…