For the past two days, I have been trying to figure out how to make use of the phonegap-facebook-plugin
What I did so far:
I created a new phonegap app (phonegap create app --id
"com.example.test" --name"app")
I cloned the repo and saved it into the app so now my app has a
plugin folder that contains the phonegap-facebook-plugin with two
platform examples in it (ios and adnroid).
I downloaded the phonegap ios app from the app store, started
phonegap serve inside the my sample app's www folder (the top www
folder - the one you're supposed to be working on), and I can see it
running on my phone.
I added the following code to the app's index.js:
onDeviceReady: function() {
app.receivedEvent('deviceready');
var fbLoginSuccess = function (userData) {
alert("UserInfo: " + JSON.stringify(userData));
}
facebookConnectPlugin.login(["public_profile"],
fbLoginSuccess,
function (error) { alert("" + error) }
);
},
I added this to my index.html:
<div class="event listening button" onclick="login();">Login with Facebook</div>
When I serve with phonegap, and open on my iphone with the phonegap app, I can see the button LOGIN WITH FACEBOOK. Clicking it doesn't do anything.
Could someone PLEASE create a SIMPLE walkthrough for the installation of this plugin?
Remove this Code :
var fbLoginSuccess = function (userData) {
alert("UserInfo: " + JSON.stringify(userData));
}
facebookConnectPlugin.login(["public_profile"],
fbLoginSuccess,
function (error) { alert("" + error) }
);
Added code in bottom of index.js
function login(){
facebookConnectPlugin.login( ["public_profile","email"],function (response) {
if(response.authResponse.userID!=''){
facebookConnectPlugin.api(response.authResponse.userID+"/?fields=id,email,first_name", ["public_profile"],
function (response) {
console.log(response);
},
function (response) {
console.log(response);
});
}
},
function (response) {
console.log(response);
});
}
And it will work. Let me know if its not working. Ty
example
Related
The application is using nodejs at the backend. Nodejs is deployed on a Cpanel using VPS and it's working fine but the react app deployed on netlify connected to it is returning: POST https://thirsty-thompson-1a4ddf.netlify.app/create-pdf 404 in the console when l click the download button.
Link to the application is below:
https://thirsty-thompson-1a4ddf.netlify.app/
Error being shown
Running application with the error shown on console
The function to download in the react app is:
createAndDownloadPdf = () => {
axios.post('/create-pdf', this.state.testeeRecords)
.then(() => axios.get('fetch-pdf', { responseType: 'blob' }))
.then((res) => {
const pdfBlob = new Blob([res.data], { type: 'application/pdf' });
saveAs(pdfBlob, "fileName.pdf" );
})
}
index.js with nodejs code. Thats the code to post data to the pdf to download.
app.post('/create-pdf', (req, res) => {
pdf.create(pdfTemplate(req.body), {}).toFile('result.pdf', (err) => { //passing getByOne json
if(err) {
res.send(Promise.reject());
}
res.send(Promise.resolve());
});
});
I am Trying to develop a react app that help me to download files to my amazon cloud.
For that i used This module
download-file-with-progressbar
Here is my code:
var dl = require('download-file-with-progressbar');
//-----------Download File-------------------
option = {
filename: 'fileName',
dir: os.tmpdir(),
onDone: (info)=>{
console.log('done', info);
},
onError: (err) => {
console.log('error', err);
},
onProgress: (curr, total) => {
console.log('progress', (curr / total * 100).toFixed(2) + '%');
},
}
dd = dl('https://nodejs.org/dist/v6.10.2/node-v6.10.2-linux-x64.tar.gz', this.option);
//-------------------------------------------
It is working fine on nodejs project. But when i used it in a react project(created using 'create-react-app') it produced following error.
TypeError: fs.createWriteStream is not a function
My idea of the project is to create a react app that help to download files to my server or cloud space. how to fix that error.
The createWriteStream is a function part of the Nodejs API, that is why it is working fine when you run it as a nodejs project.
But when you run a React app, it is your browser that executes your code and not nodejs. And browsers don't know about this API.
If you want to download a file from a React application, you have to do it through an HTTP request. You can use the fetch API for example.
This question already has answers here:
Twitter API authorization fails CORS preflight in browser
(5 answers)
Closed 4 years ago.
I'm running into a constant issue when developing in ReactJS, which is that my API calls result in 400 Bad Request errors, even though the code works fine outside of ReactJS.
Below is (A) code that runs fine locally on NodeJS, and (B) the same code in a React environment. (The dependencies have been installed in both cases.) The (A) NodeJS code runs perfectly fine, but the (B) React code yields the error:
Failed to load
https://api.twitter.com/oauth2/token?grant_type=client_credentials:
Response for preflight has invalid HTTP status code 400.
(A) Code run in Node.js:
var getBearerToken = require('get-twitter-bearer-token')
var Twitter = require('twitter');
var key = ENV.KEY;
var secret = ENV.SECRET;
getBearerToken(key, secret, (err, res) => {
if (err) {
// handle error
} else {
var client = new Twitter({
bearer_token: res.body.access_token,
});
client.get('search/tweets', {q: '#WorldCup'}, function(error, tweets, response) {
console.log(tweets);
});
}
})
(B) The exact same code run in ReactJS:
import React, { Component } from 'react';
var getBearerToken = require('get-twitter-bearer-token')
var Twitter = require('twitter');
export default class StockTwitter extends Component {
componentDidMount() {
this.setTwitter();
}
setTwitter() {
var key = ENV.KEY;
var secret = ENV.SECRET;
getBearerToken(key, secret, (err, res) => {
if (err) {
// handle error
} else {
var client = new Twitter({
bearer_token: res.body.access_token,
});
client.get('search/tweets', {q: '#WorldCup'}, function(error, tweets, response) {
console.log(tweets);
});
}
})
}
render() {
return (
<div>TBD</div>
)
}
}
Express builds a server with API and routing, you can make the call to twitter on your express server and then call through your frontend to your own backend.
Some may call it a proxy server
Scotch IO Tutorial, express and routes, it's decent
Here is an example build, forked on github with your code in it working: hcra twitter build. Haven't pulled the tweets through and displayed them or anything, but they do load. The rest is up to you, let me know if you have trouble building or running anything.
Oh yeh you will need to pull it down run git fetch and then checkout twitter-req branch.
Steps:
Create Azure mobile app with node.js backend. (server)
Create NotificationHub associated to the new mobile app. (server)
Create WinJS App (Universal Windows) in Visual Studio (client)
Associate app with App Store VS > Project > Store > Associate App with Store (client)
Include Mobile Services MobileServices.Web.js to connect with mobile services backend (client)
Connect to mobile service backend (client = new WindowsAzure.MobileServiceClient('https://.azurewebsites.net') (client)
I am having a problem trying to get the tags for push notification hub that is tied to my azure mobile service node.js backend.
I am following this blog post:
https://blogs.msdn.microsoft.com/writingdata_services/2016/04/14/adding-push-notification-tags-from-a-node-js-backend/
on how to create tags on the node.js backend.
When I call the createTags API I am presuming the tag is being created because there is no error being returned.
But when I call getTags API my error routine is firing with the error
An error occurred when retrieving installation
Error: 404 - Installation not found.TrackingId:0615f100-35fe-496e-b63d-53d39d7e1cf9_G1,TimeStamp:10/27/2016 9:46:25 PM
I can't figure out why I am getting this error?
Can anyone see what I am missing or need to do to fix this problem?
Any help would be appreciated.
createTags.js
module.exports = {
"post": function (req, res, next) {
// Get the notification hub used by the mobile app.
var push = req.azureMobile.push;
console.log('create tags installationId ' + req.body.installationId);
console.log('tags ' + req.body.tags.toString());
// Validate for and block any SID tags.
for (var i = 0; i < req.body.tags.length; i++) {
if (req.body.tags[i].search("sid:") !== -1) {
res.status(403)
.send("You cannot set '" + req.body.tags[i] + "' as a tag.");
return;
}
}
// Define an update tags operation.
var updateOperation = [{
"op": "add",
"path": "/tags",
"value": req.body.tags.toString()
}];
// Update the installation to add the new tags.
push.patchInstallation(req.body.installationId, updateOperation, function(error, response){
if(error){
console.log('An error occurred when adding tags\n\n' + error);
res.status(error.statusCode).send(error.detail);
}
else res.status(200).send();
});
}
};
getTags.js
module.exports = {
"post": function (req, res, next) {
// Get the notification hub used by the mobile app.
var push = req.azureMobile.push;
console.log('getting tags');
if (typeof req.body.installationId !== "undefined"){
push.getInstallation(req.body.installationId, function (error, response) {
if (error) {
console.log('An error occurred when retrieving installation\n\n' + error);
res.status(error.statusCode).send(error);
}
else {
console.log("got installation " + req.body.installationId + '\n\n' + JSON.stringify(response));
res.status(200).send(response);
}
});
}
else res.status(200).send();
}
};
main.js - here is my winjs app to create the tag and then check that it was created
client = new WindowsAzure.MobileServiceClient('https://<sitename>.azurewebsites.net');
client.invokeApi("createTags", {
body: {
installationId: client.push.installationId,
tags: ['public']
},
method: "post"
}).then(function (result) {
client.invokeApi("getTags", {
body: {
installationId: client.push.installationId,
},
method: "post"
}).then(function (result) {
WinJS.log(result);
completeDispatcher();
}, function (error) {
WinJS.log(error);
completeDispatcher();
});
}, function (error) {
WinJS.log(error);
completeDispatcher();
});
Update now trying to use this to create a channel first. Then register a listener.
// Request a push notification channel.
Windows.Networking.PushNotifications
.PushNotificationChannelManager
.createPushNotificationChannelForApplicationAsync()
.then(function (newChannel) {
channel = newChannel;
// Register for notifications using the new channel
Machine.Client.push.register('wns', channel.uri, ['public']).done(function (error, response) {
// store the channel
channel.removeEventListener("pushnotificationreceived", pushNotificationReceivedHandler);
channel.addEventListener("pushnotificationreceived", pushNotificationReceivedHandler);
completeDispatcher();
});
}, function (error) {
var dialog = new Windows.UI.Popups.MessageDialog(error, "Error");
dialog.showAsync().then(function () {
completeDispatcher();
});
});
For these type of issues, usually going through Notification Hubs Diagnosis guidelines should give you an idea where the problem is. The 'Verify registrations' section there might be helpful in your case.
If nothing there helps, could update the question with what you've learned?
I have a meteor application hosted on modulus.
Modulus has an api here: https://api.modulus.io/
The API code is hosted here: https://github.com/onmodulus/modulus-cli/blob/master/lib/librarian/librarian.js#L361
I want to save a domain to one of my deployments on modulus through the API.
I know this is the code I am looking to connect to: https://github.com/onmodulus/modulus-cli/blob/master/lib/librarian/librarian.js#L361
librarian.project.saveDomains = function(projectId, domains, authToken, callback) {
if(checkInit(callback)) {
librarian._http.request(util.format('/project/%s/domains?authToken=%s', projectId, authToken), 'POST', domains, callback);
}
};
And I am new to making API calls.
I believe I need to make the call from the server in my meteor app, which could be handled using a meteor method, but I don't know what the API call should look like.
I've researched online and on SO. No luck and I am battling a lack of experience with API calls so I am looking from a little direction.
I've added the http package for meteor:
meteor add http
I think the following is in the ball park, but not currently working:
POST
javascript
//save arguments object to options variable
var options = {
projectId: xxx,
domains: ["example.com"],
authToken: settings.Modulus.authToken
}
//call meteor method from client
Meteor.call('saveDomainToModulus', options, function(error, result) {
if (error)
console.log(error)
else
console.log(result)
}
});
//on server
Meteor.methods({
"saveDomainToModulus": function(options) {
var apiEndpoint = "http://api.modulus.io/project/%s/domains?authToken=" + options.authToken;
HTTP.post( apiEndpoint,
options.projectId,
options.domains,
options.authToken,
function( error, response ) {
if ( error ) {
console.log( error );
} else {
console.log( response );
}
});
}
})
Feels like I'm starting to close in on a solution, but if anyone with more experience has any feedback, let me know.