locked
Problems with file paths containing #

    Question

  • Hello,
    I have some image files in my local folder whose name contains a # and when I try to display them in my app via css by referencing "ms-appdata:///local/filepath" I get an error in the javascript console that says "resource not found". I assume that because of the # the URL is interpreted as a fragment URL and, as such, is not interpreted correctly as an image. #, however, is a valid character for file names in Windows, which makes this confusing.

    I already have a workaround for this issue:

        fileName= fileName.Replace("#", "%23")

    replaces # with its URL Encoding, making it safe. However, as I said, it's not very intuitive for app developing since you can save image files with # in the name. 

    Friday, March 29, 2013 5:48 PM

Answers

  • Should use "encodeUriComponent(filename)" rather than replace.

    - Girija


    • Edited by Girija Beuria Friday, March 29, 2013 8:18 PM
    • Marked as answer by Song Tian Thursday, April 4, 2013 8:52 AM
    Friday, March 29, 2013 8:18 PM
  • Hi travelingsw,

    As Girija suggested, you can use the built-in javascript function to encode special parameter string in url. Or you can directly call "escape" function to encode individual charater. Here is the test code (works for a simple test windows store app page) for your reference:



    // image file name is "test#image.png" within app local folder
    
    document.getElementById("imgTest").src = "ms-appdata:///local/test/test%23image.png";
    
    document.getElementById("imgTest").src = "ms-appdata:///local/test/canvas" + escape("#") + "image.png";
    
    document.getElementById("imgTest").src = "ms-appdata:///local/test/" + encodeURIComponent("canvas#image.png");
    

     


    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    • Marked as answer by Song Tian Thursday, April 4, 2013 8:52 AM
    Monday, April 1, 2013 5:26 AM
    Moderator

All replies

  • Should use "encodeUriComponent(filename)" rather than replace.

    - Girija


    • Edited by Girija Beuria Friday, March 29, 2013 8:18 PM
    • Marked as answer by Song Tian Thursday, April 4, 2013 8:52 AM
    Friday, March 29, 2013 8:18 PM
  • Hi travelingsw,

    As Girija suggested, you can use the built-in javascript function to encode special parameter string in url. Or you can directly call "escape" function to encode individual charater. Here is the test code (works for a simple test windows store app page) for your reference:



    // image file name is "test#image.png" within app local folder
    
    document.getElementById("imgTest").src = "ms-appdata:///local/test/test%23image.png";
    
    document.getElementById("imgTest").src = "ms-appdata:///local/test/canvas" + escape("#") + "image.png";
    
    document.getElementById("imgTest").src = "ms-appdata:///local/test/" + encodeURIComponent("canvas#image.png");
    

     


    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    • Marked as answer by Song Tian Thursday, April 4, 2013 8:52 AM
    Monday, April 1, 2013 5:26 AM
    Moderator