Alist Advanced Usages - NETSEC

Latest

NETSEC

Learning, Sharing, Creating

Cybersecurity Memo

Saturday, January 7, 2023

Alist Advanced Usages

This post summarized some advanced usages of AList. 


Related Posts:


Add different network drive

Google Drive:

If you have your own Client ID, Client Secret, and refresh token, you can directly paste them in here. As to how to get your own Google Drive's following information, I will put them into another post to talk about it. 

AList author has an instruction page to show you how to  use a default client id / client secret to generate your refresh_token for your Google drive folder, using https://tool.nn.ci/google/request: 
Unfortunately, google doesnot support this way anymore. You will get an access blocked error page.

To resolve this ,you might want to use a local installed Rclone to get refresh token. Please see my other posts for more information:
  • https://blog.51sec.org/2021/11/mount-azure-blob-storage-into-local.html
  • https://blog.51sec.org/2020/03/goindex-using-cloudflare-workers-to.html#point6

After you collected all those information, you can enter them into this AList page to add your Google Drive folder to show all the files / folders. 


OneDrive:

Not like Google drive, the url for fetching refresh token works.

To make it simple, we can use  https://tool.nn.ci/onedrive/request to generate all information. 

Click purple button to fetch refresh token. It will ask you log into your Microsoft Onedrive account.


Baidu NetDisk:

For Baidu NetDisk, only thing you will need is Refresh Token. The problem is download function doesn't work properly. But multimedia preview function is working well.



S3 - BackBlaze 

I am only able to view root folder's content, and not able to go to sub folder. It just keeps showing root folder's conent. 





WebDav


How to mount Alist into local windows?

Folder format: http(s)://alist.51sec.org/dav

Doc URL: https://alist-doc.nn.ci/en/docs/webdav/


Enter a username and password. 





AList Style

Note: https://blog.csdn.net/u012514495/article/details/125772285

黑猫：

  1.  
  2. <!--看板娘 - 黑猫-->
  3.     <script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
  4.     <script>
  5.       L2Dwidget.init({
  6.         "model": {
  7.           jsonPath: "https://unpkg.com/live2d-widget-model-hijiki/assets/hijiki.model.json", <!--这里改模型，前面后面都要改-->
  8.           "scale": 1
  9.         },
  10.         "display": {
  11.           "position": "left", <!--设置看板娘的上下左右位置-->
  12.           "width": 100,
  13.           "height": 200,
  14.           "hOffset": 0,
  15.           "vOffset": 0
  16.         },
  17.         "mobile": {
  18.           "show": true,
  19.           "scale": 0.5
  20.         },
  21.         "react": {
  22.           "opacityDefault": 0.7, <!--设置透明度-->
  23.           "opacityOnHover": 0.2
  24.         }
  25.       });
  26.       window.onload = function() {
  27.         $("#live2dcanvas").attr("style", "position: fixed; opacity: 0.7; left: 70px; bottom: 0px; z-index: 1; pointer-events: none;")
  28.       }
  29.     </script>
  30.   </div>

白猫：

  1. <!--白小猫咪-->
  2. <script src=" https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
  3. <script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.0.min.js"></script>
  4. <script>
  5. L2Dwidget.init({
  6. "model": {
  7. jsonPath: " https://unpkg.com/[email protected]/assets/tororo.model.json" ,
  8. "scale": 1
  9. },
  10. "display": {
  11. "position": "right",
  12. "width": 100,
  13. "height": 200,
  14. "hOffset": -20,
  15. "vOffset": -20
  16. },
  17. "mobile": {
  18. "show": true,
  19. "scale": 0.5
  20. },
  21. "react": {
  22. "opacityDefault": 1,
  23. "opacityOnHover": 1
  24. }
  25. });
  26. </script>

鼠标点击出随机颜色的爱心:

  1. <!--鼠标点击出随机颜色的爱心-->
  2. <!DOCTYPE html>
  3. <html lang="en">
  4. <head>
  5.     <meta charset="UTF-8">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <title>Document</title>
  8. </head>
  9.  
  10. <body>
  11.     <!-- 网页鼠标点击特效（爱心） -->
  12.     <script type="text/javascript">
  13.          ! function (e, t, a) {
  14.             function r() {
  15.                 for (var e = 0; e < s.length; e++) s[e].alpha <= 0 ? (t.body.removeChild(s[e].el), s.splice(e, 1)) : (s[
  16.                         e].y--, s[e].scale += .004, s[e].alpha -= .013, s[e].el.style.cssText = "left:" + s[e].x +
  17.                     "px;top:" + s[e].y + "px;opacity:" + s[e].alpha + ";transform:scale(" + s[e].scale + "," + s[e]
  18.                     .scale + ") rotate(45deg);background:" + s[e].color + ";z-index:99999");
  19.                 requestAnimationFrame(r)
  20.             }
  21.             function n() {
  22.                 var t = "function" == typeof e.onclick && e.onclick;
  23.                 e.onclick = function (e) {
  24.                     t && t(), o(e)
  25.                 }
  26.             }
  27.  
  28.             function o(e) {
  29.                 var a = t.createElement("div");
  30.                 a.className = "heart", s.push({
  31.                     el: a,
  32.                     x: e.clientX - 5,
  33.                     y: e.clientY - 5,
  34.                     scale: 1,
  35.                     alpha: 1,
  36.                     color: c()
  37.                 }), t.body.appendChild(a)
  38.             }
  39.  
  40.             function i(e) {
  41.                 var a = t.createElement("style");
  42.                 a.type = "text/css";
  43.                 try {
  44.                     a.appendChild(t.createTextNode(e))
  45.                 } catch (t) {
  46.                     a.styleSheet.cssText = e
  47.                 }
  48.                 t.getElementsByTagName("head")[0].appendChild(a)
  49.             }
  50.  
  51.             function c() {
  52.                 return "rgb(" + ~~(255 * Math.random()) + "," + ~~(255 * Math.random()) + "," + ~~(255 * Math
  53.                     .random()) + ")"
  54.             }
  55.             var s = [];
  56.             e.requestAnimationFrame = e.requestAnimationFrame || e.webkitRequestAnimationFrame || e
  57.                 .mozRequestAnimationFrame || e.oRequestAnimationFrame || e.msRequestAnimationFrame || function (e) {
  58.                     setTimeout(e, 1e3 / 60)
  59.                 }, i(
  60.                     ".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);}.heart:after,.heart:before{content: '';width: inherit;height: inherit;background: inherit;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;position: fixed;}.heart:after{top: -5px;}.heart:before{left: -5px;}"
  61.                 ), n(), r()
  62.         }(window, document);
  63.     </script>

隐藏右上角复制直链、下载切换布局等：

  1. <!--隐藏右上角-->
  2. <style>
  3. .css-neion{
  4.     display:none;
  5. }
  6. </style>

全白无框：

  1. <!--全白无框-->
  2. <style>
  3. .chakra-ui-light{
  4.   background-color: #FFFFFF;
  5. }
  6. .main-box {
  7.   border-radius: 15px !important;
  8.   box-shadow: unset !important;
  9. }
  10. .chakra-ui-light .main-box {
  11.   background-color: rgba(255,255,255,0.9) !important;
  12. }
  13. .chakra-ui-light .readme-box {
  14.   background-color: rgba(255,255,255,0.9) !important;
  15. }
  16. .readme-box {
  17.   border-radius: 15px !important;
  18.   box-shadow: unset !important;
  19. }
  20. </style>

备案信息：

  1. <!--备案信息--> 
  2. </style>
  3.     <link href="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/font-awesome/6.0.0/css/all.min.css" rel=" stylesheet ">
  4.     <div id="customize" style="display:none;
  5. 	text-align:center;
  6. 	">
  7.         <br />
  8.         <div style="font-size:13px;
  9. 	">
  10.             <span class="nav-item">
  11.                 <a class="nav-link" href="http://lizong.top/" target="_blank">
  12.                     <i class="fa-solid fa-copyright" style="color:#9932CC" aria-hidden="true"></i>
  13.                      2022 LIZONG.TOP |
  14.                 </a>
  15.             </span>
  16.             <span class="nav-item">
  17.                 <a class="nav-link" href="https://beian.miit.gov.cn/" target="_blank">
  18.                     <i class="fa fa-balance-scale" style="color:#9932CC;
  19. 	" aria-hidden="true"></i>
  20.                      鄂ICP备xxxxxx号-x |
  21.                 </a>
  22.             </span>
  23.             <span class="nav-item">
  24.                 <a class="nav-link" href="https://github.com/Xhofe/alist" target="_blank">
  25.                     <i class="fa fa-heart" style="color:#9932CC;
  26. 	" aria-hidden="true"></i>
  27.                      由Alist驱动
  28.                 </a>
  29.             </span>
  30.         </div>
  31.         <br />
  32.     </div>
  33.     <script>
  34.         let interval = setInterval(() => {
  35. 	if (document.querySelector(".footer")) {
  36. 	document.querySelector("#customize").style.display = "";
  37. 	clearInterval(interval);
  38. }
  39. },200);
  40. 	</script>
  41. </font>

底部网站运行时间：

  1. <!--开站时间开始-->       
  2. <center>
  3.         <br />
  4.   </span>
  5.             <span class="nav-item">
  6.                 <a class="nav-link" href="https://blog.51sec.org/2022/12/5-minutes-docker-series-deploy-free.html" target="_blank">
  7.              <span id="timeDate">载入天数...</span><span id="times">载入时分秒...</span> <script language="javascript"> 
  8.     var now = new Date();
  9.     function createtime(){
  10.         var grt= new Date("04/17/2022 00:00:00");/*---这里是网站的启用时间--*/
  11.         now.setTime(now.getTime()+250);
  12.         days = (now - grt ) / 1000 / 60 / 60 / 24;
  13.         dnum = Math.floor(days);
  14.         hours = (now - grt ) / 1000 / 60 / 60 - (24 * dnum);
  15.         hnum = Math.floor(hours);
  16.         if(String(hnum).length ==1 ){hnum = "0" + hnum;}
  17.         minutes = (now - grt ) / 1000 /60 - (24 * 60 * dnum) - (60 * hnum);
  18.         mnum = Math.floor(minutes);
  19.         if(String(mnum).length ==1 ){mnum = "0" + mnum;}
  20.         seconds = (now - grt ) / 1000 - (24 * 60 * 60 * dnum) - (60 * 60 * hnum) - (60 * mnum);
  21.         snum = Math.round(seconds);
  22.         if(String(snum).length ==1 ){snum = "0" + snum;}
  23.         document.getElementById("timeDate").innerHTML = "⏱️本站已稳定运行"+dnum+"天";
  24.         document.getElementById("times").innerHTML = hnum + "小时" + mnum + "分" + snum + "秒";
  25.     }
  26.     setInterval("createtime()",250); 
  27. </script>

自定义背景：替换url即可

  1. <!--自定义背景-->
  2. <style>
  3. .chakra-ui-light{
  4.   background-image: url("https://www.dmoe.cc/random.php") !important;
  5.   background-repeat:no-repeat;background-size:cover;background-attachment:fixed;background-position-x:center;
  6. }
  7. .main-box {
  8.   border-radius: 15px !important;
  9. }
  10. .chakra-ui-light .main-box {
  11.   background-color: #ffffff70 !important;
  12. }
  13. .chakra-ui-light .readme-box {
  14.   background-color: white !important;
  15. }
  16. .readme-box {
  17.   border-radius: 15px !important;
  18.  
  19. }
  20. </style>

不建议删除底部文字 请尊重开发者的劳动成果，谢谢

去掉底部的管理文字：

  1. <!---去掉底部管理--->
  2. <style>
  3. .footer span,.footer a:nth-of-type(2){
  4.   display:none;
  5. }
  6. </style>

去掉底部的 Powered by Alist：

  1. <!--去掉底部Powered by Alist--->
  2. <style>
  3. .footer span,.footer a:nth-of-type(1){
  4.   display:none;
  5. }
  6. </style>

去掉底部Powered by Alist和管理文字：

  1. <!---去掉底部文字--->
  2. <style
  3. type="text/css"> .footer { 
  4. display: none !important; } 
  5. </style>

Videos

 Using Portainer to Deploy & Deploy into Windows




References





Read more

Subscribe via email

Author Image

About Netsec
Netsec - Learning, Sharing, Creating!

-
Tags:

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)