validation

＃使用express-validator在Express中驗證輸入 了解如何驗證Express端點中的輸入數據。 假設你有一個POST端點，接受名字、郵件和年齡參數： const express = require('express') const app = express() app.use(express.json()) app.post('/form', (req, res) => { const name = req.body.name const email = req.body.email const age = req.body.age }) 如何對這些結果進行服務器端驗證，以確保： name是一個至少3個字符的字符串嗎？ email是一個真實的郵件地址嗎？ age是一個介於0和110之間的數字嗎？ 處理Express中從外部輸入的任何類型的驗證的最佳方法是使用express-validator套件： npm install express-validator 您需要從該套件中導入check和validationResult對象： const { check, validationResult } = require('express-validator'); 我們將check()調用的數組作為post()調用的第二個參數傳遞。每個check()調用接受參數名作為參數。然後，我們調用validationResult()來驗證是否有驗證錯誤。如果有，我們將錯誤返回給客戶端： app.post('/form', [ check('name').isLength({ min: 3 }), check('email').isEmail(), check('age').isNumeric() ], (req, res) => { const errors = validationResult(req) if (!errors.isEmpty()) { return res.status(422).json({ errors: errors....

Moment.js 是一個在 JavaScript 中處理日期非常有幫助的庫。 Moment.js 是一個非常棒的 JavaScript 库，可以幫助你處理日期，不管是在瀏覽器上還是在 Node.js 中都可以使用。 這篇文章旨在解釋這個庫的基本知識和最常見的用法。 安裝 你可以直接在你的頁面中使用 script 標籤引入它，從 unpkg.com： <script src="https://unpkg.com/moment" /> 或者使用 npm 安裝： npm install moment 如果你使用 npm 安裝，需要用 import 引入這個包（使用 ES 模块）： import moment from 'moment' 或者用 require 引入它（使用 CommonJS）： const moment = require('moment') 獲取當前日期和時間 const date = moment() 解析日期 你可以通過傳遞一個字符串給 moment 對象來初始化它。 const date = moment(string) 它可以接受任意字符串，按照以下順序解析： ISO 8601 RFC 2822 日期時間格式 Date 對象接受的格式 ISO 8601 絕對是最方便的。這是一個格式參考： 格式 意義 範例 YYYY 4 位數年份 2018 YY 2 位數年份 18 M 2 位數月份，忽略前導 0 7 MM 2 位數月份 07 MMM 3 字母月份名稱 Jul MMMM 完整的月份名稱 July dddd 完整的星期名稱 Sunday gggg 4 位數年份的星期 2018 gg 2 位數年份的星期 18 w 不帶前導零的一年中的星期數 18 ww 帶有前導零的一年中的星期數 18 e 星期的第幾天，從 0 開始 4 D 2 位數的日期，忽略前導 0 9 DD 2 位數的日期 09 Do 帶序數的日期 9th T 表示時間部分的開始 HH 2 位數的小時（24 小時制），從 0 到 23 22 H 2 位數的小時（24 小時制），從 0 到 23，不帶前導 0 22 kk 2 位數的小時（24 小時制），從 1 到 24 23 k 2 位數的小時（24 小時制），從 1 到 24，不帶前導 0 23 a/A 上午 或者 下午 下午 hh 2 位數的小時（12 小時制） 11 mm 2 位數的分鐘 22 ss 2 位數的秒數 40 s 2 位數的秒數，不帶前導零 40 S 1 位數的毫秒數 1 SS 2 位數的毫秒數 12 SSS 3 位數的毫秒數 123 Z 時區 +02:00 x 毫秒級的 UNIX 時間戳 1410432140575 設置日期 格式化日期 當你想要輸出普通的 JavaScript Date 對象的內容時，你只有很少的選擇來確定格式。你只能使用內置的方法，使用它們來組成你想要的日期。...

ReCaptcha 是 Google 對表單垃圾郵件和濫用的解決方案。 這是一個非常有價值的工具。如果您還沒有在 https://www.google.com/recaptcha 創建帳戶，請先創建並添加您的網站域名。 選擇 v2，並選擇「我不是機器人」複選框： 你會獲得一個站點金鑰和站點密鑰。 將密鑰儲存在您的.env文件中： RECAPTCHA_SECRET=<....> 現在，在您的 Next.js 網站中使用 npm 安裝react-google-recaptcha： npm install react-google-recaptcha 現在，在具有表單的頁面中引入它： import ReCAPTCHA from 'react-google-recaptcha' 並將其添加到 JSX 中： <ReCAPTCHA size="normal" sitekey="<YOUR SITE KEY>" /> 您應該在表單中看到它： 現在，如果您嘗試提交表單，它能正常工作，因為它什麼都不做。任何人，包括機器人，在不點擊「我不是機器人」按鈕的情況下都可以成功提交表單。 您需要在服務器端驗證驗證碼，以使其有用。 假設您將表單發送到 Next.js API 路由。在其中，添加一個validateCaptcha方法： const validateCaptcha = (response_key) => { return new Promise((resolve, reject) => { const secret_key = process.env.RECAPTCHA_SECRET const url = `https://www.google.com/recaptcha/api/siteverify?secret=${secret_key}&response=${response_key}` fetch(url, { method: 'post' }) .then((response) => response.json()) .then((google_response) => { if (google_response....

有很多方法可以驗證電子郵件地址。學習正確的方法，並了解使用純JavaScript的所有選項。 在處理表單時，驗證電子郵件地址是常見的操作之一。 在聯繫表單、註冊和登錄表單等方面非常有用。 有些人認為根本不應該對電子郵件進行驗證。我認為少量的驗證，不要過度追求完美，是更好的選擇。 電子郵件驗證應遵循哪些規則？ 電子郵件地址由兩部分組成：本地部分和域名部分。 本地部分可以包含 任何字母或數字字符：a-zA-Z0-9 標點符號："(),:;<>@[\] 特殊字符：!#$%&'*+-/=?^_``{|}~ 點號.，如果它不是第一個或最後一個字符。而且不能重複出現。 域名部分可以包含 任何字母或數字字符：a-zA-Z0-9 橫槓-，如果它不是第一個或最後一個字符。可以重複出現。 使用正則表達式 驗證電子郵件地址的最佳選擇是使用正則表達式。 沒有一個通用的電子郵件驗證正則表達式。大家似乎都在使用不同的驗證方法，而大多數在線找到的正則表達式將無法通過最基本的電子郵件場景驗證，原因可能是不準確，或者並沒有計算新引入的域名或國際化電子郵件地址。 不要盲目使用任何正則表達式，請先檢查一下。 我在Glitch上建立了這個例子，它將檢查一個被認為有效的電子郵件地址列表是否通過正則表達式驗證。您可以更改正則表達式並將其與您想使用的其他正則表達式進行比較。 當前添加的正則表達式是我認為最準確的，稍微經過修正以解決多個點的問題。 注意：這不是我想出來的。我在一個Quora答案中找到它，但我不確定它是否是原始來源。 這是一個使用該正則表達式進行驗證的函數： const validate = (email) => { const expression = /(?!.\*\.{2})^([a-z\d!#$%&'\*+\-\/=?^\_`{|}~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+(\.[a-z\d!#$%&'\*+\-\/=?^\_`{|}~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+)\*|"((([ \t]\*\r\n)?[ \t]+)?([\x01-\x08\x0b\x0c\x0e-\x1f\x7f\x21\x23-\x5b\x5d-\x7e\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|\\[\x01-\x09\x0b\x0c\x0d-\x7f\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))\*(([ \t]\*\r\n)?[ \t]+)?")@(([a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|[a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF][a-z\d\-.\_~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]\*[a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])\.)+([a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|[a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF][a-z\d\-.\_~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]\*[a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])\.?$/i; return expression.test(String(email).toLowerCase()); }; 這滿足了所有常見情況，可以假設99.9％的用戶添加的電子郵件地址都可以成功驗證。 此Glitch上的代碼包含其他可以通過重新發布該項目輕松嘗試的正則表達式。 儘管相當準確，但這個正則表達式在一些邊界情況下存在一些問題，根據您的需求，您可以忽略這些問題。 對於奇怪的地址存在假陰性，例如 "very.(),:;<>[]".VERY."very@\ "very".unusual"@strange.example.com one."more\ long"@example.website.place 對於本機地址存在假陰性，例如 [[email protected]](/cdn-cgi/l/email-protection) [[email protected]](/cdn-cgi/l/email-protection) 在公開訪問的網站上幾乎沒有用處（對於在公開訪問的網站上禁用這些地址實際上是一個優勢） 同樣，在基於IP的電子郵件上有假陽性 user@[2001: DB8 :: 1] [[email protected]](/cdn-cgi/l/email-protection) 對於本地部分過長的地址存在假陽性 12345678901234[[email protected]](/cdn-cgi/l/email-protection) 您需要一個更簡單的正則表達式嗎？ 上面的正則表達式非常複雜，以至於我甚至不嘗試去理解它。正規表達式大師們創建了它，並且在互聯網上流傳開來，直到我找到它為止。 在這一點上，使用它只是一個複製/粘貼的問題。 一個更簡單的解決方案只是檢查輸入的地址是否包含某個內容，然後是 @ 符號，然後是其他內容。 在這種情況下，使用以下正則表達式即可：...

我有一個需要使用檔案上傳圖片的需求，所以我添加了一個小小的 input type="file" 欄位： <input type="file"> 我只希望使用者能夠上傳圖片。 這是一個常見的需求，但我總是忘記如何實現。 使用 accept 屬性，將 image/* 傳遞進去以允許上傳所有圖片： <input type="file" accept="image/*"> 或者使用 image/png 只允許上傳 PNG 圖片： <input type="file" accept="image/png"> 同樣的語法也可以用於只允許上傳視頻： <input type="file" accept="video/*"> 或者音頻： <input type="file" accept="audio/*"> 或者它們的組合： <input type="file" accept="image/*,audio/*,video/*"> 當然，這只是在客戶端進行的驗證，當接收到檔案時，您也應該在伺服器端驗證媒體類型。