การแพ็กเกจและเผยแพร่สำหรับหลายสโตร์
เรียนรู้การรวมโค้ดเบสของส่วนขยายเดียวเป็นแพ็กเกจ และส่งไปยังทั้ง Chrome Web Store และ Microsoft Edge Add-ons store
การแพ็กเกจและเผยแพร่สำหรับหลายสโตร์ เป็นบทเรียน Browser Extensions Development (Chrome & Edge) ฟรีบน CoddyKit นี่คือบทเรียนที่ 4 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน Browser Extensions Development (Chrome & Edge) และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส Browser Extensions Development (Chrome & Edge) มีบทเรียนทั้งหมด 4 บทเรียน
บางส่วนของบทเรียนนี้ยังไม่ได้รับการแปล และแสดงเป็นภาษาอังกฤษ
Why Publish to Multiple Stores
Once your extension works across browsers, the next step is distribution. The two largest Chromium stores are the Chrome Web Store and the Microsoft Edge Add-ons store.
Publishing to both maximizes reach with almost no extra code, since both consume the same Manifest V3 package.
One Codebase, Two Packages
You usually ship the same ZIP to both stores. Small differences (like minimum versions or store-specific keys) can be handled with a build script.
- Keep one source tree
- Produce store-specific builds via scripts
- Avoid maintaining forks
{
"manifest_version": 3,
"name": "My Extension",
"version": "1.4.0",
"minimum_chrome_version": "102"
}Building the ZIP
Stores accept a ZIP archive of your extension root (the folder containing manifest.json). Never zip the parent folder.
A simple npm script keeps this repeatable.
node -e "const cp=require('child_process'); cp.execSync('cd dist && zip -r ../extension.zip .')"
console.log('Created extension.zip');Version Numbers Matter
Both stores require the version in the manifest to be strictly higher than the currently published version for each update.
Use semantic-like dotted numbers: 1.4.0 then 1.4.1.
const fs = require('fs');
const m = JSON.parse(fs.readFileSync('manifest.json', 'utf8'));
const parts = m.version.split('.').map(Number);
parts[parts.length - 1] += 1;
m.version = parts.join('.');
fs.writeFileSync('manifest.json', JSON.stringify(m, null, 2));
console.log('Bumped to', m.version);Chrome Web Store Submission
In the Chrome Developer Dashboard you upload the ZIP, fill listing details (description, screenshots, category) and submit for review.
- One-time developer registration fee
- Automated plus manual review
- Permission justifications required
Edge Add-ons Submission
The Partner Center hosts Edge submissions. Registration is free. You upload the same ZIP and provide listing metadata.
Edge review tends to focus on policy compliance and accurate descriptions.
Store Listing Assets
Both stores need marketing assets:
- Icon (128x128)
- Screenshots (1280x800 recommended)
- A small and large promo tile (optional)
- Short and detailed descriptions
Prepare these once and reuse across stores.
Automating with the CWS API
The Chrome Web Store API lets you upload and publish from CI. You authenticate with OAuth and call the REST endpoints.
// Pseudocode using fetch in a CI script
const token = await getAccessToken();
await fetch('https://www.googleapis.com/upload/chromewebstore/v1.1/items/' + itemId, {
method: 'PUT',
headers: { Authorization: 'Bearer ' + token, 'x-goog-api-version': '2' },
body: zipBuffer
});
console.log('Uploaded to CWS');Automating Edge Submissions
Edge offers the Add-ons API for CI uploads. You obtain an access token, upload the package, then trigger publishing.
This mirrors the Chrome flow, so a shared deploy script can target both.
// Upload draft, then publish
await fetch(baseUrl + '/products/' + productId + '/submissions/draft/package', {
method: 'POST',
headers: { Authorization: 'Bearer ' + token },
body: zipBuffer
});
console.log('Edge draft uploaded');Handling Review Rejections
Common rejection causes:
- Requesting permissions you do not use
- Vague privacy disclosures
- Mismatched description and behavior
Request only the minimum permissions and document why each is needed.
Keeping Both Stores in Sync
To avoid drift, publish from a single tagged release. Tag the commit, build the ZIP, then push to both stores in the same pipeline run.
This guarantees identical behavior for all your users.
Quick Check
Test your understanding of multi-store publishing.
Recap
You learned to package one codebase and ship it to both Chromium stores:
- Zip the extension root, never the parent folder
- Bump the version on every update
- Reuse listing assets across stores
- Automate uploads with the CWS and Edge APIs
- Request minimal permissions to ease review
เรียนรู้ JavaScript ด้วย AI tutor — ฟรี
เขียนและเรียกใช้โค้ดจริงในเบราว์เซอร์ของคุณ รับความช่วยเหลือทันทีจาก AI tutor 24/7 และเรียนรู้ต่อจากที่คุณหยุดบนเว็บหรือในแอป
- คอร์ส
- 12
- บทเรียน
- 48
คำถามที่พบบ่อย
บทเรียน “การแพ็กเกจและเผยแพร่สำหรับหลายสโตร์” ฟรีหรือไม่
ใช่ — ข้อความเต็มของ “การแพ็กเกจและเผยแพร่สำหรับหลายสโตร์” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส Browser Extensions Development (Chrome & Edge) ให้อัปเกรดเป็น CoddyKit PRO คอร์ส Browser Extensions Development (Chrome & Edge) มีบทเรียนทั้งหมด 4 บทเรียน
คุณจะเรียนรู้อะไรในบทเรียน “การแพ็กเกจและเผยแพร่สำหรับหลายสโตร์”
เรียนรู้การรวมโค้ดเบสของส่วนขยายเดียวเป็นแพ็กเกจ และส่งไปยังทั้ง Chrome Web Store และ Microsoft Edge Add-ons store คุณปฏิบัติ Browser Extensions Development (Chrome & Edge) ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน
คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน Browser Extensions Development (Chrome & Edge) หรือไม่
ไม่จำเป็นต้องมีประสบการณ์มาก่อน Browser Extensions Development (Chrome & Edge) บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 4 จากทั้งหมด 4 บทเรียน
บทเรียน “การแพ็กเกจและเผยแพร่สำหรับหลายสโตร์” ใช้เวลานานแค่ไหน
บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย
ฉันเขียนและรันโค้ดในบทเรียน Browser Extensions Development (Chrome & Edge) นี้ได้ไหม
ได้ บทเรียน Browser Extensions Development (Chrome & Edge) ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ
บทเรียนทั้งหมดในหลักสูตรนี้
- การปรับ manifest ข้ามเบราว์เซอร์
- การใช้โพลีฟิลล์ WebExtension
- สำรวจกรอบงานการพัฒนาส่วนขยาย
- การแพ็กเกจและเผยแพร่สำหรับหลายสโตร์