[gist]pure and secure javascript oauth with yql

before start to do that, please let me explain “OAuth2” with this picture in feeeew word (skip to section 2 YQL is Yahoo Query Language. You can simpily use SELECT * FROM web to get you data from any website. for example you can try put the follow query in YQL Console:

select * from html where url“http://www.weibo.com/milhouse”=

amazing isn’t it, YQL will return the whole content of the website in XML or JSON.

check the bottom of YQL Console, simpily use request to THE REST QUERY will return the same thing. You don’t have to include any other third party annoying library to get your data. This is why I choose YQL other then Parse or Firebase as server side script.

Use YQL storage to keep secret safe

YQL provide online storage y.storage which allow you to store your YQL table, javascript and enviorment there. Since every thing is on sever, nobody but you can see them now.

When open YQL editor, you may curious about the 3 Key on the right side:

for each table/javascript/enviorment file you’ve create, there are 3 line for you.

1. EXECUTE: use this link when you want to execute the content.this is really important for secure your secret, I’ll explain it latter.
2. SELECT: when you just want to get the content.
3. UPDATE: when update the content.

for better understanding, let me continue the Github OAuth example.

Here’s the plan:

1. put all you secret inside enviorment file.
2. create a table, data of the table come from javascript file,
3. when the javascript is execute, request for the access_token
4. on the clientside, just request the YQL table for access_token. bang!

Create YQL Table

OK.lets do IT. First of all, we need create a table who can execute Javascript inside.

<?xml version="1.0" encoding="UTF-8"?>
    <table xmlns="http://query.yahooapis.com/v1/schema/table.xsd">      
      <meta>  
        <sampleQuery>select * from {table} where code='meow';</sampleQuery>  
      </meta>  
      <bindings>  
        <select itemPath="" produces="XML">  
          <urls>  
            <url>http://oyanglul.us/gira</url>  
          </urls>  
          <inputs>  
            <key id='CODE' type='xs:string' paramType='variable' required="true" />(ref:code)  
          <key id="CID" type="xs:string" paramType="variable"  required="true" />(ref:client-id)
              <key id="CSC" type="xs:string" paramType="variable"  required="true" />(ref:client-secret)
            </inputs>
            <execute><![CDATA[
         y.include('store://KqAGbe0nt2yi3bAnQQXxOx'); (ref:js-select)
      ]]></execute>         
        </select>    
      </bindings>  
    </table>

FYI, the at the bottom, request this url from you client side javascript code. That’s is, without expose client_secret safely get access_token from pure client side javascript.