将URL从URL存储到localstorage

Question

我有一个JSON字符串，如下所示，它包含图像的路径。在服务器

"send-sms":{ 
    "menu_name":"Send", 
    "menu_icon":"http:\/\/example.com\/mob\/media\/com_abcd\/icons\/send.png" 
} 

图像存在这是我的元

<meta http-equiv="Content-Security-Policy" 
     content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; img-src 'self' data: http://example.com"> 

我想将图像存储到本地会话。我使用下面的Javascipt来传递完整图片的URL。它总是返回null。

function getImageData(imgpath){ 
    var img = new Image(); 
    img.src = imgpath; 
    var data = null; 

    img.load = function() { 
     var canvas = document.createElement('canvas'); 
     document.body.appendChild(canvas); 
     var context = canvas.getContext('2d'); 
     context.drawImage(img, 0, 0); 
     data = context.getImageData(x, y, img.width, img.height).data; 
     console.log(data); 
     localStorage.setItem('mysession_imag', data); 
    }; 

} 

Answer 1

请记住，您有一个async调用。

该代码将在我在评论中提到的步骤中运行。

总之，您正在创建第二个变量，也称为data，然后无所作为。

function getImageData(imgpath){ 
    var img = new Image(); 
    img.src = imgpath; 

    // Step 1: Yes, data is `null`. You are setting it that way. 
    data = null; 

    img.load = function() { 
     var canvas = document.createElement('canvas'); 
     document.body.appendChild(canvas); 
     var context = canvas.getContext('2d'); 
     context.drawImage(img, 0, 0); 

     // Step 3: You are creating a NEW data variable 
     var data = context.getImageData(x, y, img.width, img.height).data; 

     // Step 4: And doing nothing with it. 
    }; 

    // Step 2: You are storing the `null` from step 1 
    localStorage.setItem('mysession_imag', data); 
}