CORS (Cross Origin Resource Sharing) and Disabling Web Security

CORS (Cross Origin Request Policy) and Disabling Web Security



You might have come to this error XMLHttpRequest cannot load xxx.com/xxx/... No 'Access-Control-Allow-Origin' header is present on the requested resource.Origin abc.com is therefore not allowed to access. Here abc.com want to access resources of xxx.com, but browser is telling it is not allowed to access the resource since 'Access-Control-Allow-Origin' header is not present. This is due to cross origin resource sharing(CORS) policy.

According to w3c specification, cross domain communication is possible. That is abc.com can access the resources of xxx.com provided xxx.com should allow others to access its resources. Xxx.com can allow others to access its resources by setting 'Access-Control-Allow-Origin' to its response header. If it is not set, then the resources can not be accessed from other domains. Usually 'Access-Control-Allow-Origin' is set for public data.

If you are a web developer, you might have faced this above issue. For Google chrome, you will get some relax by disabling web security. That is you can still access the data from other domain even if  'Access-Control-Allow-Origin' is not set by disabling web security in chrome browser.

To disable web security, make a shortcut for chrome on desktop, and in the shortcut properties add the parameter --disable-web-security at the end of chrome executable path.

"C:\Program Files\Google\Chrome\Application\chrome.exe" --disable-web-security

Close all chrome windows/tabs and start Chrome using this shortcut icon. If web security is disabled, you will  see the yellow bar below the address bar with the warning message.

Object Oriented Javascript using Mozart

Object Oriented Javascript using Mozart

"Do java like programming in javascript." We can develop web applications following OOPs concepts with mozart js. It also helps to develop mvc architecture. Mozart is inheritance library.
It has got following features

  • Simple subclassing.
  • Private and protected methods and properties.
  • Intuitive super method calling.
  • Dynamic getter and setter generation.


Reference: https://github.com/philipwalton/mozart

Chrome Developer Tools: Break point on Exceptions or Error

Chrome Developer Tools: Break point on Exceptions or Error

Today I found a good feature in chrome developer tools which pause the execution of Javascript code on exceptions or errors. This will definitely help in debugging js code.


splice() - Push or pop to array at position


splice() - Add or remove elements to array at position

I have been trying to push an element to array at position. I found splice() method in javascript as a solution.

splice() can be used for adding/removing elements in array at given position.

Array.splice(position, numberOfElementsToRemoveFromPosition, ElementsToPushAtPosition)

Eg:
var array1=[1,2,3,4,5]

Adding at "0" added to 0th position
array1.splice(0,0,0)

array1 -> [0, 1, 2, 3, 4, 5]

Adding "6" at 6th position
array1.splice(6,0,6)

array1 -> [0, 1, 2, 3, 4, 5, 6]

Removing 2 elements from 2nd index , ie removing 2 and 3
array1.splice(2,2)
[2, 3]
array1 -> [0, 1, 4, 5, 6]

adding 2 elements at 2nd index , ie adding 2 and 3
array1.splice(2,0,2,3)
[]
array1 -> [0, 1, 2, 3, 4, 5, 6]

Removing "6" at 6th position and adding "7" and "8"
array1.splice(6,1,7,8)
[6]
array1 -> [0, 1, 2, 3, 4, 5, 7, 8]

References:
http://www.w3schools.com/jsref/jsref_splice.asp
https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/splice

_.pluck - Pluck attribute values from array of objects

_.pluck() - Pluck attribute values from array of objects

I came to know a very useful function from underscorejs, _.pluck()  which will return array of attribute values of objects from Array of objects, ie pluck attribute values from array of objects.
eg: var data = [
                {
                    "name": "India",
                    "population": "120",
                    "currency": "Indian rupee",
                    "id": ""
            },
                {
"name": "China",
                    "population": "125",
                    "currency": "Renminbi",
                    "id": ""
            },
                {
                  "name": "USA",
                    "population": "50",
                    "currency": "US Dollars",
                    "id": ""
    }
   ]

  _.pluck(data,"name")
["India", "China", "USA"]