Javascript: Hiding/Making it difficult to understand client objects

Question

Is there any known way to "hide" or to just make it difficult for users to see and understand my client side objects (which is store as JSON object)? The reason i want that is because i don't want others to simply copy my data.

Consider the fact i'm getting my data from server side and instead of just fetching it as is to a JSON object, I am guessing i could add some algorithm which mixes the data on the server, and only i could know how to plug it back on the client.

I am of course aware to the fact this is not a 100% hiding solution since everything is still visible on the client side.

I hope my question phrased well enough to understand my goal.

Answer 1

I guess you just want to encode the json object and store/use it on the client side.

If my understanding is right, the following way you may consider. The idea is encoding our data from server and decoding it in client. While this way is not perfectly invisible for users, but after minifying the scripts, it will takes much time and effort to get the decoded data than just store json in a client variable.

For example, in server side:

var json = {
  name: 'Alex',
  age: 25,
  location: 'LA'
};

function utf8_to_b64(str) {
  // or something equivalent in your lang. Here we use nodejs
  return new Buffer(str).toString('base64');
}

var json_str = JSON.stringify(json);
// "{"name":"Alex","age":25,"location":"LA"}"

send_to_client(utf8_to_b64(json_str));
// "eyJuYW1lIjoiQWxleCIsImFnZSI6MjUsImxvY2F0aW9uIjoiTEEifQ=="

client side:

function b64_to_utf8(str) {
  return decodeURIComponent(escape(window.atob(str)));
}

var got_from_server = "eyJuYW1lIjoiQWxleCIsImFnZSI6MjUsImxvY2F0aW9uIjoiTEEifQ==";

var decoded = b64_to_utf8(got_from_server);
// "{"name":"Alex","age":25,"location":"LA"}"

var boom = JSON.parse(decoded);
// get our 'real' json back!

Hope this helps

ref: Base64 encoding and decoding from MDN