My current stack is React-Native that uses a WebView with forge(v7.15) in it. My API is a symfony API and it has a authenticated route that receives the filename and returns me a BinaryFileResponse based on the file.
Basically what I'm wanting to do is:
actual:
viewer = new Autodesk.Viewing.Private.GuiViewer3D(document.getElementById('forgeViewer'));
viewer.loadModel('API_URL/route/filename');
expected:
viewer = new Autodesk.Viewing.Private.GuiViewer3D(document.getElementById('forgeViewer'));
viewer.loadModel('API_URL/route/filename', jwtToken); //or something like that.
Atm, everything works fine.
But I want to change the route to be authenticated and I don't know how I can do that, and if I can do that.
I have my JWT token saved on client-side and I want to pass it on header/or anything that helps me to achieve that.
Is there a way to use the loadModel and send a JWT token to the URL that viewer will try to load?
Related
In my angular 6 application, I’m trying to send a request to get an access token from an oauth2 provider called anilist. I’m doing it like this:
this.http.get(url, options).subscribe(result =>
{
console.log('result: ', result);
});
…where http is imported like this:
import { HttpClient } from ‘#angular/common/http';
This results in an error:
SyntaxError: Unexpected token < in JSON at position 0 at JSON.parse
This seems to be because the request is returning an html document (most likely the login page) and it obviously can’t parse it as json.
But then my question is: how does one send a request for an oauth2 token and handle the response as an html page?
Thanks.
It is a bit strange that you want to get access token via http get.
Maybe that is the problem, are you talking about this site? https://anilist.co/
https://anilist.gitbook.io/anilist-apiv2-docs/overview/oauth/authorization-code-grant
The user navigates to their site via your oAuth2 signin link
They sign in, add grant, then the browser redirects to your callback url
You change your auth code to access token via http post request. https://anilist.gitbook.io/anilist-apiv2-docs/overview/oauth/authorization-code-grant#converting-authorization-codes-to-access-tokens
I think you get an html response because
You try to get access token via http get - and here you get an unsupported method / 404 / etc error
Or you are trying to get your access token from the anilist's login page (anilist.co/api/v2/oauth/authorize) instead of the token endpoint (anilist.co/api/v2/oauth/token)
Update
It is the same case, if you are using implicit grant (because you said you are creating an angular app, which can be an SPA - therefore a public client, but in this case the access token is provided in the response) https://anilist.gitbook.io/anilist-apiv2-docs/overview/oauth/implicit-grant
I'm doing a web app based on original MEAN.js framework. When I want to request local json test file using $http.get() method in my AngularJS file, it returned my index html content.Is it a routing problem? I didnot change the original mean.js routing code(https://github.com/meanjs/mean), just added a $http.get() method in home.client.controller.js file. Can anyone help me with this? Thanks!
That is most likely happening, because you didn't define an endpoint for that particular GET request in your app.
Everytime you make a request to your server (for example a GET request to /my-request) nodejs/express are configured in MEAN.js so that your server will try to find the endpoint for that request, if it does not find any, that request will be handled by this particular code block (specified in /modules/core/server/routes/core.server.routes.js):
// Define application route
app.route('/*').get(core.renderIndex);
Which will basically render the index view.
I'm not sure if you're using a custom module or not, eitherway, if you want that request to be handled in a different way in MEAN.js, you can specify your endpoint in your custom module routes file (or in core.server.controller.js) like so:
// Define application route
app.route('/my-request').get(core.sendMyJSON);
Be careful, because this route must be placed before the one I mentioned earlier, otherwise your request will still be handled the same way and the index view will be rendered and served again.
Then you will have to create the controller that should be called to handle that request:
exports.sendMyJSON = function (req, res) {
// logic to serve the JSON file
};
This way you should be able to get it done with a few adjustments.
Side note:
I'm not entirely sure but I think if you place your JSON file in the public directory of your app you should be able to directly access it without the need for the extra logic.
When you create a Chrome extension and want to use OAuth 2.0, you can use a https://<app-id>.chromiumapp.org/* URL and be therefore able to have remote servers hit your browser instance directly (answered before - for example https://stackoverflow.com/a/30613603/61239). Does anyone know, or is able to theorize on how this works? And are you able to target any request at your browser, or does this only work for OAuth 2.0?
This is handled by the WebAuthFlow class, whose purpose is the following:
Given a provider URL, load the URL and perform usual web navigation until it results in redirection to a valid extension redirect URL.
The provider can show any UI to the user if needed before redirecting to an appropriate URL.
When the server instructs the browser to redirect to a valid extension redirect URL, that URL is instead passed to the callback function provided to chrome.identity.launchWebAuthFlow.
The 'appropriate' URLs are hardcoded in web_auth_flow.cc:
static const char kChromeExtensionSchemeUrlPattern[] =
"chrome-extension://%s/";
static const char kChromiumDomainRedirectUrlPattern[] =
"https://%s.chromiumapp.org/";
So the special URL https://<app-id>.chromiumapp.org/* only works in the context of a WebAuthFlow of the chrome.identity API. Note that the mechanism is totally internal to Chrome. The URL is never requested.
There is some static data in json format available on a web page through a rest api call made by owner of that page.
Now i want to retrieve that data in my angular app as my angular controller also exists on that page.
Is that possible?
The rest api call is already made by the owner so i don't want to make a network call again?
If data is open to all
If the JSON is accessible to anyone on the internet then you can call it in with a http request.
for example http://www.w3schools.com/angular/customers.php is a page of JSON data that anyone can access, all you have to do is make the correct http request in your app and the data will come into it.
To do a http request create a controller with code like the following
app.controller('customersCtrl', function($scope, $http) {
$http.get("http://www.w3schools.com/angular/customers.php")
.success(function(response) {$scope.names = response.records;});
});
this will add all of the data to the $scope.names.
Note
Code taken from w3schools here
I have a web application for iPhone, which will ultimately run within a PhoneGap application - but for now I'm running it in Safari.
The application needs to access tweets from Twitter friends, including private tweets. So I've implemented OAuth using the Scribe library. I successfully bounce users to Twitter, have them authenticate, then bounce back.
At this point the web app has oAuth credentials (key and token) which it persists locally. From here on I'd like it to user the Twitter statuses/user_timeline.json method to grab tweets for a particular user. I have the application using JSONP requests to do this with unprotected tweets successfully; when it accesses the timeline of a private Twitter feed, an HTTP basic authentication dialog appears in the app.
I believe that I need to provide the OAuth credentials to Twitter, so that my web application can identify and authenticate itself. Twitter recommends doing so through the addition of an HTTP Authorization header, but as I'm using JSONP for the request I don't think this is an option for me. Am I right in assuming this?
My options therefore appear to either be putting the oAuth credentials as query-string parameters (which Twitter recommends against, but documentation suggests still supports); or proxying all the Tweets through an intermediate server. I'd rather avoid the latter.
I access the Twitter API using URLs of the form
http://api.twitter.com/1/statuses/user_timeline.json?user_id=29191439&oauth_nonce=XXXXXXXXXXX&oauth_signature_method=HMAC-SHA1&oauth_timestamp=1272323042&oauth_consumer_key=XXXXXXXXXX&oauth_signature=XXXXXXXXXX&oauth_version=1.0
When user_id is a public user, this works fine. When user_id is a private user, I get that HTTP Basic Auth dialog. Any idea what I'm doing wrong? I'm hoping it's something embarrassingly simple like "forgetting an important parameter"...
The oAuth stanza needs to be exact, as per http://dev.twitter.com/pages/auth#auth-request - I ended up building an Authorization: header that I could first check with curl.
I built it using the really helpful interactive request checker at http://hueniverse.com/2008/10/beginners-guide-to-oauth-part-iv-signing-requests/
Here's a friends API request for a protected user:
curl -v -H 'Authorization: OAuth realm="https://api.twitter.com/1/friends/ids.json", oauth_consumer_key="XXXXXXXXXXXXXXXX", oauth_token="XXXXXXXXXXXXXXXX", oauth_nonce="XXXXXXXXXXXXXXXX", oauth_timestamp="1300728665", oauth_signature_method="HMAC-SHA1", oauth_version="1.0", oauth_signature="XXXXXXXXXXXXXXXX%3D"' https://api.twitter.com/1/friends/ids.json?user_id=254723679
It's worth re-iterating that as you've tried to do, instead of setting the Authorization header via e.g. jquery's beforeSend function, that for cross-domain JSONP requests (which can't add HTTP headers) you can make oAuth requests by putting all the relevant key/value pairs in the GET request. This should hopefully help out various other questioners, e.g
Set Headers with jQuery.ajax and JSONP?
Modify HTTP Headers for a JSONP request
Using only JQuery to update Twitter (OAuth)
Your request looks like it has a couple of problems; it's missing the user's oauth_token plus the oauth_signature doesn't look like it has been base64 encoded (because it's missing a hex encoded = or ==, %3 or %3D%3D respectively).
Here's my GET equivalent using oAuth encoded querystring params, which you can use in a cross-domain JSONP call:
https://api.twitter.com/1/friends/ids.json?user_id=254723679&realm=https://api.twitter.com/1/friends/ids.json&oauth_consumer_key=XXXXXXXXXXXXXXXX&oauth_token=XXXXXXXXXXXXXXXX&oauth_nonce=XXXXXXXXXXXXXXXX&oauth_timestamp=1300728665&oauth_signature_method=HMAC-SHA1&oauth_version=1.0&oauth_signature=XXXXXXXXXXXXXXXX%3D
I was struggling with similar problem of making JSONP requests from Jquery, the above answer helped just to add what I did to achieve my solution.
I am doing server to server oauth and then I send oauth token, secret, consumer key and secret (this is temporary solution by the time we put a proxy to protect consumer secret). You can replace this to token acquiring code at client.
Oauth.js and Sha1.js download link!
Once signature is generated.
Now there are 2 problems:
JSONP header cannot be edited
Signed arguments which needs to be sent as part of oauth have problem with callback=? (a regular way of using JSONP).
As above answer says 1 cannot be done.
Also, callback=? won't work as the parameter list has to be signed and while sending the request to remote server Jquery replace callback=? to some name like callback=Jquery1232453234. So a named handler has to be used.
function my_twitter_resp_handler(data){
console.log(JSON.stringify(data));
}
and getJSON did not work with named function handler, so I used
var accessor = {
consumerSecret: XXXXXXXXXXXXXXXXXXXXXX,
tokenSecret : XXXXXXXXXXXXXXXXXXXXXX
};
var message = { action: "https://api.twitter.com/1/statuses/home_timeline.json",
method: "GET",
parameters: []
};
message.parameters.push(['realm', "https://api.twitter.com/1/statuses/home_timeline.json"]);
message.parameters.push(['oauth_version', '1.0']);
message.parameters.push(['oauth_signature_method', 'HMAC-SHA1']);
message.parameters.push(['oauth_consumer_key', XXXXXXXXXXXXXXXX]);
message.parameters.push(['oauth_token', XXXXXXXXXXXXXXX]);
message.parameters.push(['callback', 'my_twitter_resp_handler']);
OAuth.completeRequest(message, accessor);
var parameterMap = OAuth.getParameterMap(message.parameters);
Create url with base url and key value pairs from parameterMap
jQuery.ajax({
url: url,
dataType: "jsonp",
type: "GET",
});