I'm building an files upload API.
Basically, the user will have to POST the files with his/her api_key + signature to my web service. Then my web service replies back with a JSON response. I'm wondering how can this process work asynchronously?
Assuming that the user POST the request in a form setting the target to an iframe. The JSON response will be sent back to the user on his/her iframe with content type set as "text/html". It is set as "text/html" instead of "application/json" because I want to avoid having a "pre" tag injected by the browser around the JSON response. Anyway, how does the user read that JSON response if the iframe and the parent window have different domain? There is going to be a cross domain policy issue.
Dynamically create "script" tag plus JSONP won't work in this case because I need to POST in order to upload. JSONP only works with GET requests.
Take a look at the 'Upload' example here. It uses Cross Domain messaging to pass the message back to the uploading page, and uses easyXDM to support all browsers.
This post explains how it all works!
Because of Same Origin Policy, browsers wont allow JavaScript in the main frame reading/accessing whatever content in iframe from another domain. In this case, the users will have to use easyXDM or create their own proxy -- by proxy here i mean users will have to write some code on their backend that can communicate with your API such that a post request will go directly to your server, and a get response will get from their own proxy.
Related
I have a REST API and a frontend project like react angular. The REST API have private videos and images besides json data. So, I was using Authorization header with bearer thing. The token created via jsonwebtoken as known as jwt. So, the browser javascript does not let me to add a header while using video tag or img tag. I cannot use Authorization header anymore. I think i have two choices
I will use my token in url via queryParams, like apikey.
I will use cookie, that will automatically send cookies even using video or img tag.
So, what should i do. First option is the easiest for me, i did it before. But not much secure. Https d- oest not encrypt url. A rest api should set cookie, via using set-cookie header. Is there any problem with jwt while using cookie?
It is only safe to put a JWT into the query parameters under these conditions.
Based on what I know, using a cookie to remind your REST API that your user is authenticated would be preferable.
But do not put sensitive information in cookies, even secure and httponly cookies. From MDN Cookies:
A secure cookie is only sent to the server with an encrypted request over the HTTPS protocol. Even with Secure, sensitive information should never be stored in cookies, as they are inherently insecure and this flag can't offer real protection.
There is a website and I want to access their backend api. I found a request which gives me json response, but when I change some parameters in the url, response is not changing, it's the same. I am not sure about the other parameters, but this one parameter that I want to use should change the response, but it's not.
Furthermore, when I monitor network tab in developer tools in chrome, and I send the request for the whole website, request that I want to use is listed and the response has the data I want, but when I copy that URL and send the request myself (isolated from the website) I am getting different response.
I've tried with two different locations over VPN and clearing chrome cache and it didn't work. Is there a way for this request to give the same response when caught while whole website is loading and when triggered manually?
I solved this problem by setting the appropriate request header. There was a request header that changed the api response.
I'm running a Yammer Embed script on my client's Sharepoint Online tenant, which displays conversations/messages.
I am looking to create a dropdown box that can be used to filter the messages based on which Yammer groups the user is apart of.
To make the dropdown dynamic, I need to make a call to the Yammer API to get the groups of the current user - I've been using the API call:
/api/v1/groups.json?mine=1
This gives back valid JSON with correct data when browsed to directly, however when called inside the Sharepoint Online tenant I get the following error:
XMLHttpRequest cannot load
https://www.yammer.com/api/v1/groups.json?mine=1. No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'https://client.sharepoint.com' is therefore not
allowed access. The response had HTTP status code 401.
My question: Is there a way around this? I assume Yammer would need to implement CORS for this call (doubtful on getting them to do this). I've also tried the api.yammer.com/... URL to no avail.
Cheers!
Are you using the JavaScript SDK? With that you register your JavaScript origins (where you host your custom code) on the Client Applications page, and then use the JS SDK to handle the authentication and authorization.
Most JWT tutorials I've seen say that you can attach it to the headers with AJAX. How do you attach the token on the initial page load?
For example, if a user goes to the base URL '/' and they don't have a token then show them the page. If they do have a token, redirect them to their profile page.
Edit:
I'm returning the generated token with a jquery ajax success function then redirecting the user. When the user gets to the home page ('/'), I'd like the access token to be sent via http headers to my server. Then the server can handle the request. However, anytime the user returns (if they close the browser and go to "mywebsite.com" or any other page), I'd like the server to be able to access the token. Are http headers the best way to do this?
success: function(token){
localStorage.setItem("token", token);
window.location.href('/');
}
If my application was a Single Page App (SPA), I could just use ajax all of the time, but it's not.
You cannot achieve what you want with HTTP headers. HTTP headers are something which are sent when a request is made to the server. In your case, you want to remember something about the client even if they close their website and come back later. The easiest to do that is through cookies.
Basically generate the JWT token for the client and send it to the client as a cookie. This logic will be written on the server side and there are many libraries available to do this depending on the technology you have chosen for server side. Then everytime the client makes a request to your server, browsers make sure that the stored cookies are sent.
Is it possible to use HTTP.get on the client side to retrieve some json data and store it as a string?
I need to get the JSON from this site https://blockchain.info/address/15cNko3ZtmYCba8GoaYsZ6GWFy1VCLgFji?format=json and store it as a string for later parsing.
The above site address for the wallet was chosen at random.
You can perform HTTP.get on the client. As per the documentation it's available Anywhere (Client and Server)
However, the example you've provided isn't on the same domain as your app, and hasn't provided Access-Control-Allow-Origin headers to permit cross-domain requests. So requests from the client will fail.
From Wikipedia:
The same origin policy prevents a document or script loaded from one
origin from getting or setting properties of a document from another
origin. This policy dates all the way back to Netscape Navigator 2.0.
Try typing $.ajax("https://blockchain.info/address/15cNko3ZtmYCba8GoaYsZ6GWFy1VCLgFji?format=json"); in your browser console in your application development tab.
You're likely to receive this error as response :
XMLHttpRequest cannot load https://blockchain.info/address/15cNko3ZtmYCba8GoaYsZ6GWFy1VCLgFji?format=json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access.
This is a CORS related issue which is a whole topic on itself so I suggest you google this and understand its implications.
Next, if you can control CORS settings on the domain where you're trying to fetch json from, then you need to allow cross origin requests from your web application domain, this is possible when using an amazon S3 bucket, another web application you designed, etc...
If you can't, then I'm afraid you'll have to use a Meteor.method client side to reach your Meteor server where you'll fetch the json with HTTP.get then send it back to the Meteor client.