Barcode Scan & Generator (JAN-first / ROI / BarcodeDetector-first)
After a successful scan, this dropdown will be updated automatically.
Quick start (works the same on all devices)
This web app scans printed barcodes using your camera and can also generate barcodes from text. It is optimized for JAN (EAN-13 / EAN-8) and supports CODE128 when needed. The app reads barcodes in the browser using BarcodeDetector first (when supported) and ZXing as a fallback.
- Open the app URL in your browser: https://jouhou.main.jp/?p=50626
- Press Start Scan. The camera view opens with a blue frame (ROI: region of interest). Place the barcode inside the blue frame.
-
When the barcode is detected, the app automatically:
- puts the scanned value into the Barcode Value box,
- sets the Barcode Type dropdown to the detected format (when available), and
- auto-generates the same barcode so the displayed output matches what was scanned.
- If you want to regenerate manually, press Generate. (This should recreate the same barcode as long as the value and the dropdown format match.)
-
Typical usage:
- Keep Mode = JAN only (EAN13/EAN8) for most products.
- Switch Mode = CODE128 only when you actually scan a CODE128 barcode.
Scanning tips for fast, accurate results (printed barcodes)
- Lighting matters: scan under bright light. If your device supports it, use the Torch.
- Focus: move the phone slightly closer/farther until the bars look sharp.
- Keep it level: avoid tilting. Hold the barcode flat and steady for 1–2 seconds.
- Fill the frame wisely: keep the barcode inside the blue frame. If it is too small, move closer.
- Use Zoom (if available): zoom helps small JAN codes on glossy packaging.
- Try Speed:
- Fast (default): best for most situations
- Accurate: use when the barcode is small, glossy, low-contrast, or partially damaged
For iPhone
Recommended browser: Safari (latest iOS). iPhone works best with the back camera for printed barcodes.
1. Open the app page
- Open Safari.
- Go to the app URL: https://jouhou.main.jp/?p=50626
- Confirm you can see buttons like Start Scan and Generate.
2. Scan a JAN code (EAN-13 / EAN-8)
- Leave Mode set to JAN only (EAN13/EAN8).
- Tap Start Scan.
- If asked, tap Allow to give camera access.
- Point your camera at the printed barcode and place it inside the blue frame.
-
When scanning succeeds:
- The value appears in Barcode Value (multi-line box).
- The app sets the detected format (when available) and auto-generates the barcode output.
3. Scan CODE128 (only when needed)
- Change Mode to CODE128.
- Tap Start Scan and scan as usual.
- After success, the app will auto-generate the CODE128 output.
4. Switch camera (front/back)
- Tap Switch Camera.
- For barcodes, the back camera is usually faster and sharper.
5. Use it like an app (Add to Home Screen)
- In Safari, tap Share (square with arrow).
- Select Add to Home Screen.
- Open it from the new icon for quick access.
6. iPhone troubleshooting
- If the camera does not start: reload the page and tap Start Scan again.
- If it keeps failing: try Accurate speed and turn on Torch (if available).
- Make sure the URL is HTTPS. Camera access is blocked on non-secure pages.
For Android
Recommended browser: Google Chrome (latest). Android often supports BarcodeDetector, which can scan very quickly.
1. Open the app page
- Open Chrome.
- Go to: https://jouhou.main.jp/?p=50626
- Confirm the camera area and buttons are visible.
2. Scan JAN (EAN-13 / EAN-8)
- Leave Mode as JAN only (EAN13/EAN8).
- Tap Start Scan.
- When Chrome asks for permission, choose Allow.
- Place the barcode inside the blue frame; hold steady.
- On success, the value is inserted and the barcode is auto-generated.
3. Torch, zoom, and speed (recommended settings)
- Torch: use it when scanning in warehouses, dim rooms, or at night.
- Zoom: increase zoom for small EAN-8 labels or glossy packages.
- Speed: if scanning is unstable, switch from Fast to Accurate.
4. Add to Home Screen (app-like shortcut)
- Tap Chrome’s menu (︙).
- Select Add to Home screen or Install app (wording varies).
- Launch from the icon for a cleaner, app-like screen.
5. Android troubleshooting
- If the camera view is black: check Android settings → Apps → Chrome → Permissions → Camera → Allow.
- If scan is slow: use the back camera, increase light, and move closer for sharper focus.
- If your device is very old: update Chrome. Some older browsers may not support BarcodeDetector.
For desktop browsers
Desktop scanning requires a webcam. A laptop’s built-in camera works, but for printed barcodes a 1080p webcam often performs better. Recommended browsers: Google Chrome or Microsoft Edge.
1. Open the app page
- Open Chrome or Edge.
- Go to: https://jouhou.main.jp/?p=50626
- Confirm you see the camera area and the buttons.
2. Scan a barcode
- Click Start Scan.
- When the browser asks for permission, click Allow.
- Hold the barcode in front of the webcam and align it inside the blue frame.
- Move closer/farther until the barcode is in focus; then hold still.
3. Generate and reuse the value
- The scanned value is shown in the multi-line Barcode Value box.
- Click Generate to recreate the barcode in the selected format.
- You can copy the value from the box and paste it into other systems as needed.
4. Desktop notes
- If no webcam is connected, scanning cannot work.
- In corporate environments, camera access may be restricted by policy.
- Always use HTTPS or localhost; camera access is blocked on insecure origins.
Turning the camera on (permissions & security)
If scanning does not work, the most common reason is that camera access is blocked. Below are the recommended permission checks and the security notes.
1. Important rules (all devices)
- When you see a prompt like “Allow camera access?”, choose Allow.
- If you clicked Block by mistake, change the site permission back to Allow.
- Use a secure URL starting with https://. Most browsers block camera access on
http://. - Close other apps that might be using the camera (video calls, camera apps, etc.).
2. iPhone (Safari) permission check
- Open Settings → Safari.
- Go to Camera (or Website Settings → Camera, depending on iOS version).
- Set the site permission to Allow.
- Return to Safari and reload the page.
3. Android (Chrome) permission check
- Android Settings → Apps → Chrome → Permissions → Camera → Allow.
- Or, in Chrome: tap the lock icon near the address bar → Site settings → Camera → Allow.
- Reload the page and press Start Scan again.
4. Desktop (Chrome / Edge) permission check
- Click the lock icon next to the address bar.
- Find Camera and set it to Allow.
- Reload the page and try again.
5. Security & privacy notes
- This app is designed to scan and generate barcodes inside your browser. In normal operation, camera images are not uploaded as part of barcode recognition.
- For best security, always use the official URL: https://jouhou.main.jp/?p=50626 and confirm the browser shows a secure connection (padlock icon).
- If you are using this in a business environment, follow your organization’s device and network security rules (screen lock, OS updates, and approved browsers).
That’s it. If you need additional features (export scan history, CSV download, etc.), please contact the administrator or support team.





