I have one application in angularJs where I use $location.protocol() + '://' + $location.host() when I'm dealing with API calls.
Example:
return $http({
method: 'GET',
url: $location.protocol() + '://' + $location.host() + '/rest/api/category/category',
headers: {
'Jwt-token': store.get('jwt')
}
})
Now I'm building another application in VUEjs and i also wan't to use same "$location" logic to call API, but I don't know how.
My current implementation is hardcoding url
Example:
getCategories() {
fetch(`http://myapp.test/rest/api/category/category`, {
method: 'GET'
})
.then(response => response.json())
.then(json => this.categories = json)
}
How to properly "translate/convert" the code ($location.protocol() + '://' + $location.host()) from my Angular app to VueJs? If you need any additional information's please let me know and I will provide! Thank you!
Use can use the DOM api inside Vue applications:
document.location.protocol for protocol
document.location.host for the current host
or just document.location.origin for protocol+'://'+host
Related
I think TFS RESTful api has a bug. I am trying to access it using an Angular web app. Our TFS server is corporate internal. Here is my code:
var path = 'http://tfs.mycompany.com/tfs/mycompany/_apis/wit/queries?$depth=1&$expand=all&api-version=2.2';
var config = { withCredentials: true };
$http.get(path, config)
.then(function (response) {
$scope.resultList = response.data.d.results || [ response.data.d ];
$scope.message = 'Found ' + $scope.resultList.length + ' item' + ($scope.resultList.length == 1 ? '':'s');
}, function (response) {
$scope.resultList = [];
$scope.message = 'Error ' + response.status + ' ' + JSON.stringify(response.data);
});
The request goes to the server, and the server responds with OK 200. However, the browser (Chrome) blocks the data, and tells me:
A wildcard '*' cannot be used in the 'Access-Control-Allow-Origin' header
when the credentials flag is true. Origin 'http://localhost' is therefore
not allowed access. The credentials mode of an XMLHttpRequest is controlled
by the withCredentials attribute.
The request headers have Origin:http://localhost
The response headers have Access-Control-Allow-Origin:*
Is there any way for me to tell TFS to not return * in the Access-Control-Allow-Origin? This seems like a serious bug in TFS, which renders the RESTful api practically useless for web apps!
You may check Cross-origin resource sharing (CORS) example below to add Authorization in your code:
$( document ).ready(function() {
$.ajax({
url: 'https://fabrikam.visualstudio.com/defaultcollection/_apis/projects?api-version=1.0',
dataType: 'json',
headers: {
'Authorization': 'Basic ' + btoa("" + ":" + myPatToken)
}
}).done(function( results ) {
console.log( results.value[0].id + " " + results.value[0].name );
});
});
Also, check this case to see whether it is helpful:
AJAX cross domain issue with Visual Studio Online REST API
I'm trying to add a users identity to a channel using the REST API using instructions here: https://www.twilio.com/docs/api/ip-messaging/rest/members#action-create
I'm posting to the /Channels/channelId/Members endpoint - I'm certain my request is structured correctly.
I get an error back from Twilio IP Messaging saying:
{"code": 50200, "message": "User not found", "more_info": "https://www.twilio.com/docs/errors/50200", "status": 400}
My understanding was that we can provide our own identity when we want to add someone to a Channel. How can I 'register' the user (with an email) before adding them to the Channel?
EDIT - The code:
var _getRequestBaseUrl = function() {
return 'https://' +
process.env.TWILIO_ACCOUNT_SID + ':' +
process.env.TWILIO_AUTH_TOKEN + '#' +
TWILIO_BASE + 'Services/' +
process.env.TWILIO_IPM_SERVICE_SID + '/';
};
var addMemberToChannel = function(memberIdentity, channelId) {
var options = {
url: _getRequestBaseUrl() + 'Channels/' + channelId + '/Members',
method: 'POST',
headers: {
'content-type': 'application/x-www-form-urlencoded',
},
form: {
Identity: memberIdentity,
},
};
request(options, function(error, response, body) {
if (error) {
// Getting the error here
}
// do stuff with response.
});
};
addMemberToChannel('test1#example.com', <validChannelId>);
Twilio developer evangelist here.
In order to add a user to be a member of a channel, you do indeed need to register them first. Check out the documentation for creating a user in IP Messaging.
With your code you'd need a function like:
var createUser = function(memberIdentity) {
var options = {
url: _getRequestBaseUrl() + 'Users',
method:'POST',
headers: {
'content-type': 'application/x-www-form-urlencoded',
},
form: {
Identity: memberIdentity,
}
};
request(options, function(error, response, body) {
if (error) {
// User couldn't be created
}
// do stuff with user.
});
}
Could I also suggest you take a look at the Twilio helper library for Node.js. It handles the creation of URLs like you're doing for you. The code looks cleaner too, you can create a user with the helper library like this:
var accountSid = 'ACCOUNT_SID';
var authToken = 'AUTH_TOKEN';
var IpMessagingClient = require('twilio').IpMessagingClient;
var client = new IpMessagingClient(accountSid, authToken);
var service = client.services('SERVICE_SID');
service.users.create({
identity: 'IDENTITY'
}).then(function(response) {
console.log(response);
}).fail(function(error) {
console.log(error);
});
Let me know if this helps at all.
Now that I'm looking to use Ember-cli for my front-end, I'd need to use OpenID Connect for authentication and authorisation.
Has anyone done anything like this before?. I couldn't find any examples so far. I came across 'ember-cli-simple-auth', 'ember-cli-simple-auth-oauth2', 'ember-cli-simple-auth-token'.
I'm guessing I should be using 'ember-cli-simple-token'? Has anyone tried this? if so could you point me to any examples/reading resources?
Update: (11 Jul 15 )
I've been looking into 'torii' in particular 'ember-cli-torii-azure-provider'. I could get Authorization code fine, but no Id_Token (I guess its because it isn't asking Azure AD for Id_Token ), looks like I do need to look at writing a new torii provider. As per the Torii documentation,
Torii will lookup providers in the Ember application container, so if you name them conventionally (put them in the app/torii-providers directory) they will be available automatically when using ember-cli or ember app kit.
Does it mean, in my ember-cli project, I need to create 'torii-providers' folder and create the new provider? lets say 'torii-azure-openidconnect.js'?
UPDATE:
I'm trying to create a custom Torii provider for AzureAD OpenID Connect.
I'm getting "Error: The response from the provider is missing these required response params: id_token"
Here is my custom provider :
import Ember from 'ember';
import Oauth2 from 'torii/providers/oauth2-code';
import {configurable} from 'torii/configuration';
var computed = Ember.computed;
/**
* This class implements authentication against AzureAD
* using the OAuth2 authorization flow in a popup window.
* #class
*/
export default Oauth2.extend({
name: 'azure-ad-oidc',
baseUrl: computed(function() {
return 'https://login.windows.net/' + this.get('tennantId') + '/oauth2/authorize';
}),
tennantId: configurable('tennantId', 'common'),
// additional url params that this provider requires
requiredUrlParams: ['api-version','response_mode', 'nonce'],
optionalUrlParams: ['scope'],
responseMode: configurable('responseMode', null),
responseParams: computed(function () {
return [ this.get('responseType') ];
}),
state: 'STATE',
apiVersion: '1.0',
nonce : configurable('nonce', null),
responseType: configurable('responseType', 'null'),
redirectUri: configurable('redirectUri', function(){
// A hack that allows redirectUri to be configurable
// but default to the superclass
return this._super();
}),
open: function(){
var name = this.get('name'),
url = this.buildUrl(),
redirectUri = this.get('redirectUri'),
responseParams = this.get('responseParams'),
responseType = this.get('responseType'),
state = this.get('state'),
shouldCheckState = responseParams.indexOf('state') !== -1;
return this.get('popup').open(url, responseParams).then(function(authData){
var missingResponseParams = [];
responseParams.forEach(function(param){
if (authData[param] === undefined) {
missingResponseParams.push(param);
}
});
if (missingResponseParams.length){
throw new Error("The response from the provider is missing " +
"these required response params: " + missingResponseParams.join(', '));
}
if (shouldCheckState && authData.state !== state) {
throw new Error('The response from the provider has an incorrect ' +
'session state param: should be "' + state + '", ' +
'but is "' + authData.state + '"');
}
return {
authorizationCode: authData[responseType],
provider: name,
redirectUri: redirectUri
};
});
}
});
configuration.js
torii: {
sessionServiceName: 'toriiSession',
providers: {
'azure-ad-oidc' :{
tennantId : 'tenant id',
client_id : 'client_id',
redirectUri : 'http://localhost:4200',
nonce : 'my_nonce',
responseMode : 'form_post',
responseType : 'id_token',
scope : 'openid',
apiKey : ''
}
}
},
routes/application.js
import Ember from 'ember';
export default Ember.Route.extend({
actions: {
azureLogin: function() {
this.get('torii').open('azure-ad-oidc').then(function(data) {
var authCode = this.get('toriiSession.authorizationCode');
console.log(authCode);
});
}
}
});
couldn't workout how to fix this..am I missing anything?
Please see ember-simple-auth-oidc, which implements the Authorization Code Flow of OpenID Connect and integrates with ember-simple-auth.
(I realize that the question has been asked a long time ago, but maybe it helps people who run into this in the future)
How would one format the rest uri to create a document set in SP?
The JSOM code below works fine, but I would prefer to use the REST in order to be able to call it from a workflow.
var dsresult = SP.DocumentSet.DocumentSet.create(context, parentFolder, "docsetfromjsom", docsetCtId);
I tried this format based on this MSDN article
var restQueryUrl = spAppWebUrl + "/_api/SP.AppContextSite(#target)/SP.DocumentSet.DocumentSet.create('serverrelativeurl','docsetname','ctid')?#target='spHostUrl'";
Tried other formats as well but none successful. In jsom you also need to include the context, but I am assuming that for the rest call you don't need to use it (i think). Anyone tried this before?
Thanks!
I've already answered a similar question at SharePoint StackExchange.
To summarize, it does not seem possible to create Document Set using SharePoint 2013 REST API since SP.DocumentSet.DocumentSet.create function is not accessible via REST. But you could utilize SharePoint 2010 REST API instead for that purpose.
The following example demonstrates how to create a Document Set using SharePoint 2010 REST Interface:
function getListUrl(webUrl,listName)
{
return $.ajax({
url: webUrl + "/_api/lists/getbytitle('" + listName + "')/rootFolder?$select=ServerRelativeUrl",
type: "GET",
contentType: "application/json;odata=verbose",
headers: {
"Accept": "application/json;odata=verbose"
}
});
}
function createFolder(webUrl,listName,folderUrl,folderContentTypeId)
{
return $.ajax({
url: webUrl + "/_vti_bin/listdata.svc/" + listName,
type: "POST",
contentType: "application/json;odata=verbose",
headers: {
"Accept": "application/json;odata=verbose",
"Slug": folderUrl + "|" + folderContentTypeId
}
});
}
function createDocumentSet(webUrl,listName,docSetName)
{
return getListUrl(webUrl,listName)
.then(function(data){
var folderUrl = data.d.ServerRelativeUrl + '/' + docSetName;
return createFolder(webUrl,listName,folderUrl,'0x0120D520');
});
}
Usage
Create Document Set named Orders in Documents library:
createDocumentSet(webUrl,'Documents','Orders')
.done(function(data)
{
console.log('Document Set ' + data.d.Name + ' has been created succesfully');
})
.fail(
function(error){
console.log(JSON.stringify(error));
});
I'm developing a simple node/express/jade website that fetch all the public feeds of a Facebook Page.
I create an application from wich i get client_id (APP_ID) and client_secret (APP_SECRET).
My code works, and it's okay but i wonder if this is the correct way of handling this need.
Here is the code:
var https = require('https'),
concat = require('concat-stream'),
async = require('async');
function FacebookPage(pageId) {
if (!(this instanceof FacebookPage))
return new FacebookPage(pageId);
this.pageId = pageId;
}
FacebookPage.prototype.getPublicFeeds = function (callback) {
var pageId = this.pageId;
async.waterfall([
function (done) {
var params = {
hostname: 'graph.facebook.com',
port: 443,
path: '/oauth/access_token?client_id=MY_CLIENT_ID&' +
'client_secret=MY_CLIENT_SECRET&grant_type=client_credentials',
method: 'GET'
};
https.get(params, function (response) {
//response is a stream so it is an EventEmitter
response.setEncoding("utf8");
//More compact
response.pipe(concat(function (data) {
done(null, data);
}));
response.on("error", done);
});
},
function (access_token, done) {
var params = {
hostname: 'graph.facebook.com',
port: 443,
path: '/v2.0/' + pageId + '/feed?' + access_token,
method: 'GET'
};
https.get(params, function (response) {
//response is a stream so it is an EventEmitter
response.setEncoding("utf8");
//More compact
response.pipe(concat(function (data) {
callback(null, JSON.parse(data));
}));
response.on("error", callback);
});
}]);
};
module.exports = FacebookPage;
EDIT: thank to #Tobi I can delete the part of getting the access_token by putting access_token=app_id|app_secret as explained here:
Not sure why you'd want to include to OAuth stuff (which I think can't work because you don't exchange the code for an actual access token if I understand this correctly)...
According to https://developers.facebook.com/docs/graph-api/reference/v2.0/page/feed/ you need an access token ... to view publicly shared posts., this means you can also use an app access token in the form of app_id|app_secret.
You can then use the
GET /{page_id}/feed
endpoint by passing the access_token paramenter with your app access token. I'd also recommend to use the NPM modules request or restler, these make the HTTP handling much easier.