nodejs 프레임 워 크 koa 상용 설정
글 목록
nodejs 기초 (초보 튜 토리 얼 참고 nodejs 튜 토리 얼)
문서 주소:http://www.expressjs.com.cn/
nodejs 프레임 워 크 - koa
중국어 문서 주소:https://koa.bootcss.com/ node 모듈 창고 주소:https://www.npmjs.com/
koa 의 hello world
const Koa = require('koa');
const app = new Koa();
app.use(async ctx => {
ctx.body = 'Hello World';
});
app.listen(3000);
3. node app.js
4. http://localhost:3000
서버 자동 재배 치
코드 를 한 번 도 수정 하지 않 았 습 니 다. 모두 다시 시작 해 야 효력 이 발생 합 니 다. 이것 은 분명히 불편 합 니 다. 파일 서 비 스 를 수정 하면 자동 으로 다시 시작 할 수 있 습 니 다. nodemon 이 이러한 기능 을 실현 할 수 있 기 를 바 랍 니 다.
koa 경로 (1) koa - simple - router
https://www.npmjs.com/package/koa-simple-router koa - simple - router 모듈 을 설치 하고 위의 app. js 코드 를 수정 하여 아래 와 같이 됩 니 다.
const Koa = require('koa')
const router = require('koa-simple-router')
const app = new Koa()
app.use(router(_ => {
_.get('/', (ctx, next) => {
ctx.body = 'hello world';
})
_.post('/path', (ctx, next) => {
})
// get post
_.all('/login', (ctx, next) => {
ctx.body = {
code: 666,
msg: ' '
}
})
_.all('/regester', (ctx, next) => {
ctx.body = {
code: 666,
msg: ' '
}
})
}))
app.listen(3000,()=>{
console.log(' ， http://localhost:3000/');
});
서비스 시작, 브 라 우 저 로 접근http://localhost:3000/login 화해시키다http://localhost:3000/register
코드 의 구조 성 을 더욱 좋게 하기 위해 서, 우 리 는 이 부분 을 단독으로 파일 에 넣 을 수 있다
kao 경로 (2) koa - router (저 는 지금 이 걸 사용 하고 있 습 니 다)
npm init -y
npm i koa koa-router --save-dev
const Koa = require('koa')
const Router = require('koa-router')
const app = new Koa()
const router = new Router();
router.get('/', ctx => {
ctx.body = 'hello world'
})
router.get('/demo1', ctx => {
ctx.body = 'demo1'
})
router.post('/demo1', ctx => {
ctx.body = 'demo1'
})
router.all('/demo2', ctx => {
ctx.body = 'demo2'
})
app.use(router.routes());
app.listen(3000, () => {
console.log(' ， http://localhost:3000/');
});
const Router = require('koa-router')
const router = new Router();
router.all('/', ctx => {
ctx.body = 'hello world'
})
router.all('/add', ctx => {
ctx.body = 'add'
})
router.all('/getList', ctx => {
ctx.body = 'demo1'
})
router.all('/del', ctx => {
ctx.body = 'del'
})
router.all('/edit', ctx => {
ctx.body = 'edit'
})
module.exports = router;
const Koa = require('koa')
const app = new Koa()
const router = require('./router');
app.use(router.routes());
app.listen(3000, () => {
console.log(' ， http://localhost:3000/');
});
const Router = require('koa-router');
const router = new Router({
//
prefix: '/city'
})
router.get('/add',(ctx,next)=> {
ctx.body = ' ';
})
router.get('/del',ctx=> {
ctx.body = ' ';
})
router.get('/edit',ctx=> {
ctx.body = ' ';
})
router.get('/list',ctx=> {
ctx.body = ' ';
})
module.exports = router;
하나의 요청 은 전송 에서 데 이 터 를 되 돌려 주 는 것 입 니 다. 만약 우리 가 이 과정 에서 통 일 된 조작 을 하려 면 미들웨어 로 완성 할 수 있 습 니 다.
app.use((ctx, next) => {
// ctx username, ctx username
ctx.username = ' ';
// , next() ,
next(); // vue next
})
방금 demo. html 에 axios 를 추가 하여 요청 을 보 냅 니 다. 코드 는 다음 과 같 습 니 다.
Document
koa
let url = 'http://localhost:3000/add';
let data = {
params: {
username: 'laohu',
phone: 13800000000
}
}
axios.get(url, data).then(res => {
console.log(res);
})
router.all('/add', ctx => {
// get
const username = ctx.query.username;
const phone = ctx.query.phone;
// ctx.body
ctx.body = {
module: 'add',
username,
phone
}
})
npm i koa-body --save
const koaBody = require('koa-body');
app.use(koaBody());
post 요청 매개 변 수 를 가 져 오 는 코드 는 다음 과 같 습 니 다.
ctx.request.body.xxx
// get post params
app.use((ctx, next) => {
ctx.params = {
...ctx.query,
...ctx.request.body
}
next();
});
정적 디 렉 터 리 설정
npm i koa-static --save-dev
const koaStatic = require('koa-static');
app.use(koaStatic(__dirname + '/public'));
재 방문http://localhost:3000/demo.html ps: 경 로 는 Public 를 추가 하지 않 아 도 됩 니 다.
템 플 릿 사용
일반적으로 인터페이스 에 데 이 터 를 되 돌려 달라 고 요청 합 니 다. 그러나 가끔 은 html 페이지 나 html 코드 (지난주 에 공 유 된 서버 렌 더 링) 를 되 돌려 주 고 싶 습 니 다. koa - swig 모듈 로 전단 에 html 를 되 돌려 보 겠 습 니 다.
npm i koa-view --save-dev
루트 디 렉 터 리 에 views 디 렉 터 리 를 만 들 고 views 디 렉 터 리 에 tpl. html 를 만 듭 니 다. 코드 는 다음 과 같 습 니 다.
Document
{ %>
- =>
- 在app.js添加如下代码：
const views = require("koa-views");
app.use(views(path.join(__dirname, "views"), {
map: {
html: 'underscore'
}
}));
//
router.all('/', async ctx => {
const list = [{
username: ' ',
age: 22
},
{
username: ' ',
age: 100
},
{
username: ' ',
age: 500
}
]
await ctx.render('tpl', {
title: 'kao- ',
list
});
})
ps: 인 터 페 이 스 를 방문 하려 면 페이지 를 토 해 야 합 니 다. js 에서 직접 따옴표 ` 맞 춤 형 템 플 릿 을 사용 할 수 있 습 니 다. 물론 vue 를 사용 하여 렌 더 링 할 수도 있 습 니 다.
vue 서버 렌 더 링
npm install vue vue-server-renderer --save
// 1 ： Vue
const Vue = require('vue')
const app = new Vue({
template: `Hello World`
})
// 2 ： renderer
const renderer = require('vue-server-renderer').createRenderer();
// 3 ： Vue HTML
renderer.renderToString(app, (err, html) => {
if (err) throw err
console.log(html)
// => Hello World
})
중간 부품 을 직접 작성 하면 됩 니 다. 코드 는 다음 과 같 습 니 다.
app.use((ctx, next) => {
ctx.set("Access-Control-Allow-Origin", "*");
ctx.set("Access-Control-Allow-Methods", "PUT, POST, GET, DELETE, OPTIONS");
//
ctx.set(
"Access-Control-Allow-Headers",
`Content-Type, Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild,x-token,sessionToken,token`
);
if (ctx.method == "OPTIONS") {
ctx.body = 200;
} else {
next();
}
})
방금 데모. html 파일 에 접근 하면,http://localhost:3000/demo.html요청 한 응답 헤더 에 Access - Control - Allow - Origin: * 가 추가 되 어 있 습 니 다. 서버 크로스 도 메 인 설정 이 성공 했다 는 것 을 설명 합 니 다.
demo 주소 (계속 되 지 않 음)
egg + mongodb 설정 koa + mogodb 간단 한 추가 삭제 검사 항목 만 들 기 (업데이트 대기)
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Dubbo (2): zookeeper 등록 센터Zookeeper 는 Apacahe Hadoop 의 하위 프로젝트 로 트 리 형태의 디 렉 터 리 서비스 로 푸 시 변경 을 지원 하 며 Dubbo 서비스의 등록 센터 로 적합 하 며 산업 강도 가 높 아 생산 환경...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
