FBSDK: Cannot read property loginwithreadpermissions of undefined - javascript

I'm setting up a React Native project using the FBSDK for login purpose.
Here's what I've done so far:
I ran npm install react-native-fbsdk --save
I ran react-native link
I followed each step mentioned there: https://developers.facebook.com/docs/facebook-login/ios/
I double checked using this video: https://www.youtube.com/watch?v=rAXVKapP5cM
However, I still get this red screen error:
Cannot read property logInWithReadPermissions of undefined at FBLoginManager.js, line 77 (https://github.com/facebook/react-native-fbsdk/blob/master/js/FBLoginManager.js)
Here's my AppDelegate.m content:
#import "AppDelegate.h"
#import <FBSDKCoreKit/FBSDKCoreKit.h>
#import <React/RCTBundleURLProvider.h>
#import <React/RCTRootView.h>
#implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
NSURL *jsCodeLocation;
jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:#"index.ios" fallbackResource:nil];
RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
moduleName:#"PegaseBuzzApp"
initialProperties:nil
launchOptions:launchOptions];
rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];
[[FBSDKApplicationDelegate sharedInstance] application:application
didFinishLaunchingWithOptions:launchOptions];
self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
UIViewController *rootViewController = [UIViewController new];
rootViewController.view = rootView;
self.window.rootViewController = rootViewController;
[self.window makeKeyAndVisible];
return YES;
}
- (void)applicationDidBecomeActive:(UIApplication *)application {
[FBSDKAppEvents activateApp];
}
- (BOOL)application:(UIApplication *)application
openURL:(NSURL *)url
sourceApplication:(NSString *)sourceApplication
annotation:(id)annotation {
return [[FBSDKApplicationDelegate sharedInstance] application:application
openURL:url
sourceApplication:sourceApplication
annotation:annotation];
}
#end
Here's my linked frameworks and binaries:
EDIT: on my project:
const FBSDK = require('react-native-fbsdk');
const {
LoginManager,
} = FBSDK;
Plus:
_onFBButtonPress () {
LoginManager.logInWithReadPermissions(['public_profile']).then(
function(result) {
if (result.isCancelled) {
alert('Login cancelled');
} else {
alert('Login success with permissions: '
+result.grantedPermissions.toString());
}
},
function(error) {
alert('Login fail with error: ' + error);
}
);
}
And:
<Button onPress={() => this._onFBButtonPress()} buttonStyle={'buttonFb'} labelStyle={'buttonFbText'} label={I18n.t('Login.btnConnectFB')}></Button>
What do I miss?

I just resolved the same error.
For some reason
"react-native link react-native-fbsdk"
had finished for Android but not ios.
rnpm-install info Android module react-native-fbsdk is already linked
rnpm-install info Linking react-native-fbsdk ios dependency
rnpm-install info iOS module react-native-fbsdk has been successfully linked
Try rerunning and make sure you are linking with
libRCTFBSDK.a

Following #Greg Cockroft's answer, I've noticed that I was not being able to include "libRCTFBSDK.a" on my project's "Link Binary With Libraries" because I was not including the "RCTFBSDK" library project.
So if you are on same situation do the following missing steps:
Add (or drag using Finder) "/node_modules/react-native-fbsdk/ios/RCTFBSDK.xcodeproj" under your Xcode project "Libraries" group.
Build "RCTFBSDK.xcodeproj" or your entire project.
Add "libRCTFBSDK.a" on your project settings, under "Link Binary With Libraries".
Compile/run your app. Now if you have the right JS login code, you should be able to login via Facebook's screen.

Use the function LoginManager.logInWithPermissions(['public_profile', 'email']);

Once you did this:
npm install react-native-fbsdk --save
react-native link
Download latest FacebookSDK to your ~/Documents folder.
Unzip it to ~/Documents/FacebookSDK/
Then rebuild in XCode.
Works for me.

solved by adding to metro.config.js. And make sure you have installed metro-config
const blacklist = require('metro-config/src/defaults/blacklist');
module.exports = {
resolver: {
blacklistRE: blacklist([
/node_modules\/.*\/node_modules\/react-native\/.*/,
])
},
};

Related

FundMe project isn't deploying and getting "No deployment found for: MockV3Aggregator"

When I run this command yarn hardhat deploy --tags fundme I'm getting this MockV3Aggregator error.
Error: ERROR processing /Users/mohameduzair/blockChain/JSweb3_2/fundMe_hardhat/deploy/01-deploy-fundMe.js:
Error: No deployment found for: MockV3Aggregator at Object.get (/Users/mohameduzair/blockChain/JSweb3_2/fundMe_hardhat/node_modules/hardhat-deploy/src/DeploymentsManager.ts:162:17)
01-deploy-fundMe.js deploy script
```module.exports = async ({ getNamedAccounts, deployments }) => {
const { deploy, log } = deployments
const { deployer } = await getNamedAccounts()
const chainId = network.config.chainId
let ethUsdPriceFeedAddress
if (developmentChains.includes(network.name)) {
// if (chainId === 31337) {
const ethUsdAggregator = await deployments.get("MockV3Aggregator")
ethUsdPriceFeedAddress = ethUsdAggregator.address
} else {
ethUsdPriceFeedAddress = networkConfig[chainId]["ethUsdPriceFeed"]
}
const fundMe = await deploy("FundMe", {
from: deployer,
args: [ethUsdPriceFeedAddress],
log: true,
})
log(`FundMe deployed at ${fundMe.address}`)
log(`-------------------------!!!--------------------------`)
}
module.exports.tags = ["all", "fundme"]
```
MockV3Aggregator.sol contract
// SPDX-License-Identifier: MIT
pragma solidity ^0.6.0;
// pragma solidity >=0.6.6 <0.8.7;
import "#chainlink/contracts/src/v0.6/tests/MockV3Aggregator.sol";
I', new to the Blockchain technologies. I'm following a tutorial on Youtube. I've tried my best. still can not fix this.
What should I do now?
Thank you
This is Patrick's tutorial, and you need to first deploy the mock.
Please see here.
After spending 5 hours, I fixed the bug. It was an extra {curly brace} in my code and a deployment error.
If you are following Patrick's tutorial and getting this error then you are probably missing network.name in either of deploy files.
Instead of network.name you have typed only network
Instead of
module.exports.tags = ["all", "fundme"]
in 01-deploy-fundMe.js, use
module.exports.tags = ["all", "mocks"]
and then use command
yarn hardhat deploy --tags mocks
;)

OpenSea Error - Please use providerUtils.standardizeOrThrow()

I'm having trouble using the openseas.js library. I'm trying to do a getAsset call on a random asset on openseas I found, but I keep getting
Error: DEPRECATED: Please use providerUtils.standardizeOrThrow() instead supportedProvider.send.toString(...).replaceAll is not a function
Full Error:
I'm currently on node v16.14.2.
How can I resolve this issue? I appreciate the help!
const Web3 = require("web3");
import { OpenSeaPort, Network } from "opensea-js";
import { OpenSeaAsset } from "opensea-js/lib/types";
// This example provider won't let you make transactions, only read-only calls:
const provider = new Web3.providers.HttpProvider("https://mainnet.infura.io");
const seaport = new OpenSeaPort(provider, {
networkName: Network.Main,
});
(async function main() {
try {
//random asset I found on OpenSea
const asset: OpenSeaAsset = await seaport.api.getAsset({
tokenAddress: "0x20ed6cdf9344b3a187063a3ff4d883b6b1947b81", // string
tokenId: 220, // string | number | null
});
console.log("Asset", asset);
} catch (e) {
console.log("ERROR", e);
}
});
"dependencies": {
"opensea-js": "^3.0.2",
"typescript": "^4.6.3",
"web3": "^1.7.3",
"web3-provider-engine": "^16.0.3"
}
First, check the obvious things—since I know these bite me from time to time—clear your node_modules and reinstall, make sure your package-lock.json matches the versions you expect from package.json, make sure you're not running from a previous build, etc...
My guess is that something in your project is importing/using old versions of some of the 0xProject libs. Run npm list --all and see which ones are imported.
Worst case: that error is coming from the isWeb3Provider function in the 0xProject/assert project -- grep -r in your node_modules for something calling isWeb3Provider. Hopefully that'll give a clue.

Expo IntentLauncher can't open Application_Details_Settings

I want to open the details settings of my application from the app itself.
I use the IntentLauncher from Expo itself: https://docs.expo.io/versions/latest/sdk/intent-launcher
The code I use that I assume should work is:
IntentLauncher.startActivityAsync(IntentLauncher.ACTION_APPLICATION_DETAILS_SETTINGS)
But this gives me this error:
[Unhandled promise rejection: Error: Encountered an exception while calling native method: Exception occurred while executing exported method startActivity on module ExpoIntentLauncher: null]
I'm not sure if I should give some kind of parameter with it so it links to my app?
Opening all other settings does work, ex:
IntentLauncher.startActivityAsync(IntentLauncher.ACTION_APPLICATION_SETTINGS)
This does open a list off all apps, I just need to get the detailed screen of the app itself, not the list.
I found this solution by bodolsog working.
Complete solution
import * as IntentLauncher from "expo-intent-launcher";
import Constants from "expo-constants";
const pkg = Constants.manifest.releaseChannel
? Constants.manifest.android.package // When published, considered as using standalone build
: "host.exp.exponent"; // In expo client mode
IntentLauncherAndroid.startActivityAsync(
IntentLauncherAndroid.ACTION_APPLICATION_DETAILS_SETTINGS,
{ data: 'package:' + pkg },
)
Hope this helps someone
import { startActivityAsync, ActivityAction } from 'expo-intent-launcher';
import * as Linking from 'expo-linking';
import Constants from 'expo-constants';
const pkg = Constants.manifest.releaseChannel
? Constants.manifest.android.package // When published, considered as using standalone build
: 'host.exp.exponent'; // In expo client mode
openSettings = async () => {
try {
if (Platform.OS === 'android') {
// console.log(Constants);
startActivityAsync(ActivityAction.APPLICATION_DETAILS_SETTINGS, {
data: 'package:' + pkg,
});
}
if (Platform.OS === 'ios') {
Linking.openSettings();
}
} catch (error) {
console.log(error);
}
};

API client in Javascript

I need a little help to solve a problem in my project.
Scenario:
First: I have a SPA web site that is being developed in Vue.js.
Second: I also have a Web API spec in Swagger that I want to use to generate my client code in Javascript.
Lastly: I'm using swagger-codegen-cli.jar for that.
What I've done until now
1 - Download the last swagger-codegen-cli.jar stable version with javascript support:
curl http://central.maven.org/maven2/io/swagger/swagger-codegen-cli/2.4.7/swagger-codegen-cli-2.4.7.jar -o swagger-codegen-cli.jar
2 - Generate the client code using:
java -jar swagger-codegen-cli.jar generate -i http://192.168.0.85:32839/api/swagger/v1/swagger.json -l javascript -o ./web_api_client/
3 - Add the generated module to my project:
"dependencies": {
// ...
"vue": "^2.6.10",
"vue-router": "^3.0.3",
"web_api_client": "file:./web_api_client"
},
4 - Execute npm install. Apparently, it's working fine.
5 - At this moment I faced the problem. For some reason, the module generated isn't loaded completely.
export default {
name: 'home',
components: {
HelloWorld
},
mounted() {
var WebApiClient = require("web_api_client");
var defaultClient = WebApiClient.ApiClient.instance;
var oauth2 = defaultClient.authentications["oauth2"];
oauth2.accessToken = "YOUR ACCESS TOKEN";
var apiInstance = new WebApiClient.VersaoApi();
var callback = function(error, data, response) {
if (error) {
console.error(error);
} else {
console.log('API called successfully. Returned data: ' + data);
}
};
apiInstance.apiVersaoGet(callback);
}
}
6 - The line var WebApiClient = require("web_api_client"); is working without any error, however, not working 100%. The instance of the module has been created but empty. For instance, WebApiClient.ApiClient is always undefined.
7 - I took a look at the generated code and I think the problem is related with the way the module is being loaded.
(function(factory) {
if (typeof define === 'function' && define.amd) {
// AMD. Register as an anonymous module.
define(['ApiClient', 'api/VersaoApi'], factory);
} else if (typeof module === 'object' && module.exports) {
// CommonJS-like environments that support module.exports, like Node.
module.exports = factory(require('./ApiClient'), require('./api/VersaoApi'));
}
}(function(ApiClient, VersaoApi) {
'use strict';
// ...
In this code, neither of ifs blocks are executed.
Has someone faced a problem like that?
Some advice?
Many thanks, folks.
Solution
After a while trying to fix the problem with require("web_api_client"); I decided to use ES6 instead ES5.
I found an option in swagger-codegen-cli.jar to generate the client code using ES6 as shown below:
java -jar swagger-codegen-cli.jar generate -i http://192.168.0.85:32839/api/swagger/v1/swagger.json -l javascript --additional-properties useES6=true -o ./web_api_client/
Using ES6 I was able to import the javascript module direct from the generated source as shown in the code below.
import WebApiClient from "./web_api_client/src/index";
let defaultClient = WebApiClient.ApiClient.instance;
defaultClient.basePath = 'http://192.168.0.85:32839';
// Configure OAuth2 access token for authorization: oauth2
let oauth2 = defaultClient.authentications["oauth2"];
oauth2.accessToken = "YOUR ACCESS TOKEN";
let apiInstance = new WebApiClient.VersaoApi();
apiInstance.apiVersaoGet((error, data, response) => {
if (error) {
console.error(error);
} else {
console.log("API called successfully. Returned data: " + data + response);
}
});
When I first ran the code I got an error because the module WebApiClient generated didn't have the keyword default in the export block.
Original generated code
export {
/**
* The ApiClient constructor.
* #property {module:ApiClient}
*/
ApiClient,
// ...
Alter changed
export default {
/**
* The ApiClient constructor.
* #property {module:ApiClient}
*/
ApiClient,
// ...
Now everything is working fine.

ionic.bundle.js:25642 Error: [$injector:unpr] Unknown provider: $cordovaGeolocationProvider <- $cordovaGeolocation <- AgeCtrl

I am currently in the starting phase of building an app via Ionic. Right now i want to implement the cordova geolocation in it. However this keeps giving an error when opening it. For testing purposes i use ionic serve and check it in localhost.
angular.module('starter', ['ionic','ionic.service.core', 'ui.router'])
.controller('AgeCtrl', function ($scope, $state, $http, $cordovaGeolocation) {
$scope.toggleItem = function (item) {
item.checked = !item.checked;
};
$scope.items = [
{ id: '0-12' },
{ id: '12-18' },
{ id: '18-30' },
{ id: '30-65' },
{ id: '65+' }
];
$scope.time = Date.now();
$scope.weather = $http.get("http://api.openweathermap.org/data/2.5/weather?q=Amsterdam&units=metric&APPID=...").then(function(resp) {
console.log("success", resp);
}, function(err) {
console.log("error");
})
var posOptions = {timeout: 10000, enableHighAccuracy: false};
$cordovaGeolocation
.getCurrentPosition(posOptions)
.then(function (position) {
var lat = position.coords.latitude
var long = position.coords.longitude
console.log(lat + ' ' + long)
}, function(err) {
console.log(err)
});
$scope.Confirm = function (){
$state.go('home');
}
})
Is there any place i have made a mistake which causes this problem?
Ionic serve only emulates the application in the browser.
You do not get access to the Cordova plugins within the browser.
To get the libraries included you need to run the app on the device after adding a specific platform depending on what device you have.
For iOS:
Ionic platform add ios
For android:
ionic platform add android
After the platforms are added you can build and run on device using the following command
For iOS:
ionic run iOS
For android:
ionic run android
I believe the issue is with your ngCordova installation .
do below steps -
1- install --------------> bower install ngCordova
2- include in index.html above cordova.js ------------------> script src="lib/ngCordova/dist/ng-cordova.js"
3- inject -------------> angular.module(starter, ['ngCordova'])
run IONIC serve and issue will be gone .. If it still shows error that /dist/ngCordova is not present then go to location manually where ng cordova is installed and copy it to the path e.g. - /lib/ngCordova/dist/...
it will definitely resolve your issue
I think it's not referenced as $cordovaGeolocation in ionic. Try navigator.geolocation.getCurrentPosition instead?

Categories

Resources