1

I'm Getting some images from API with Backward Slashes , and when I tried to display these images on my page its working fine on Chrome but on other browsers like FireFox and IE it's not working , after some googling I get to know that I have to pass URL with forward slashes , So I tried replacing it but it's not working ..

Following is the code that I tried...

Input

var test ="http:\\www.xyz.com\xy\ab\1324\1324.jpg";
var final = test.replace(/\\/g,"/");

Output

http:/www.xyz.comxyab13241324.jpg

Please Let me know where I'm going wrong , Thank you

Zac
  • 813
  • 10
  • 22
Akhil RJ
  • 312
  • 1
  • 4
  • 19
  • you should have double slash after http --- http://www.xyz.comxyab13241324.jpg – Parag Bhayani Jun 18 '16 at 11:16
  • `var test = "http:\\www..."` means that the value of `var` is `http:\www...`. What is the actual string which is coming in? If it actually contains true backslash characters, then your regexp should work fine. –  Jun 18 '16 at 11:17
  • `var test ="http:\\www.xyz.com\xy\ab\1324\1324.jpg";` throws error, because it is incorrectly escaped. It is not a valid string. – Billy Moon Jun 18 '16 at 11:17
  • Why do you have URIs with backslashes? http://stackoverflow.com/questions/3903488/javascript-backslash-in-variables-is-causing-an-error – Sebastian G. Marinescu Jun 18 '16 at 11:20
  • Sorry but the provided test data is coming from the API only so , is their any work around , with the data i have :( – Akhil RJ Jun 18 '16 at 11:29
  • Out of curiosity: What kind of API is this? Is it public? If so, please share the URL – Sebastian G. Marinescu Jun 18 '16 at 14:18

3 Answers3

1

This is not possible — with the provided example-string or anything similar.

\x is the first problem here. JavaScript thinks this is a Hexadecimal escape sequence, that's why the JavaScript-Interpreter is throwing an appropriate error:

Uncaught SyntaxError: Invalid hexadecimal escape sequence

And even if we take another example string: 'http:\\www.xyz.com\yy\ab\1324\1324.jpg' it will fail.
JavaScript thinks that the backslashes are there to escape something as Octal escape sequence — that is why just entering this string into a JS-Console and hitting return gives you back:

"http:\www.xyz.comyyabZ4Z4.jpg"

To visualize it even more, enter into your console: 'http:\\www.xyz.com\yy\ab\1324\1324.jpg'.split('');

You'll see that even \132 gets converted to Z.

I tried many things right now, like replacing/escaping, trying JSON.stringify, using a text-node, using CDATA inside a virtual XML-document, etc. etc. – nothing worked. If somebody finds a JavaScript-way for doing this, I'd be happy to know about it!

Conclusion

I don't know of any way for doing this inside JavaScript. There seems to be no chance.

Your only solution as I see it, is to escape it on the server-side.
In your case you will have to write a little server-script, that calls your used API and converts/escapes everything to be ready for your JS. And your JS calls this little server-script.

Sebastian G. Marinescu
  • 2,374
  • 1
  • 22
  • 33
  • 1
    Thanx for the suggestion , i have done the same , i have created a server side function to escape the provided string and it worked – Akhil RJ Jun 20 '16 at 06:05
0

Its working fine with escaped backslashes.

var test ="http:\\\\www.xyz.com\\xy\\ab\\1324\\1324.jpg";
var final = test.replace(/\\/g,"/");

console.log(final);
Nina Scholz
  • 376,160
  • 25
  • 347
  • 392
  • Sorry but the provided test data is coming from the API only so , is their any work around , with the data i have to make it escaped with backslashes :( – Akhil RJ Jun 18 '16 at 11:33
  • i would look at every charater of the string and make an output of it for checking. – Nina Scholz Jun 18 '16 at 11:42
  • @Akhil RJ You seem to be confused about the difference between an actual, physical backslash character, which it what is presumably coming from the server, and a backslash inside a literal JS string, which escapes the following character. To create a JS string with an actual physical backslash, like the one coming from the server, in order to test your regexp, you need to write it with an extra backslash to escape the backslash, as the answerer has done. In other words, your regexp already works; you are just creating the test data for it incorrectly. –  Jun 18 '16 at 11:49
0

Taking a guess at piecing all of these things together:

  1. Sebastian is correct in that something like var test ="http:\\www.xyz.com\xy\ab\1324\1324.jpg"; is not valid HTML.
  2. However, no API in javascript will actually easily allow you to create such a string. So, the real question is where is the string coming from? If it is some kind of buffer being decoded then your problem lies in that library, wherever it is. Given that that has to be javascript somewhere, your best bet would be to either modify the source or monkey patch it at runtime.
  3. My spidey sense tells me that your variable is a proper string, and that your regex would work properly if inserted into your real code. However, for your test case, to create a string with the \ character, you have to escape it, so you would want var test = http:\\\\www.xyz.com

One way to check your work is to use JSON.stringify to come up with the actual value that you need to type in your source code. E.g.:

var test = 'http:\\\\xyz.com';
console.log(test); // prints "http:\\xyz.com"
console.log(JSON.stringify(test)); // prints "http:\\\\xyz.com"
AnilRedshift
  • 7,937
  • 7
  • 35
  • 59
  • OP uses an _external_ API that returns something like `"http:\\www.xyz.com\xy\ab\1324\1324.jpg"` — so he has to monkey-patch the API-output on his server-side. Using _stringify_ here doesn't do it. – Sebastian G. Marinescu Jun 18 '16 at 14:12
  • Regardless of the external API it has to get into javascript *somehow*. If it is coming in as a string then the OP's string is *not possible* in javascript. E.g. there is no string in javascript such that `console.log(myString) === http:\\xyz.com\xy` Thus, it is either a (byte) buffer that is getting incorrectly parsed **inside of javascript**, or the actual input string is not what the OP's question is. – AnilRedshift Jun 18 '16 at 14:18
  • It's just not possible, that's also what I've found. But what do you mean by "a buffer that is getting incorrectly parsed inside of javascript"?! You have a short explanation or article/link on this? – Sebastian G. Marinescu Jun 18 '16 at 14:24
  • Sure, you can see for yourself by grabbing the bytes of a loaded image on your webpage: http://stackoverflow.com/a/20756091/3029173 That will give you a Byte[] array which can have all kinds of representations that a string can't. – AnilRedshift Jun 18 '16 at 14:30
  • Well, I think I got you now. But nevertheless OP is not using/mentioning any buffers, just getting an URL from an API — or is he @Akhil RJ ? – Sebastian G. Marinescu Jun 18 '16 at 14:36