What metadata fields can I edit?

You can add or edit Title, Author/Artist, Copyright, Keywords, and Description/Caption. These are written as JPEG COM (Comment) segments in the output file, which are readable by most photo software.

Will my EXIF camera data be preserved?

Yes. The tool writes the new metadata as additional COM segments while keeping the original JPEG data intact, including any existing EXIF segments.

JPEG COM segments are a simple, universal way to embed text metadata that works without external libraries. PNG, WebP, and TIFF use different metadata formats that require more complex parsers and writers.

Is this the same as full IPTC/XMP editing?

No. Full IPTC/XMP editing requires dedicated software. This tool writes metadata as JPEG comment fields, which is readable by most tools but is not the same as structured IPTC or XMP blocks.

图片元数据编辑 — 编辑标题、描述和版权

🖼️

将 JPEG 拖放到此处，或点击浏览

仅限 JPEG —写入元数据需要支持 JFIF/EXIF 段

未在此图片中检测到 EXIF 数据。

标题

作者 / 艺术家

版权

关键词以逗号分隔

描述 / 说明

<div class="notice">
          ⚀新的元数据会使用注释（COM）段写入一份全新的 JPEG 副本。原始 EXIF 相机数据（光圈、GPS 等）保持不变。要完整嵌入 IPTC/XMP，IPTC 字段需要专用软件。
        </div>
        <button class="save-btn" id="saveBtn">下载更新后的 JPEG</button>
      </div>
    </div>
  </div>

<div class="ds-seo-content">
  <section class="ds-seo-section">
    <h2 class="ds-seo-section__title">什么是图片元数据编辑？</h2>
    <p>图片元数据编辑可让你打开 JPEG，读取其现有 EXIF 相机信息（制造商、型号、日期、尺寸），并添加或编辑描述性元数据字段：标题、作者、版权、关键词和描述。新元数据会以 JPEG COM 段嵌入下载的文件副本中。</p>
  </section>
  <section class="ds-seo-section">
    <h2 class="ds-seo-section__title">如何使用图片元数据编辑</h2>
    <ol>
      <li>将 JPEG 文件拖放到拖放区域，或点击浏览。</li>
      <li>读取摘要面板中显示的现有 EXIF 数据。</li>
      <li>填写元数据字段：标题、作者、版权、关键词和描述。</li>
      <li>点击“下载更新后的 JPEG”保存编辑后的文件。</li>
    </ol>
  </section>
</div>

<div class="ds-related-tools">
  <h2 class="ds-related-title">相关工具</h2>
  <div class="ds-related-grid">
    <a href="exif-viewer.html" class="ds-related-card"><span class="ds-related-icon">🔍</span><div><div class="ds-related-name">EXIF 查看器</div><div class="ds-related-desc">从任意图片读取相机型号、GPS、曝光信息和完整 EXIF 元数据</div></div></a>
    <a href="remove-exif.html" class="ds-related-card"><span class="ds-related-icon">🛡️</span><div><div class="ds-related-name">清除EXIF信息</div><div class="ds-related-desc">移除照片中的 GPS 位置和 EXIF 元数据</div></div></a>
    <a href="image-to-base64.html" class="ds-related-card"><span class="ds-related-icon">🔢</span><div><div class="ds-related-name">图片转Base64</div><div class="ds-related-desc">将任意图片转换为 Base64 字符串或 data URI，以便嵌入 HTML/CSS</div></div></a>
  </div>
</div>

<details class="ds-seo-more">
  <summary class="ds-seo-more__toggle">
    <span>了解图片元数据</span>
    <span class="ds-seo-more__arrow">▾</span>
  </summary>
  <div class="ds-seo-more__body">
    <details class="ds-seo-collapse">
      <summary>示例</summary>
      <div class="ds-seo-collapse__body">
        <div class="ds-seo-example">
          <div class="ds-seo-example__row">
            <span class="ds-seo-example__label">输入</span>
            <span class="ds-seo-example__value">photo.jpg（无元数据）</span>
          </div>
          <div class="ds-seo-example__row">
            <span class="ds-seo-example__label">输出</span>
            <span class="ds-seo-example__value">photo_edited.jpg，标题：日落 | 作者：Jane Smith | 版权：2024</span>
          </div>
        </div>
      </div>
    </details>
    <details class="ds-seo-collapse">
      <summary>常见使用场景</summary>
      <div class="ds-seo-collapse__body">
        <ul>
          <li>在线分享照片前添加版权信息</li>
          <li>为归档图片标注标题和描述</li>
          <li>更正或添加 JPEG 文件的作者署名</li>
          <li>添加关键词，让照片可被搜索</li>
        </ul>
      </div>
    </details>
    <details class="ds-seo-collapse">
      <summary>为什么使用此工具</summary>
      <div class="ds-seo-collapse__body">
        <ul>
          <li>发布照片前添加版权和作者信息。</li>
          <li>如果存在现有 EXIF Artist 标签，则会预填作者字段。</li>
          <li>非破坏性——会创建新文件，绝不覆盖原始文件。</li>
          <li>100% 本地处理——图像永远不会上传。</li>
        </ul>
      </div>
    </details>
    <details class="ds-seo-collapse">
      <summary>常见问题</summary>
      <div class="ds-seo-collapse__body">
        <div class="ds-seo-faq-item"><strong>我可以编辑哪些元数据字段？</strong><p>你可以添加或编辑标题、作者/艺术家、版权、关键词和描述/说明。这些内容会以 JPEG COM（注释）段写入输出文件，大多数照片软件均可读取。</p></div>
        <div class="ds-seo-faq-item"><strong>我的 EXIF 相机数据会被保留吗？</strong><p>会。该工具会将新元数据作为额外的 COM 段写入，同时保持原始 JPEG 数据不变，包括任何现有 EXIF 段。</p></div>
        <div class="ds-seo-faq-item"><strong>为什么仅支持 JPEG？</strong><p>JPEG COM 段是一种简单且通用的文本元数据嵌入方式，无需外部库即可使用。PNG、WebP 和 TIFF 使用不同的元数据格式，需要更复杂的解析器和写入器。</p></div>
        <div class="ds-seo-faq-item"><strong>这与完整的 IPTC/XMP 编辑相同吗？</strong><p>不是。完整的 IPTC/XMP 编辑需要专用软件。此工具将元数据写入 JPEG 注释字段，大多数工具可读取，但这与结构化 IPTC 或 XMP 块并不相同。</p></div>
      </div>
    </details>
  </div>
</details>

</div>
<script>
  'use strict';

let originalBuf = null;
  let origFileName = 'image.jpg';

// Minimal EXIF reader for display only
  function readExif(buf) {
    const dv = new DataView(buf);
    const fields = {};
    if (dv.getUint16(0) !== 0xFFD8) { document.getElementById('exifReadout').textContent = 'Not a valid JPEG.'; return; }
    let pos = 2;
    while (pos < dv.byteLength - 1) {
      const marker = dv.getUint16(pos);
      if (marker === 0xFFE1) {
        const segLen = dv.getUint16(pos + 2);
        const id = String.fromCharCode(...new Uint8Array(buf, pos + 4, 4));
        if (id === 'Exif') {
          const tiff = pos + 10;
          const le = dv.getUint16(tiff) === 0x4949;
          const ifd0 = tiff + dv.getUint32(tiff + 4, le);
          const n = dv.getUint16(ifd0, le);
          for (let i = 0; i < n; i++) {
            const eOff = ifd0 + 2 + i * 12;
            const tag = dv.getUint16(eOff, le);
            const type = dv.getUint16(eOff + 2, le);
            const count = dv.getUint32(eOff + 4, le);
            if (type === 2) {
              const dataOff = count > 4 ? tiff + dv.getUint32(eOff + 8, le) : eOff + 8;
              let s = '';
              const bytes = new Uint8Array(buf, dataOff, count);
              for (let j = 0; j < count; j++) { if (!bytes[j]) break; s += String.fromCharCode(bytes[j]); }
              if (tag === 0x010F) fields['Make'] = s.trim();
              if (tag === 0x0110) fields['Model'] = s.trim();
              if (tag === 0x0132) fields['DateTime'] = s.trim();
              if (tag === 0x013B) fields['Artist'] = s.trim();
            }
            if (tag === 0xA002 && (type === 3 || type === 4)) {
              fields['Width'] = type === 3 ? dv.getUint16(eOff + 8, le) : dv.getUint32(eOff + 8, le);
            }
            if (tag === 0xA003 && (type === 3 || type === 4)) {
              fields['Height'] = type === 3 ? dv.getUint16(eOff + 8, le) : dv.getUint32(eOff + 8, le);
            }
          }
        }
        pos += 2 + segLen;
        continue;
      }
      if ((marker & 0xFF00) !== 0xFF00) break;
      if (marker === 0xFFD9) break;
      pos += 2 + dv.getUint16(pos + 2);
    }

document.getElementById('exifReadout').innerHTML = parts.length
      ? parts.join('  ·  ')
      : 'No readable EXIF fields found. You can still add metadata fields below.';
  }

// Write metadata as JPEG COM segments
  document.getElementById('saveBtn').addEventListener('click', () => {
    if (!originalBuf) return;

const fields = {
      title: document.getElementById('mTitle').value.trim(),
      author: document.getElementById('mAuthor').value.trim(),
      copyright: document.getElementById('mCopyright').value.trim(),
      keywords: document.getElementById('mKeywords').value.trim(),
      description: document.getElementById('mDesc').value.trim()
    };

const comments = Object.entries(fields)
      .filter(([, v]) => v)
      .map(([k, v]) => `${k.charAt(0).toUpperCase() + k.slice(1)}: ${v}`);

// Build new JPEG: keep SOI + existing segments, inject COM before SOS/EOI
    const encoder = new TextEncoder();
    const parts = [];
    // SOI
    parts.push(new Uint8Array([0xFF, 0xD8]));
    // COM segments
    for (const comment of comments) {
      const data = encoder.encode(comment);
      const segLen = data.length + 2;
      const seg = new Uint8Array(4 + data.length);
      seg[0] = 0xFF; seg[1] = 0xFE;
      seg[2] = (segLen >> 8) & 0xFF; seg[3] = segLen & 0xFF;
      seg.set(data, 4);
      parts.push(seg);
    }
    // Rest of original JPEG (skip original SOI, keep everything else)
    parts.push(originalBuf.slice(2));

const totalLen = parts.reduce((s, p) => s + p.length, 0);
    const out = new Uint8Array(totalLen);
    let offset = 0;
    for (const p of parts) { out.set(p, offset); offset += p.length; }