Naver ब्लॉग पर लिखना, AI से ड्राफ़्ट सेव होने से ठीक पहले तक पूरा ऑटोमेशन

दूसरी भाषा में पढ़ें: Bahasa Indonesia · العربية

रोज़ एक पोस्ट, हर बार 30 मिनट से ज़्यादा हाथ से होने वाला Naver ब्लॉग अपलोड, अब मैंने इस हद तक ऑटोमेट कर दिया कि AI ब्राउज़र को सीधे चलाकर टेक्स्ट, फ़ोटो, कैप्शन और शीर्षक डालता है और ड्राफ़्ट के रूप में सेव कर देता है।

कल पहली बार शुरू से अंत तक सब कुछ सफल रहा। मेरा काम बस सेव हुआ ड्राफ़्ट खोलकर एक बार सरसरी नज़र से देखना और पब्लिश बटन दबाना है। इस काम का सबसे बड़ा मतलब यह है कि यह इतना भरोसेमंद है कि ऑफ़िस के काम में सीधे इस्तेमाल हो सकता है।

पहले ऐसा था

मैं कंपनी के ब्लॉग की वे पोस्टें, जो एक वेंडर ने inblog पर लिखी थीं, Naver ब्लॉग पर ले जाने का काम करता हूँ। उन्हें जस का तस नहीं डालता। Naver, यानी कोरिया के मुख्य सर्च इंजन, की खोज के हिसाब से भाषा और ढाँचा बदलकर डालता हूँ। रोज़ करीब एक पोस्ट। दोबारा लिखने का काम पहले से AI के साथ कर रहा था। फिर भी हर बार कुछ बच जाता था: Naver एडिटर में डालते हुए क्लिक करना, फ़ोटो अपलोड करना, और अपनी शैली के हिसाब से फिर से ठीक करना।

Naver ब्लॉग में पोस्ट प्रकाशित करने के लिए कोई आधिकारिक API नहीं है। इसलिए AI की लिखी पोस्ट आख़िर में इंसान को हाथ से ले जानी पड़ती थी। इसे कम करने के लिए मैंने बुकमार्क बटन (bookmarklet) और PowerShell कमांड बनाए थे।

क्रम कौन काम
1 AI टेक्स्ट, शीर्षक के सुझाव, फ़ोटो की सूची और कैप्शन वाली वर्क शीट बनाना
2 इंसान वर्क शीट की "फ़ोटो लाने वाली कमांड" कॉपी करके PowerShell में पेस्ट करना
3 इंसान "टेक्स्ट कॉपी" दबाकर Naver एडिटर में पेस्ट करना
4 इंसान बुकमार्क "फ़ॉर्मैट बदलो" दबाना (कोट और विभाजक रेखा का रूप बदलना)
5 इंसान बुकमार्क "फ़ोटो डालो" को फ़ोटो की गिनती जितनी बार दबाना, हर बार फ़ाइल चुनने की विंडो में फ़ोटो चुनना
6 इंसान हर फ़ोटो के कैप्शन वाले खाने पर क्लिक करके कैप्शन पेस्ट करना
7 इंसान शीर्षक लिखना, लिंक कार्ड देखना, पब्लिश करना

बटनों की वजह से काम काफ़ी घटा ज़रूर। फिर भी फ़ोटो दस से ऊपर हों तो क्लिक दर्जनों हो जाते थे। कैप्शन अपने-आप डालने की कोशिश नाकाम रही थी, इसलिए बस क्लिपबोर्ड में कॉपी करके इंसान को पेस्ट करना पड़ता था। एक पोस्ट में कम से कम 30 मिनट लगते ही थे।

नया तरीका: AI कोड से ब्राउज़र चलाता है

मूल बात Playwright MCP है। Playwright कोड से ब्राउज़र चलाने का औज़ार है, और MCP से जोड़ दें तो AI उसे सीधे इस्तेमाल करता है। यह स्क्रीन कैप्चर करके निर्देशांक पर क्लिक नहीं करता। यह पेज की बनावट पढ़ता है, एलिमेंट चुनता है और उन्हें चलाता है। इसलिए तेज़ है और निशाना चूकने की गुंजाइश कम रहती है।

जोड़ने का तरीका यह रहा।

चरण क्या किया
1 Whale (Naver का ब्राउज़र) के शॉर्टकट के टारगेट के अंत में --remote-debugging-port=9222 जोड़ा और उसी शॉर्टकट से Whale चलाया
2 Claude डेस्कटॉप ऐप की सेटिंग फ़ाइल में Playwright MCP जोड़ा, ताकि वह पहले से खुले Whale (पोर्ट 9222) से जुड़े
3 ऐप को पूरी तरह बंद करके दोबारा खोला

सेटिंग फ़ाइल में जो गया वह यह है। मैं पहले से Premiere MCP इस्तेमाल कर रहा हूँ, इसलिए दोनों साथ हैं।

{
  "mcpServers": {
    "playwright": {
      "command": "cmd",
      "args": ["/c", "npx", "-y", "@playwright/mcp@latest", "--cdp-endpoint", "http://localhost:9222"]
    },
    "premiere-pro": { "...": "..." }
  }
}

अहम बात यह है कि यह कोई नया Whale अलग से नहीं खोलता, बल्कि मेरे रोज़ के इस्तेमाल वाले Whale से जुड़ता है। Naver में लॉगिन पहले से है, इसलिए आईडी और पासवर्ड AI को देने की नौबत नहीं आती।

Naver एडिटर से जूझना

Naver का स्मार्ट एडिटर (SmartEditor) ऑटोमेट करने में अड़ियल है। जहाँ सचमुच अटका और जैसे हल किया, वह यहाँ दर्ज कर रहा हूँ।

अटकने की जगह हल
टेक्स्ट पेस्ट करना क्लिपबोर्ड इस्तेमाल नहीं किया। एडिटर के अंदर के इनपुट क्षेत्र को नकली पेस्ट इवेंट सीधे भेजा जाता है। HTML जस का तस जाता है, इसलिए टेबल, बोल्ड और लाइन ब्रेक बने रहते हैं
पैराग्राफ़ के बीच की जगह Naver पैराग्राफ़ का मार्जिन अनदेखा कर देता है। खाली लाइन को असली खाली पैराग्राफ़ के रूप में डालना पड़ता है
कोट का रूप HTML से चिपकाया कोट हमेशा उद्धरण-चिह्न वाले कोट के रूप में आता है। चिपकाने के बाद कोट पर क्लिक करके आकार वाले बटन से रूप बदलते हैं
फ़ोटो की जगह टेक्स्ट में [📸 फ़ोटो 01 | कैप्शन: …] जैसी जगह-सूचक लाइन रखता हूँ, फिर जिस जगह वह लाइन मिटाई उसी जगह फ़ोटो बटन दबाता हूँ
लाइन मिटाना Shift+Home जैसी चयन कुंजियाँ एडिटर रोक लेता है। लाइन के अंत पर क्लिक करके अक्षरों की गिनती जितनी बार Backspace दबाते हैं
फ़ोटो अपलोड फ़ाइल चुनने की विंडो नहीं खोली जाती; Playwright की फ़ाइल अपलोड सुविधा से सीधे डाला जाता है। लेकिन वर्क फ़ोल्डर के बाहर की फ़ाइल वह नामंज़ूर कर देता है, इसलिए प्रति वर्क फ़ोल्डर में रखता हूँ
कैप्शन वाला खाना फ़ोटो पर पहले क्लिक करना पड़ता है, तभी कैप्शन का खाना दिखता है। पहले कैप्शन के अपने-आप डलने में नाकामी की यही वजह थी
अपलोड की जाँच अपलोड के तुरंत बाद फ़ोटो का पता svg के जगह-सूचक जैसा दिखता है, जो सामान्य है। कुछ सेकंड इंतज़ार करना होता है
बटन नहीं दबता साइड पैनल से ढका है या एनिमेशन चल रहा है। हर बार बटन की जगह दोबारा निकालकर माउस से दबाता हूँ
छिपा टैब टैब पीछे छिपा हो तो स्क्रीन जवाब नहीं देती। टैब को आगे लाकर ही आगे बढ़ते हैं

टेक्स्ट पेस्ट करने का कोड यह है। यह चल जाने के बाद बाकी सब सुलझ गया।

async (page) => {
  const HTML = `...पोस्ट का HTML...`;
  const fr = page.frame({ name: 'mainFrame' }) || page.mainFrame();
  await fr.locator('.se-component.se-text .se-text-paragraph').first().click();
  await page.waitForTimeout(400);
  await fr.evaluate((h) => {
    const ib = [...document.querySelectorAll('iframe')]
      .map(i => { try { return i.contentDocument } catch (e) { return null } })
      .find(x => x && x.body && x.body.isContentEditable);
    const W = ib.defaultView, dt = new W.DataTransfer();
    dt.setData('text/html', h);
    dt.setData('text/plain', h.replace(/<[^>]+>/g, ''));
    ib.body.dispatchEvent(new W.ClipboardEvent('paste', { clipboardData: dt, bubbles: true, cancelable: true }));
  }, HTML);
  await page.waitForTimeout(4000);
}

फ़ोटो एक-एक करके दोहराई जाती हैं। एक बार चलाने पर "पिछली फ़ोटो में कैप्शन डालना" और "अगली 📸 जगह मिटाकर फ़ोटो बटन दबाना" साथ होता है, और फ़ाइल चुनने की स्थिति आते ही उस क्रम की फ़ोटो अपलोड हो जाती है। यह तब तक घूमता है जब तक कोई 📸 जगह बची न रहे।

पब्लिश कभी न दबे

आख़िरी क़दम ड्राफ़्ट सेव करना है। यहाँ मैंने सबसे ज़्यादा ध्यान इस पर दिया कि पब्लिश बटन ग़लती से भी न दब जाए। Naver एडिटर के बटनों के नाम कोरियाई में हैं: 저장 का मतलब "सेव" और 발행 का मतलब "पब्लिश" है। कोड पहले बटन का नाम पढ़ता है, और अगर वह 저장 नहीं है या उसमें 발행 आता है तो बिना दबाए रुक जाता है। सेव बटन के बगल की संख्या 1 बढ़ी या नहीं, इससे सफलता की पुष्टि होती है।

async (page) => {
  const fr = page.frame({ name: 'mainFrame' }) || page.mainFrame();
  const btn = fr.locator('button[class*="save_btn"]').first();
  const label = (await btn.textContent()).trim();
  if (!/저장/.test(label) || /발행/.test(label)) return { error: label };
  const cnt = () => fr.evaluate(() => document.querySelector('[class*="save_btn"]').parentElement.textContent);
  const before = await cnt();
  const b = await btn.boundingBox();
  await page.mouse.click(b.x + b.width / 2, b.y + b.height / 2);
  await page.waitForTimeout(2500);
  return { before, after: await cnt() };
}

पब्लिश करना मैंने जान-बूझकर इंसान के हिस्से में छोड़ा है। पोस्ट सार्वजनिक होती है और कंपनी के नाम से जाती है, इसलिए आख़िरी जाँच मैं खुद करता हूँ। बदले में उस जाँच के अलावा मुझे कुछ और छूने की ज़रूरत नहीं।

चरण पहले अब
पोस्ट लिखना AI AI
फ़ोटो तैयार करना PowerShell में कमांड पेस्ट AI
टेक्स्ट डालना कॉपी-पेस्ट AI
फ़ॉर्मैट ठीक करना बुकमार्क बटन AI
फ़ोटो और कैप्शन फ़ोटो की गिनती जितने क्लिक, कैप्शन पेस्ट AI
शीर्षक और लिंक कार्ड इंसान AI
ड्राफ़्ट सेव इंसान AI
जाँच और पब्लिश इंसान इंसान

निजी ब्लॉग के लिए भी बनाया

यही तरीका मेरे निजी Naver ब्लॉग पर भी चले, इसके लिए मैंने इसे अलग स्किल के रूप में सँजोया है। दफ़्तर वाले संस्करण से फ़र्क लहजे का है। मैंने AI से अपनी पुरानी कुछ पोस्टें पढ़वाईं और वाक्यों के अंत, इमोजी, पैराग्राफ़ की लंबाई और फ़ोटो रखने की आदतें टेबल के रूप में निकलवाईं, और उसी लहजे में लिखवाता हूँ। बस फ़ोटो का फ़ोल्डर और मोटे-मोटे नोट्स देने होते हैं; वह पोस्ट लिखकर ड्राफ़्ट में सेव कर देता है।

विषय जानकारी
इनपुट फ़ोटो फ़ोल्डर का रास्ता + नोट्स
लहजा शुरू में एक बार, हाल की 5 पोस्टों का ढाँचा पढ़कर शैली की प्रोफ़ाइल सेव
मनगढ़ंत नहीं नोट्स या फ़ोटो में न दिखने वाली दुकान का नाम, दाम, तारीख़ नहीं लिखता, [जाँचना है] छोड़ देता है
फ़ोटो HEIC को JPG में, बहुत बड़ी को छोटा, और चाहें तो लोकेशन हटाई हुई प्रति
अंत ड्राफ़्ट सेव। पब्लिश मैं खुद करता हूँ

स्किल की फ़ाइलें मैंने सबके लिए खोल रखी हैं (इनकी सामग्री कोरियाई में है)। Claude में स्किल के रूप में जोड़कर इस्तेमाल की जा सकती हैं।

फ़ाइल सामग्री
SKILL.md पूरी प्रक्रिया और कोड
my-blog.md शैली की प्रोफ़ाइल का ख़ाली फ़ॉर्म

घर के PC पर भी यही कनेक्शन लगा रहा था, पर बीच में रुका हुआ है। सेटिंग फ़ाइल तक डाल दी, फिर भी Claude ऐप अभी Playwright को पकड़ नहीं पा रहा। ऐप की सेटिंग के डेवलपर टैब में यह देखने से दोबारा शुरू करूँगा कि वह कौन-सी सेटिंग फ़ाइल पढ़ता है।

अगली पोस्ट में यह सब कर चुकने के बाद जो ख़याल आया, वह लिखूँगा। यह औज़ार बन जाने के बाद मुझे जल्दी करने की ज़रूरत क्यों लगी।