html5 - Objeto JavaScript localStorage roto en IE11 en Windows 7





windows-7 local-storage internet-explorer-11 (4)


No es solo culpa de IE11.

Probablemente WEINRE se inyecte en la página. Se conecta a varias funciones del sistema para proporcionar funcionalidad de herramientas de desarrollo , pero IE11 interpreta localStorage las asignaciones a las propiedades localStorage y sessionStorage , y convierte las funciones de localStorage en cadenas, como si fueran los datos que se van a almacenar.

Hay un comentario en el repo de apache / cordova-weinre que dice:

        #In IE we should not override standard storage functions because IE does it incorrectly - all values that set as
        # storage properties (e.g. localStorage.setItem = function()[...]) are cast to String.
        # That leads to "Function expected" exception when any of overridden function is called.
        object[property] = hookedFunction  unless navigator.userAgent.match(/MSIE/i) and (object is localStorage or object is sessionStorage)

Parece que se está utilizando una versión anterior de WEINRE, o este cambio no se ha lanzado oficialmente ( ha estado allí desde 2013 ).

El objeto localStorage en Internet Explorer 11 (compilación de Windows 7) contiene representaciones de cadena de ciertas funciones en lugar de llamadas nativas como era de esperar.

Esto solo se rompe con el JavaScript vainilla y los sitios como JSFiddle no tienen ningún problema con este código, pero sospecho que es porque hay localStorage que lo corrigen.

Tome este código de página HTML, por ejemplo:

<!DOCTYPE html>
<script>
  localStorage.setItem('test', '12345');
  alert(localStorage.getItem('test'));
  localStorage.clear();
</script>

Esto funciona perfectamente bien en todos mis navegadores instalados excepto IE11. Se produce un error en la primera línea ' SCRIPT5002: Función esperada '.

Echando un vistazo a qué tipo de la función setItem es realmente en la consola de herramientas de desarrollador de IE, afirma que es una cadena ...?

    typeof localStorage.setItem === 'string' // true

Imprimir la cadena para setItem muestra lo siguiente:

"function() {
var result;
callBeforeHooks(hookSite, this, arguments);
try {
result = func.apply(this, arguments);
} catch (e) {
callExceptHooks(hookSite, this, arguments, e);
throw e;
} finally {
callAfterHooks(hookSite, this, arguments, result);
}
return result;
}"

Por extraño que parezca, no todas las funciones han sido reemplazadas por cadenas, por ejemplo, la función getItem correspondiente es de hecho una función y funciona como se esperaba.

    typeof localStorage.getItem === 'function' // true

Cambiar el modo de documento (emulación) a 10 o 9 aún no resuelve el problema y ambos producen el mismo error. Al cambiar el modo de documento a 8, aparece el siguiente error "El objeto no admite esta propiedad o método ", que se espera porque IE8 no admite localStorage .

¿Hay alguien más que tenga el mismo problema con IE11 en Windows 7 donde el objeto localStorage parece 'roto / dañado'?




Resulta que esto es un problema en la versión base de IE11 (11.0.9600.16428) para Windows 7 SP1.

Después de instalar un parche para actualizar a 11.0.9600.16476 (actualización de la versión 11.0.2 - KB2898785), el problema se resuelve. Los enlaces a otras versiones de Windows (32 bits, etc.) se pueden encontrar en la parte inferior de la página de descarga del parche .




Mi localStorage regresó indefinido y no pude entender por qué, hasta que me di cuenta de que era porque estaba ejecutando la página HTML (con el script localStorage) directamente desde mi computadora (archivo: /// C: / Users / .. .). Cuando accedí a la página desde un servidor / localhost, en su lugar, localStorage realmente se definió y trabajó.




Llegué a esta pregunta porque buscaba una forma sencilla de mantener una colección de complementos de JavaScript útiles. Después de ver algunas de las soluciones aquí, se me ocurrió esto:

  1. Configura un archivo llamado "plugins.js" (o extensions.js o lo que sea). Mantenga sus archivos de complementos junto con ese archivo maestro.

  2. plugins.js tendrá una matriz llamada "pluginNames []" que repetiremos en cada (), luego agregaremos una etiqueta a la cabeza para cada complemento

    // configurar la matriz para que se actualice cuando agregamos o eliminamos archivos de complemento var pluginNames = ["lettering", "fittext", "butterjam", etc.]; // una etiqueta de script para cada complemento $ .each (pluginNames, function () {$ ('head'). append ('');});

  3. manualmente llame solo el archivo en su cabeza:
    <script src="js/plugins/plugins.js"></script>

Descubrí que a pesar de que todos los complementos se caían en la etiqueta de la cabeza de la forma en que debían hacerlo, el navegador no siempre los ejecutaba al hacer clic en la página o actualizar.

Descubrí que es más confiable simplemente escribir las etiquetas de script en un PHP incluido. Solo tienes que escribirlo una vez y eso es tanto trabajo como llamar al complemento usando JavaScript.







javascript html5 windows-7 local-storage internet-explorer-11