🤓
LAPRAS求人サイトで自動いいね！Chrome拡張機能を作ってみた

2025/06/17に公開
 はじめに転職活動をしていると、求人サイトで気になる求人に「いいね」や「興味あり」ボタンを押すことが多いですよね。でも、たくさんの求人をチェックしていると、一つ一つボタンを押すのが面倒になってきます。
そこで今回は、LAPRAS求人サイトで自動的に「興味あり」ボタンを押してくれるChrome拡張機能を作ってみました！

https://github.com/iamyosuke/lapras-auto-like-extension

 作成した拡張機能の機能![拡張機能のポップアップ画面]!

企業からの閲覧数


 主な機能🎯 LAPRAS求人検索ページで「興味あり」ボタンを自動検出・クリック
🔄 すべてのボタンをクリック後、自動的に次のページに移動
⚙️ クリック間隔とページ移動間隔の調整可能
🚀 自動開始機能（ページ読み込み時に自動実行）
🛑 手動での開始/停止制御
💾 設定の保存機能

 対象となるHTML要素拡張機能は以下のような「興味あり」ボタンを自動的に検出します：
<li class="reaction-btn-wrap">
  <button class="button mini-mode reaction-btn skin-primary-line size-m flat-button">
    <div class="body">
      <div class="row">
        <span class="left-icon">
          <i class="icon"></i>
        </span>
        <span class="label">興味あり</span>
      </div>
    </div>
  </button>
</li>

 技術的な実装
 ファイル構成lapras-extension/
├── manifest.json      # 拡張機能の設定ファイル
├── content.js         # メインの自動化スクリプト
├── popup.html         # ポップアップUI
├── popup.js           # ポップアップの動作制御
├── background.js      # バックグラウンドスクリプト（通信制御）
└── README.md          # 使用方法とインストール手順

 manifest.jsonChrome拡張機能の設定ファイルです。Manifest V3を使用しています。
{
  "manifest_version": 3,
  "name": "LAPRAS Auto Like",
  "version": "1.0",
  "description": "LAPRAS求人サイトで自動的にいいねボタンを押すChrome拡張機能",
  "permissions": [
    "activeTab",
    "scripting",
    "storage"
  ],
  "host_permissions": [
    "https://lapras.com/*"
  ],
  "content_scripts": [
    {
      "matches": ["https://lapras.com/jobs/search*"],
      "js": ["content.js"],
      "run_at": "document_idle"
    }
  ],
  "background": {
    "service_worker": "background.js"
  },
  "action": {
    "default_popup": "popup.html",
    "default_title": "LAPRAS Auto Like"
  }
}

 Content Script（content.js）メインの自動化ロジックを担当します。
// いいねボタンを見つける
function findLikeButtons() {
  const buttons = document.querySelectorAll('li.reaction-btn-wrap button.reaction-btn');
  return Array.from(buttons).filter(button => {
    const labelElement = button.querySelector('.label');
    return labelElement && labelElement.textContent.trim() === '興味あり';
  });
}

// ボタンをクリック
function clickButton(button) {
  return new Promise((resolve) => {
    try {
      // スクロールしてボタンを表示
      button.scrollIntoView({ behavior: 'smooth', block: 'center' });
      
      setTimeout(() => {
        button.click();
        console.log('Button clicked successfully');
        resolve(true);
      }, 500);
    } catch (error) {
      console.error('Error clicking button:', error);
      resolve(false);
    }
  });
}

// すべてのいいねボタンを順次クリック
async function clickAllLikeButtons() {
  const buttons = findLikeButtons();
  let successCount = 0;

  for (let i = 0; i < buttons.length; i++) {
    const success = await clickButton(buttons[i]);
    if (success) successCount++;
    
    // 次のクリックまで待機
    if (i < buttons.length - 1) {
      await new Promise(resolve => setTimeout(resolve, CONFIG.clickDelay));
    }
  }

  return successCount > 0;
}

 Background Script（background.js）ポップアップとContent Script間の通信を中継します。
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
  if (request.action === 'startAutoLike' || request.action === 'stopAutoLike') {
    chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
      if (tabs[0]) {
        chrome.tabs.sendMessage(tabs[0].id, request, (response) => {
          if (chrome.runtime.lastError) {
            sendResponse({ error: chrome.runtime.lastError.message });
          } else {
            sendResponse(response);
          }
        });
      }
    });
    return true; // 非同期レスポンスを示す
  }
});

 実装のポイント
 1. 非同期処理とエラーハンドリングボタンのクリック処理は非同期で行い、エラーが発生しても処理を継続できるようにしています。
async function clickAllLikeButtons() {
  // 停止フラグをチェック
  if (shouldStop) {
    console.log('Auto-like process stopped by user');
    return false;
  }
  // ... クリック処理
}

 2. ユーザビリティの向上
自動スクロール: ボタンをクリックする前に画面内に表示

設定の永続化: Chrome Storage APIで設定を保存

リアルタイム制御: 実行中でも停止可能

 3. 安全な実装
適切な待機時間: サーバーに負荷をかけないよう間隔を設定

エラー処理: 予期しないエラーでも拡張機能が停止しない

権限の最小化: 必要最小限の権限のみ要求

 使用方法
 インストールプロジェクトをダウンロード
Chromeで chrome://extensions/ を開く
「デベロッパーモード」を有効化
「パッケージ化されていない拡張機能を読み込む」をクリック
プロジェクトフォルダを選択

 使い方
 自動実行（推奨）LAPRAS求人検索ページにアクセス
拡張機能が自動的に「興味あり」ボタンをクリック開始
すべてのボタンをクリック後、自動的に次のページに移動

 手動実行拡張機能のアイコンをクリック
「Start Auto Like」ボタンを押す
必要に応じて「Stop」ボタンで停止

 今後の改善案
 複数の求人サイトに対応

 より詳細な条件設定（キーワードフィルタリングなど）

 統計情報の表示（クリック数、処理時間など）

 ソースコード完全なソースコードは以下のGitHubリポジトリで公開しています：

https://github.com/iamyosuke/lapras-auto-like-extension
この記事が参考になったら、ぜひ「いいね」をお願いします！（手動で😄）
はじめに

作成した拡張機能の機能

主な機能

対象となるHTML要素

技術的な実装

ファイル構成

manifest.json

Content Script（content.js）

Background Script（background.js）

実装のポイント

1. 非同期処理とエラーハンドリング

2. ユーザビリティの向上

3. 安全な実装

使用方法

インストール

使い方

自動実行（推奨）

手動実行

今後の改善案

ソースコード

Discussion
