Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/casdoor/casdoor-nodejs-react-example
Node.js Express + React example app for Casdoor based on casdoor-nodejs-sdk and casdoor-js-sdk
https://github.com/casdoor/casdoor-nodejs-react-example
casdoor express iam js node nodejs oauth oidc react sso
Last synced: 2 months ago
JSON representation
Node.js Express + React example app for Casdoor based on casdoor-nodejs-sdk and casdoor-js-sdk
- Host: GitHub
- URL: https://github.com/casdoor/casdoor-nodejs-react-example
- Owner: casdoor
- License: apache-2.0
- Created: 2022-12-09T07:13:29.000Z (about 2 years ago)
- Default Branch: master
- Last Pushed: 2023-11-12T18:27:38.000Z (about 1 year ago)
- Last Synced: 2024-02-22T12:37:42.996Z (11 months ago)
- Topics: casdoor, express, iam, js, node, nodejs, oauth, oidc, react, sso
- Language: JavaScript
- Homepage: https://github.com/casdoor/casdoor-nodejs-sdk
- Size: 4.67 MB
- Stars: 4
- Watchers: 3
- Forks: 10
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Casdoor NodeJS React Example
## Demo
## Architecture
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app) and [Express](https://expressjs.com/).
The example includes two parts:
| Name | SDK | Language | Source code |
|----------|--------------------|----------------------|-----------------------------------------------------------------------------|
| Frontend | casdoor-js-sdk | Javascript + React | https://github.com/casdoor/casdoor-nodejs-react-example/tree/master/src |
| Backend | casdoor-nodejs-sdk | JavaScript + Express | https://github.com/casdoor/casdoor-nodejs-react-example/tree/master/backend |
## Installation
Example uses Casdoor to manage members. So you need to create an organization and an application for the example in a Casdoor instance.
### Necessary Configurations
#### Get the Code
```shell
git clone https://github.com/casdoor/casdoor
git clone https://github.com/casdoor/casdoor-nodejs-react-example
```
#### Run Example
1. Run Casdoor
2. Configure
- Backend
- Frontend
#### Backend Config
Initialization requires 6 (or 5) parameters, which are all string type. Please refer to the official doc on [backend sdk configuration](https://casdoor.org/docs/how-to-connect/sdk#1-backend-sdk-configuration) for the latest change.
| Parameter | Must | Description |
|------------------|------|--------------------------------------------------------------------------------|
| endpoint | Yes | Casdoor Server URL, like `https://door.casdoor.com` or `http://localhost:8000` |
| clientId | Yes | Client ID for the Casdoor application |
| clientSecret | Yes | Client secret for the Casdoor application |
| jwtPublicKey | Yes | The public key for the Casdoor application's cert |
| organizationName | Yes | The name for the Casdoor organization |
| applicationName | No | The name for the Casdoor application |
```js
// in ./backend/server.js
const authCfg = {
endpoint: 'https://door.casdoor.com',
clientId: '014ae4bd048734ca2dea',
clientSecret: 'f26a4115725867b7bb7b668c81e1f8f7fae1544d',
certificate: cert,
orgName: 'casbin',
appName: 'app-casnode',
}
```
#### Frontend Config
The first 4 parameters should use the same value as the Casdoor backend SDK. The last parameter redirectPath is relative path for the redirected URL, returned from Casdoor's login page. Please refer to the official doc on [frontend sdk configuration](https://casdoor.org/docs/how-to-connect/sdk#2-frontend-configuration) for the latest change.
```js
// in ./src/Setting.js
const config = {
serverUrl: "https://door.casdoor.com",
clientId: "014ae4bd048734ca2dea",
organizationName: "casbin",
appName: "app-casnode",
redirectPath: "/callback",
};
```
After setting configurations up, install all dependencies by running `yarn install`. While Casdoor is operating, run the following scripts.
### Available Scripts
In the project directory, you can run:
```shell
yarn install
```
Installs all necessary dependencies.
```shell
node backend/server.js
```
Runs the backend powered by Express at [http://localhost:8080](http://localhost:8080).
```shell
yarn start
```
Runs the app in the development mode.
Note that the port running frontend is set in `package.json`:
`"start": "PORT=9000 react-scripts start"`
Open [http://localhost:9000](http://localhost:9000) to view it in your browser.