Giter Site home page Giter Site logo

react-auth-client's People

Contributors

dependabot[bot] avatar funador avatar zianke avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

react-auth-client's Issues

Request tweets

Hi, i have managed to complete the authorisation stage of this tutorial, i guess this isnt really an issue but would like help or maybe help directing me to a site displaying how to fetch/request tweets once the callback has been executed and has been authorised/logged-in.

I have been on the twitter site and copied the code here : https://developer.twitter.com/en/docs/labs/tweets-and-users/quick-starts/get-tweets
and refactored to look like this on a separate twitter.js file to be imported into the App.js (App component). Heres my code:

///////////////////////////////////////start///////////////////////////////////////////////
tweet.js file

import React, { Component } from 'react';
const request = require('request');

const util = require('util')
const get= util.promisify(request.get);
const endpointURL = new URL('https://api.twitter.com/labs/1/tweets');

export default class Tweets extends Component {
state={
tweets:''
}
componentDidMount(){
async function getRequest(){
const params = {
ids: 'TLgXKh7bO0H_t9DeAAAq',
format: 'detailed',
};
const req = await get({url:endpointURL, qs: params, json:true, mode: 'cors'});
if( req.body ){
return req.body;

} else {
 console.log('not working working')
}

}

(async ()=>{
try{
const response = await getRequest();
console.log(response);
} catch(e){
console.error( e)
}
})();
}

render() {
return(



    {this.state.tweets
    ? this.state.tweets.map(el=>(
  • {el}
  • ))
    :
    Didnt fetch
    }


)
}
}

////////////////////////////////////////end//////////////////////////////////////////////

This is imported to the App.js file as such:

////////////////////////////////////////start//////////////////////////////////////////////
App.js fiile:

import React, { Component } from 'react'
import io from 'socket.io-client'
import OAuth from './OAuth'
import Loading from './Loading'
import Footer from './Footer'
import Tweets from './Tweets'
import { API_URL } from './config'
import './App.css'
const socket = io(API_URL) //,{transports: ['websocket']}
const providers = ['twitter', 'google', 'facebook', 'github']//import theese in because our auth controller needs to call our event for each provider which the event is named after the provider

export default class App extends Component {

state = {
loading: true
}

componentDidMount() {//check server and server route is working as created on server.js so to remove loading screen

socket.on('connect', function(){
  console.log('connected')
});

fetch(`${API_URL}/wake-up`)
  .then(res => {
    if (res.ok) {
      this.setState({loading: false})
    }
  })

}

render() {
const divStyles = {

}
const buttons = (providers, socket) =>
  providers.map(provider =>
    <OAuth
      provider={provider}
      key={provider}
      socket={socket}
    />
  )

return (
  <div className='wrapper'>
    <div className='container'>
      {this.state.loading
        ? <Loading />
        : buttons(providers, socket)
      }
    </div>

{
buttons
?
:

Hasnt fetched

}


)
}
}

net::ERR_CERT_AUTHORITY_INVALID

i make a react client to authentication with Openid / Facebook but have a error with HTTPS self ssl certificate . How can i fix it ? Thankyou

./node_modules/engine.io-client/lib/transports/polling-xhr.js.Request.create @ polling-xhr.js:265
Request @ polling-xhr.js:167
./node_modules/engine.io-client/lib/transports/polling-xhr.js.XHR.request @ polling-xhr.js:94
./node_modules/engine.io-client/lib/transports/polling-xhr.js.XHR.doPoll @ polling-xhr.js:124
./node_modules/engine.io-client/lib/transports/polling.js.Polling.poll @ polling.js:118
./node_modules/engine.io-client/lib/transports/polling.js.Polling.doOpen @ polling.js:63
./node_modules/engine.io-client/lib/transport.js.Transport.open @ transport.js:83
./node_modules/engine.io-client/lib/socket.js.Socket.open @ socket.js:248
Socket @ socket.js:121
Socket @ socket.js:28
./node_modules/socket.io-client/lib/manager.js.Manager.open.Manager.connect @ manager.js:226
(anonymous) @ manager.js:540
polling-xhr.js:265 GET https://localhost:4000/socket.io/?EIO=3&transport=polling&t=MTuEOt8 net::ERR_CERT_AUTHORITY_INVALID

Blank page after authentification

I'm trying to integrate you approach into my react app . I get the twitter authentication popup and it does seems to work correctly but after the authorization and the authentication the popup stuck in a blank page with this url :
127.0.0.1:8080/twitter/callback?oauth_token=xxx&oauth_verifier=xxx

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.