Giter VIP home page Giter VIP logo

nas-nav-icloud's Introduction

NAS-Nav-iCloud

NAS-Nav导航仿iCloud风格 效果访问Demo

同步github.comgitee.com

引用介绍

  • 我只是一个搬运工,这是我找到的最早的文章地址,如果不对请指出

  • 本项目搬运的是仿iCloud界面_3.7z

  • 原文链接:https://wrdan.com/share/nas_cloud.html (好像已经失联)

说明

在原作者的基础上做了一点更新

  • 更新了在手机设备上浏览的优化
  • 在引入资源的位置添加了可以使用CDN资源的提示,有两处,详情见文件index.html
  • 其他一些说明在index.html文件和lan.php里已指出,调整参数只需要更改参数值即可
  • 增加了内外网自动切换的功能(使用的是 https://ifconfig.me/ip 的服务,内置还加入了其他逻辑条件来判断是否在内网,详情见文件index.html)
  • 为了最大兼容度,开发内外网自动切换的功能是基于PHP5.3的语法提示,理论上最低支持为PHP5.3,测试通过的版本为PHP7.4+,其他的没测试过,理论上没什么问题,提交PR的建议请基于PHP5.3的语法

自动内外网切换的PHP套件相关设置

  • 群晖(我这边是DSM7.2)的设置方法,去套件中心安装PHP,理论上支持任意版本的,我这边装了PHP8.0,以下按照PHP8.0来说明
  • Web Station - 网页服务 - (双击打开“默认服务”) - (PHP选项选择PHP8.0) - 保存
  • Web Station - 脚本语言设置 - (双击PHP8.0) - 扩展名 - (找到curl并打上勾) - 保存

关于自动切换内外网的方案逻辑如下

  1. 根据请求IP是否为局域网IP,该建议根据#1建议改进
  2. 如上述为否,根据客户端IP和服务端的IP是否相等
  3. 如上述为否,根据是否能访问服务端的内网IP进行判断

其他注意事项

关于群晖使用OpenVPN(或者同类型软件)且群晖启用SSL下,本地证书错误导致无法切换内网页面的解决办法

关于此问题,我已经向群晖方面咨询过本地IP SSL自签证书DDNS SSL兼容且根据访问域名自动切换SSL证书相关解决方案,那边答复无解。(看不懂忽略本条,看下一条)

上述啰里八嗦情况的实例就是:你的群晖DDNS域名为abc.com,群晖本地域名为192.168.1.1,你的导航页地址为http://abc.com:80https://abc.com:443http://192.168.1.1:80https://192.168.1.1:443。 上述四个网址均可访问导航页,由于群晖的SSL限制,在访问https://192.168.1.1:443时,会提示下图错误,此时需要点击访问此网站,后续就可以正确切换内网页面了,否则会提示跨域错误导致无法正确切换内网页面。 不过遇到一个问题,好像这个操作后只能短期内有效,过了一段时间还是不行,目前尚未有简单的完美解决方案。

image

下载&使用

  • 下载后只留下web文件夹下的文件,其他文件都可以删除掉。

图标制作

教程

License

The MIT License (MIT)

nas-nav-icloud's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

nas-nav-icloud's Issues

夜间支持

能修复一下对Dark Reader这个插件的支持吗,我自己试过了,wrap这个地方有一层不知道是布局还是背景的,始终弄不掉。

关于自动切换内网的方案

看到代码中自动切换内网需要部署 Php 服务器,通过判断本机地址来判断是否为内网。

从字面意思来讲,这确实能判断内网,但是内网有很多,到不同环境下的内网可能能判断成功,但是不能访问。

所以我理解判断内网可以尝试主动连接内网的地址,如果连接成功就切换到内网,不成功就还在外网。

这样的好处有两点,

1 .判断内网更准确了,准确的来讲是在所在服务器下的那个内网
2. 不需要Php服务器了,简单的js就可以请求

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.