ActiveXObject读取本地TXT与IE中localStorage兼容问题求解

Hey there, let's tackle your problem head-on—you're stuck between two conflicting browser restrictions, but there are workarounds depending on your needs. Let's break down why this happens first, then jump to solutions.

Why You're Seeing This Conflict #

• ActiveXObject Limitations: This IE-only feature only works when your page is loaded via the file:// protocol (local files) and IE's security settings allow it. Once you deploy to a server (http:///https://), IE blocks ActiveX from accessing local files for security reasons—and modern browsers don't support ActiveX at all.
• localStorage Limitations: Older IE versions (IE7 and below) don't support localStorage. Even in newer IE versions, localStorage is often disabled for file:// protocol pages due to security policies, but works fine when served over HTTP/HTTPS.

Workaround Options #

Option 1: Use IE's userData Behavior (For Local File + IE Only) #

If you need to keep reading local files automatically via ActiveX and still have persistent storage in IE's local mode, replace localStorage with IE's userData behavior—it's designed for exactly this scenario (persistent storage in local/IE environments).

Here's how to modify your code:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title> test </title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
    <script>
        // Initialize userData storage
        function initUserData() {
            var storage = document.createElement('div');
            storage.style.behavior = 'url(#default#userData)';
            document.body.appendChild(storage);
            storage.load('MyStorage');
            return storage;
        }

        var storage = initUserData();
        var ct = storage.getAttribute("ct") || 0;

        function readFile(filename){
            var fso = new ActiveXObject("Scripting.FileSystemObject");
            var ForReading = 1;
            var f1 = fso.OpenTextFile(filename, ForReading);
            var text = f1.ReadAll();
            f1.close();
            return text;
        }

        // Example: Save data to userData
        function saveCt(newCt) {
            storage.setAttribute("ct", newCt);
            storage.save('MyStorage');
        }

        read = setInterval(function(){
            number = readFile("C:/rec_dice/numberOf.txt");
            split = number.substring(0,1);
            console.log("st point : " + split);
            // Example: Update and save ct
            ct++;
            saveCt(ct);
        },1000);
    </script>
</head>
<body>
    <h1>TEST for stn</h1>
</body>
</html>

Note: This only works in IE, and users may need to adjust IE's security settings to allow userData and ActiveX.

Option 2: Switch to File API (Cross-Browser, Works Local + Server) #

If you can let users manually select the local file instead of auto-reading a specific path, use the browser's native File API. This works in all modern browsers (and IE10+) both locally and on servers, and pairs perfectly with localStorage.

Here's a revised version of your code:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title> test </title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
    <script>
        var ct = localStorage.getItem("ct") || 0;
        var fileReader;
        var selectedFile;

        // Handle file selection
        function handleFileSelect(e) {
            selectedFile = e.target.files[0];
            fileReader = new FileReader();
            startReading();
        }

        function readFileContent() {
            if (!selectedFile) return;
            fileReader.onload = function(e) {
                var text = e.target.result;
                var split = text.substring(0,1);
                console.log("st point : " + split);
            };
            fileReader.readAsText(selectedFile);
        }

        function startReading() {
            setInterval(readFileContent, 1000);
        }

        // Example: Save ct to localStorage
        function saveCt(newCt) {
            localStorage.setItem("ct", newCt);
        }
    </script>
</head>
<body>
    <h1>TEST for stn</h1>
    <!-- Let user select the file -->
    <input type="file" id="fileInput" onchange="handleFileSelect(event)">
</body>
</html>

This is the most future-proof option since it avoids IE-only features and works across all environments.

Option 3: Controlled Internal Environment (Auto-Read Local File + IE) #

If you absolutely need to auto-read a specific local file without user input, you'll have to stick with IE's local mode (file:// protocol) and adjust IE's security settings:

1. Open IE > Tools > Internet Options > Security > Local intranet > Sites
2. Add file:/// to the trusted sites list
3. Lower the security level for Local intranet to allow ActiveX and userData
4. Use the userData workaround from Option 1 for storage

Warning: This is not recommended for public-facing sites, as it reduces browser security. Only use this for controlled internal systems.

Key Takeaways #

• Avoid ActiveX if possible—it's IE-only and deprecated. The File API is the standard cross-browser solution.
• userData is a legacy IE-only fix for local storage in file:// mode.
• Always prioritize cross-browser support unless you're in a strictly IE-only internal environment.

内容的提问来源于stack exchange，提问作者Jeongmin