☰

Notion to Netlify

在 Notion 中一键触发 Netlify 构建

  1. // ==UserScript==
  2. // @name         Notion to Netlify
  3. // @version      0.2
  4. // @description  在 Notion 中一键触发 Netlify 构建
  5. // @namespace    notion_blog
  6. // @author       superman66
  7. // @require      https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js
  8. // @grant        GM_xmlhttpRequest
  9. // @match        https://www.notion.so/CUSTOM_KEY/*
  10. // ==/UserScript==
  11.  
  12. /****************** 使用前请按照下面的要求配置 ******************/
  13. /**
  14.  * 1. @match 字段。CUSTOM_KEY 更换为你的。
  15.  * 2. BUILD_HOOK_URL。将HOOK_KEY 更改为实际的KEY。具体配置见 https://docs.netlify.com/configure-builds/build-hooks/
  16.  */
  17. /****************** 配置结束 ******************/
  18.  
  19. (function () {
  20.   "use strict";
  21.   const BUILD_HOOK_URL = "https://api.netlify.com/build_hooks/HOOK_KEY";
  22.  
  23.   // Your code here...
  24.   function triggerDeploy() {
  25.     GM_xmlhttpRequest({
  26.       method: "POST",
  27.       url: BUILD_HOOK_URL,
  28.       onload: function (responseDetail) {
  29.         if (responseDetail.status === 200) {
  30.           notifyMe();
  31.         }
  32.       },
  33.     });
  34.   }
  35.  
  36.   function notifyMe() {
  37.     // 先检查浏览器是否支持
  38.     if (!("Notification" in window)) {
  39.       alert("This browser does not support desktop notification");
  40.     }
  41.  
  42.     // 检查用户是否同意接受通知
  43.     else if (Notification.permission === "granted") {
  44.       // If it's okay let's create a notification
  45.       var notification = new Notification("Netlify Trigger Deploy Successful.");
  46.     }
  47.  
  48.     // 否则我们需要向用户获取权限
  49.     else if (Notification.permission !== "denied") {
  50.       Notification.requestPermission(function (permission) {
  51.         // 如果用户同意，就可以向他们发送通知
  52.         if (permission === "granted") {
  53.           var notification = new Notification(
  54.             "Netlify Trigger Deploy Successful."
  55.           );
  56.         }
  57.       });
  58.     }
  59.   }
  60.  
  61.   function createNetlifyButton() {
  62.     var button = document.createElement("div");
  63.     button.setAttribute("role", "button");
  64.     button.setAttribute("id", "deploy");
  65.     button.setAttribute(
  66.       "style",
  67.       "position: fixed;top: 9px;right: 260px;z-index: 888;user-select: none;transition: background 120ms ease-in 0s;cursor: pointer;display: inline-flex;align-items: center;flex-shrink: 0;white-space: nowrap;height: 28px;border-radius: 3px;font-size: 14px;line-height: 1.2;min-width: 0px;padding-left: 8px;padding-right: 8px;color: rgb(55, 53, 47);"
  68.     );
  69.     button.innerHTML = "Deploy to Netlify";
  70.     document.body.append(button);
  71.   }
  72.  
  73.   $(document).ready(function () {
  74.     createNetlifyButton();
  75.  
  76.     $("#deploy").on("click", function () {
  77.       triggerDeploy();
  78.     });
  79.   });
  80. })();