CODEWITHSUNDEEP
javascriptjsonaxiosxmlhttprequest
Omar Spedalieri
Omar Spedalieri

Reputation: 11

get Id from online hosted Json

I'm trying to get back my jason data that i saved online with the ID that the hosting service set up for me..

const app = new Vue({
    el:'#app',
    data:{

        input:'',
        method:'',
        status:'200',
        timeStart:0,
        timeEnd:0,

        
    },

    mounted(){
     
    },

    methods:{

        http_request(){

            const url = 'https://' + this.input;
            const currentDate = new Date();
            this.timeStart = currentDate.getTime();



            axios.get(url)
                .then(res => {

                    let parser = document.createElement('a');
                    parser.href = url;
                    const protocol = parser.protocol;
                    const hostname = parser.hostname; // => "example.com"                      
                    const pathname = parser.pathname; // => "/pathname/"                                             
                    const status = res.status;
                    const method = this.method;

                    console.log(status, method);


                    var resp = {
    
                        "status": status,
                        "errors": {},
                        "data": {                                
                            "method": method,
                            "protocol": protocol,
                            "hostname": hostname,
                            "pathname": pathname,
                        }
                        
                       
                    }
                    var response = JSON.stringify(resp);

                    let req = new XMLHttpRequest();

                    req.onreadystatechange = () => {
                    if (req.readyState == XMLHttpRequest.DONE) {
                        console.log(req.responseText);

                        console.log(req);
                    }

                    };

                    req.open("POST", "https://api.jsonbin.io/v3/b", true);
                    req.setRequestHeader("Content-Type", "application/json");
                    req.setRequestHeader("X-Master-Key", "myapikey");
                    req.send(response);

                    const currentDate = new Date();
                    this.timeEnd = currentDate.getTime();

                    console.log((this.timeEnd-this.timeStart)/1000);

                   console.log(resp)

I'm able to save the json so far on https://jsonbin.io/... and it looks like this:

BIN ID: 6069e05f8be464182c5881f0
{
  "status": 200,
  "errors": {},
  "data": {
    "method": "get",
    "protocol": "https:",
    "hostname": "my-json-server.typicode.com",
    "pathname": "/lalith1403/jsonemaillist/list"
  }
}

the BIN ID is the unique ID that I need in order to show only the desired jason data.. I saw it in the response metadata but I cannot fina a way to get it..

this is the response after the json is saved:

{"record":{"status":200,"errors":{},"data":{"method":"","protocol":"https:","hostname":"my-json-server.typicode.com","pathname":"/lalith1403/jsonemaillist/list"}},"metadata":{"id":"6069e6a07d0d5e1833cee3f9","createdAt":"2021-04-04T16:17:36.929Z","private":true}}

My idea is then to make a new call with the Id attached to the url in order to get the unique data but I could be wrong..

Thx for your support

Upvotes: 0

Views: 387

Answers (1)

mochsner
mochsner

Reputation: 325

Based off their documentation, you'd definitely be able to do this! As part of the URL for the read request, you just need to do a GET request on the following URL: https://api.jsonbin.io/v3/b/<BIN_ID>/latest (you may have been missing this "latest" end of the URL, which specifies which version of the BIN_ID you want - the 1st version, 2nd version after it's been updated, 3rd, etc. Latest will just get the most recent one, which I assume is what you want.

That could look something like this:

                let id = "assigned id here"
                let req = new XMLHttpRequest();

                req.onreadystatechange = () => {
                if (req.readyState == XMLHttpRequest.DONE) {
                    console.log(req.responseText);

                    console.log(req);
                }

                };

                req.open("GET", "https://api.jsonbin.io/v3/b/" + id + "/latest", true);
                req.setRequestHeader("Content-Type", "application/json");
                req.setRequestHeader("X-Master-Key", "myapikey");
                req.send(response);

Upvotes: 1

Related Questions