AxureRP制作静态站点发布互联网,实现公网访问【内网穿透】

news2024/11/20 13:42:00

AxureRP制作静态站点发布互联网,内网穿透实现公网访问

文章目录

  • AxureRP制作静态站点发布互联网,内网穿透实现公网访问
    • 前言
    • 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/1039109.html

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

相关文章

力扣-290.单词规律

Idea 先建立一个hashmap,记录s串中的每个单词以及对应的下标再建立一个hashmap,记录pattern串中相同字母以及对应的下标遍历pattern串时,遇到不同字母存到pat表中,同时将下标对应的s中的单词存入到查重test集中,因为如…

2023年8月京东洗烘套装行业品牌销售排行榜(京东数据开放平台)

鲸参谋监测的京东平台8月份洗烘套装市场销售数据已出炉! 根据鲸参谋平台的数据显示,今年8月份,京东平台洗烘套装的销量为1.1万,同比增长约218%;销售额约为1.2亿,同比增长约279%。可以看到,洗烘…

零基础学前端(七)将HTML+CSS静态页面 发布成网站

我们学习了HTML和CSS,已经可以做出精美的静态网页。我们不慌学习JavaScript,因为Javascript的作用是为网页增加动作和数据交换,只能让网页更完美而已,现在网页的基础我们已经可以搭建,我们不妨先将网站发布出去&#x…

【C语言】——自定义类型详解:结构体,枚举,联合

大家好,今天为大家分享一下C语言中的那些自定义类型:结构体,枚举,联合,还有之前可能不曾了解的结构体内存对齐、位段等知识点!!! 一、结构体 结构是一些值的集合,这些值称…

【C++】String类基本接口介绍(多看英文文档)

string目录 目录 如果你很赶时间,那么就直接看我本标题下的内容即可!! 一、STL简介 1.1什么是STL 1.2STL版本 1.3STL六大组件 1.4STL重要性 1.5如何学习STL 二、什么是string??(本质上是一个类&…

研究铜互连的规模能扩大到什么程度

随着领先的芯片制造商继续将finFET以及很快的纳米片晶体管缩小到越来越小的间距,使用铜及其衬垫和阻挡金属,较小的金属线将变得难以维持。接下来会发生什么以及何时发生,仍有待确定。 自从IBM在20世纪90年代向业界引入采用双镶嵌工艺的铜互连…

mysql四种事务隔离级别介绍

MySQL事务隔离级别定义了不同事务之间的隔离程度。MySQL标准列表了四个隔离级别,依次为读未提交(READ UNCOMMITTED)、读已提交(READ COMMITTED)、可重复读(REPEATABLE READ)和串行化&#xff08…

会务转化如何取得“数字化”突破?会务营销数字化功能推荐

​数字化时代下,企业日常的活动经营已经不再局限于简单的人员聚集和互动交流,而是需要更为标准化、专业化的会务系统,在对会务活动进行支撑和保障的同时,达成会务营销的更高转化和会务价值的更大输送。因此,企业需要选…

深度学习入门-0-简介与学习路线

一、简介 1.概述 深度学习(DL, Deep Learning)是机器学习(ML, Machine Learning)领域中的一个研究方向,它被引入机器学习使其更接近于最初的目标——人工智能(AI, Artificial Intelligence)。 深度学习是学习样本数据的内在规律和表示层次,这些学习过程…

选择文件:文件选择框的代码触发【极易版】【文件上传功能】

最近业务中遇到添加附件功能,点击对应元素,在特定条件下触发文件选择,然后将选中的文件上传到后台。 文件上传是使用阿里云实现的,这里主要说文件选择功能。也就是怎样添加附件到界面上。 一 简单实现——点击按钮触发图片选择框…

【linux】实现shell

自我名言:只有努力,才能追逐梦想,只有努力,才不会欺骗自己。 喜欢的点赞,收藏,关注一下把! 如果发现内容有不对的地方欢迎在评论区批评指正,这是对我最大的鼓励!&#xf…

对于现代互联网企业来说Python数据分析有什么用?

我们每一个人,每天无时无刻都在生产数据,一分钟内,微博上新发的数据量超过10万,b站的视频播放量超过600万……这些庞大的数字,意味着什么?意味着每天需要大量的人员要对这些数据进行分析,筛选有…

ssm+vue的教室信息管理系统(有报告)。Javaee项目,ssm vue前后端分离项目。

演示视频: ssmvue的教室信息管理系统(有报告)。Javaee项目,ssm vue前后端分离项目。 项目介绍: 采用M(model)V(view)C(controller)三层体系结构&…

OpenHarmony应用开发涉及的主要因素与UX设计规范

一、OpenHarmony应用开发涉及的主要因素 二、OpenHarmony应用开发UX设计规范 UX设计规范的主要内容与部分图标示例 2.OpenHarmony应用设计原则 设计原则,当为多种不同的设备开发应用时,有如下设计原则: 差异性,充分了解所要支…

LinearLayout里子view点击,其他空白间隙处禁止点击

LinearLayout里子view点击,其他空白间隙处禁止点击 经过不断摸索终于实现了。 像头条里黄色区域禁止点击实现。 可以通过在父 LinearLayout 上设置 android:clickable"true" 属性来实现,然后在子 View 上设置 android:clickable"false&…

1688-阿里巴巴批发网(获取商品的名称,价格,图片)

1688 item_get-获得1688商品详情 为了进行电商平台 的API开发,首先我们需要做下面几件事情。 1)开发者注册一个账号 2)然后为每个1688 应用注册一个应用程序键(App Key) 。 3)下载1688 API的SDK并掌握基本的API基础…

红海云签约中材叶片,科技引领风电叶片行业人力资源数字化转型

中材科技风电叶片股份有限公司(以下简称“中材叶片”)隶属于世界500强央企集团——中国建材集团,是专业的风电叶片设计、研发、制造和服务提供商,致力于打造最为客户尊重与员工、股东信赖的具有全球竞争力的世界一流风电叶片企业。…

Spring Cloud阿里的nacos注册中心的使用 Feign远程调用 nacos配置中心的简单使用

原文档 注册中心 https://github.com/alibaba/spring-cloud-alibaba/blob/2022.x/spring-cloud-alibaba-examples/nacos-example/nacos-discovery-example/readme-zh.md 配置中心 https://github.com/alibaba/spring-cloud-alibaba/blob/2022.x/spring-cloud-alibaba-example…

XSAN数据恢复-XSAN迁移数据过程中误格式化存储系统的数据恢复案例

XSAN数据恢复环境: 昆腾存储,MAC OS操作系统,划分了9个数据卷(1个META信息卷,8个DATA信息卷),存放视频类数据,MXF、MOV等格式文件。 XSAN故障&分析: 将存储空间从XS…

力扣337.打家劫舍3(树形dp)

题目描述: 小偷又发现了一个新的可行窃的地区。这个地区只有一个入口,我们称之为 root 。 除了 root 之外,每栋房子有且只有一个“父“房子与之相连。一番侦察之后,聪明的小偷意识到“这个地方的所有房屋的排列类似于一棵二叉树…