如何公网远程访问Axure RP制作的本地web页面【内网穿透】

这篇具有很好参考价值的文章主要介绍了如何公网远程访问Axure RP制作的本地web页面【内网穿透】。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

前言

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

1.在AxureRP中生成HTML文件

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

2.配置IIS服务

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

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

3.添加防火墙安全策略

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

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

4.1 登录cpolar web ui管理界面

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

4.2 启动website隧道

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

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

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

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

4.3 获取公网URL地址

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

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

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

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

4.5.1创建一条固定数据隧道

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

点击编辑按钮

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

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

修改完成后,点击更新

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

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

如何公网远程访问Axure RP制作的本地web页面【内网穿透】,cpolar,axure,前端

测试成功,可以正常访问。现在,我们全网唯一的私有二级子域名,就创建好了。文章来源地址https://www.toymoban.com/news/detail-794794.html

到了这里,关于如何公网远程访问Axure RP制作的本地web页面【内网穿透】的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 公网远程访问macOS本地web服务器

    # 公网访问macOS本地web服务器【内网穿透】 以macOS自带的Apache为例,在本地启用apache服务器,并通过cpolar内网穿透将其暴露至公网,实现在公网环境下访问本地web服务。 1. 启动Apache服务器 在macOS上打开终端,执行命令启动Apache服务器,提示 Passwod ,输入密码 浏览器访问localh

    2024年02月08日
    浏览(39)
  • 90套Axure原型模板源文件Rp高保真ui产品经理app web 网站案例模板(Axure9制作)

    素材信息名称:90+套Axure原型图设计源文件 格式:RP格式(Axure软件) 产品经理全套文档模板Axure8可以打开8、7版本制作 Axure9可以全部打开9、8、7版本制作 点此下载全部资源 后面还有很多 ——网站 阿里云网站.rp车辆违章处理.rp城市介绍网站.rp城市旅游网站.rp城市网站.rp城市

    2024年02月11日
    浏览(51)
  • Ubuntu本地快速搭建web小游戏网站,公网用户远程访问

    最近,我发现了一个超级强大的人工智能学习网站。它以通俗易懂的方式呈现复杂的概念,而且内容风趣幽默。我觉得它对大家可能会有所帮助,所以我在此分享。点击这里跳转到网站。 前言 网:我们通常说的是互联网;站:可以理解成在互联网上的一个房子。把互联网看

    2024年02月05日
    浏览(41)
  • 如何公网远程访问本地WebSocket服务端

    1. Java 服务端demo环境 jdk1.8 框架:springboot+maven 工具IDEA 2. 在pom文件引入第三包封装的netty框架maven坐标 注意:pom文件里需注释掉springbootweb启动器,web启动器默认是tomcat服务启动,会和netty服务冲突 3. 创建服务端,以接口模式调用,方便外部调用 4. 启动服务,出现以下信息表示启动成功

    2024年02月06日
    浏览(35)
  • OpenWRT搭建本地web站点并结合内网穿透实现公网远程访问

    uhttpd 是 OpenWrt/LuCI 开发者从零开始编写的 Web 服务器,目的是成为优秀稳定的、适合嵌入式设备的轻量级任务的 HTTP 服务器,并且和 OpenWrt 配置框架非常好地集成在一起。它是管理 OpenWrt 的默认的 Web 服务器,还提供了现代 Web 服务器所有的 功能 。 下面我们将在openwrt上部署

    2024年02月05日
    浏览(45)
  • 【cpolar】Ubuntu本地快速搭建web小游戏网站,公网用户远程访问

    🎥 个人主页:深鱼~ 🔥收录专栏:cpolar 🌄欢迎 👍点赞✍评论⭐收藏 目录 前言 1. 本地环境服务搭建 2. 局域网测试访问 3. 内网穿透 3.1 ubuntu本地安装cpolar 3.2 创建隧道 3.3 测试公网访问 4. 配置固定二级子域名 4.1 保留一个二级子域名 4.2 配置二级子域名 4.3 测试访问公网固定

    2024年02月05日
    浏览(51)
  • Ubuntu本地快速搭建web小游戏网站,公网用户远程访问【内网穿透】

    网:我们通常说的是互联网;站:可以理解成在互联网上的一个房子。把互联网看做一个城市,城市里面的每一个房子就是一个站点,房子里面放着你的资源,那如果有人想要访问你房子里面的东西怎么办? 在现实生活中,去别人家首先要知道别人的地址,某某区某某街道,

    2024年02月03日
    浏览(76)
  • 构建本地Web小游戏网站:Ubuntu下的快速部署与公网用户远程访问

    网:我们通常说的是互联网;站:可以理解成在互联网上的一个房子。把互联网看做一个城市,城市里面的每一个房子就是一个站点,房子里面放着你的资源,那如果有人想要访问你房子里面的东西怎么办? 在现实生活中,去别人家首先要知道别人的地址,某某区某某街道,

    2024年02月07日
    浏览(48)
  • 轻量级web开发框架Flask本地部署及无公网ip远程访问界面

    本篇文章讲解如何在本地安装Flask,以及如何将其web界面发布到公网上并进行远程访问。 Flask是目前十分流行的web框架,采用Python编程语言来实现相关功能。较其他同类型框架更为灵活、轻便、安全且容易上手。它可以很好地结合MVC模式进行开发,开发人员分工合作,小型团

    2024年02月04日
    浏览(62)
  • 如何将本地websocket发布至公网并实现远程访问?

    1. Java 服务端demo环境 jdk1.8 框架:springboot+maven 工具IDEA 2. 在pom文件引入第三包封装的netty框架maven坐标 注意:pom文件里需注释掉springbootweb启动器,web启动器默认是tomcat服务启动,会和netty服务冲突 3. 创建服务端,以接口模式调用,方便外部调用 4. 启动服务,出现以下信息表示启动成功

    2024年02月05日
    浏览(45)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包