社群 學習 工具庫 休閒
搜尋
繁体中文
首頁 > web前端 > js教程 > 透過使用node.js+ca​​ptchapng+jsonwebtoken完成登入驗證

透過使用node.js+ca​​ptchapng+jsonwebtoken完成登入驗證

巴扎黑
發布： 2017-08-18 10:34:30
原創
2272 人瀏覽過

本篇文章主要介紹了node.js+ca​​ptchapng+jsonwebtoken實現登入驗證範例，具有一定的參考價值，有興趣的可以了解一下

提到登入驗證，大家一定能想到的就是12306的驗證碼了吧。 12306為了防止刷票，可以說是煞費苦心，驗證碼也越來越難識別，最終即使是人也可能識別不了了。

今天，小編就跟大家說一下node如何實作圖片驗證碼，以及使用token驗證登入。學習本文你將學到：

1.使用captchapng產生圖片驗證碼

2.使用jsonwebtoken實現登入驗證

一、圖片驗證碼產生（最後有全部程式碼）。一下流程，第一步伺服器要隨機產生一組四位數。

第二步，將這四位數以canvas繪圖產生圖片。

第三步，我們要將這四位數存起來，以便使用者回傳資料時做比較。

那麼存到哪裡呢？很明顯為了區分用戶，存到session最穩。

第一步，先要有一個登入頁面。這裡我們還是用react,

login.tsx

import * as React from 'react'
import * as ReactDom from 'react-dom'
import {Link, browserHistory} from 'react-router';
import * as axios from 'axios';
export default class Login extends React.Component<any,any>{
  constructor(props){
    super(props)
    this.state = {
      userName : &#39;&#39;,
      password : &#39;&#39;,
      yzNoId  : &#39;&#39;,
      hash : Math.random()
    }
  }
  handleUserName(e) : any {
    this.setState({
      userName : e.target.value
    })
  }
  handlePassword(e) : any {
    this.setState({
      password : e.target.value
    })
  }
  handleYzId(e) : any {
    this.setState({
      yzNoId : e.target.value
    })
  }
  render(){
    const { userName, password, yzNoId } = this.state;
    return(
      <p>
        <p className="nav-wrap">
          <ul className="nav">
            <li><Link to="/home">首页</Link></li>
            <li><Link to="/imgLoad">上传</Link></li>
            <li><Link to="/login">登陆</Link></li>
          </ul>
        </p>
        <p className="content">
          <p className="login-warp">
            <p>
              <input type="text" className="username" value={userName} onChange={this.handleUserName.bind(this)} placeholder="用户名"/>
            </p>
            <p>
              <input type="text" className="password" value={password} onChange={this.handlePassword.bind(this)} placeholder="密码"/>  
            </p>  
            <p>
              <input type="text" className="yz" value={yzNoId} onChange={this.handleYzId.bind(this)} placeholder="验证码"/>
              <img src={"http://localhost:3000/captcha"} className="yz-img" />  
            </p>
            <p>
              <input type="button" className="submit" value="登陆" onClick={this.sbumit.bind(this,{userName:userName,password:password,captcha:yzNoId})} /> 
            </p>  
          </p>
        </p>
      </p>
    )
  }
}
登入後複製

頁面是這樣的

我們需要透過伺服器給一張驗證圖片。

router/index.js 加入以下程式碼

var Login = require(&#39;./controller/login&#39;);
var login = new Login;
router.get(&#39;/captcha&#39;, login.captcha);
router.post(&#39;/login&#39;,login.loginer);
login是定义在控制器的一个类的实例，captcha，loginer是它的方法。分别是返回验证图片、登录验证。
controller/login.js

var rf = require(&#39;fs&#39;);
var captchapng = require(&#39;captchapng&#39;);
class Login {
  constructor(){}
  captcha(req, res, next) {
    var str = parseInt(Math.random()*9000+1000);  //随机生成数字
    req.session.captcha = str;  // 存入session
    var p = new captchapng(80, 30, str); //生成图片
    p.color(0, 0, 0, 0);
    p.color(80, 80, 80, 255);
    var img = p.getBase64();
    var imgbase64 = new Buffer(img, &#39;base64&#39;);
    res.writeHead(200, {
      &#39;Content-Type&#39;: &#39;image/png&#39;
    });
    res.end(imgbase64);
  }
  loginer(req, res, next) {
    let captcha = req.body.captcha;
    let userName = req.body.userName;
    let password = req.body.password;
    if (captcha != req.session.captcha) {
      res.status(400).send({
        message: &#39;验证码错误&#39;
      });
    }else if(userName == "chenxuehui" && password == "123321"){
      res.json({"code":100,"verson":true,"msg":"登陆成功","token":token});
    }else{
      res.json({"code":0,"verson":false,"msg":"密码错误"});
    }
  }
}
module.exports = Login
登入後複製

captcha方法是產生一張含四位數字的圖片，然後將圖片儲存到session中。

將此方法在 router/index.js 中引用

router.get(&#39;/captcha&#39;, login.captcha);
登入後複製

也就是說我們訪問localhost:3000/captcha就會回傳一張圖片。

有了這個連接後我們就可以透過圖片的src屬性拿到該圖片，但是當點擊圖片的時候要重新刷新，所以我們需要給圖片添加一個點擊刷新事件。將下面程式碼插入login.tsx中

setHash() {
    this.setState({
      hash : Math.random()
    })
}
登入後複製

img標籤也變成了


複製代碼

代碼如下:

透過使用node.js+ca​​ptchapng+jsonwebtoken完成登入驗證  


 


這樣只要點選img，就會隨機產生一個hash，然後就會呼叫新的圖片出來。

接著我們進行登入驗證。


loginer方法就是進行登入驗證的。


拿到使用者的使用者名稱訊息，密碼以及驗證碼一次對比，最後返回登入是否成功資料。


當使用者登陸成功以後，下次登入就不需要再登入了，以往的方法可以選則session或cookie的方式，在這裡我們使用token。因為現在已經實現了前後端分離開發，我們更傾向於建立單頁面配合ajax建置應用程式。而token最適合這種開發模式不過了。


token登入驗證


token是一串經過加密的字串，登入成功以後返回給用戶保存，然後用戶在請求接口時，都帶這個token。所以我們需要對token進行加密。

Json Web Token就是專門解決這個問題的，原理就不做詳解了，其實就是按照一定的方式得到一個字符串，然後在通過某種方式解開。

我們要做的第一步就是


當使用者登入成功後，建立一個token回傳給使用者。


第二步：用戶拿到token後應該把token存到本地。


第三步：需要寫一個中間層，每次使用者要求時我們驗證使用者攜帶的token是否正確。正確返回數據，不正確返回警告。

用戶每次要求資料的時候要在header裡把token帶上。

第一步：還是controller/login.js


import * as React from &#39;react&#39;
import * as ReactDom from &#39;react-dom&#39;
import {Link, browserHistory} from &#39;react-router&#39;;
import * as axios from &#39;axios&#39;;
export default class Login extends React.Component<any,any>{
  constructor(props){
    super(props)
    this.state = {
      userName : &#39;&#39;,
      password : &#39;&#39;,
      yzNoId  : &#39;&#39;,
      hash : Math.random()
    }
  }
  public async sbumit(params : any) : Promise<any>{
    let res = await axios.post(&#39;http://localhost:3000/login&#39;,params);
  }
  handleUserName(e) : any {
    this.setState({
      userName : e.target.value
    })
  }
  handlePassword(e) : any {
    this.setState({
      password : e.target.value
    })
  }
  handleYzId(e) : any {
    this.setState({
      yzNoId : e.target.value
    })
  }
  setHash() {
    this.setState({
      hash : Math.random()
    })
  }
  render(){
    const { userName, password, yzNoId } = this.state;
    return(
      <p>
        <p className="nav-wrap">
          <ul className="nav">
            <li><Link to="/home">首页</Link></li>
            <li><Link to="/imgLoad">上传</Link></li>
            <li><Link to="/login">登陆</Link></li>
          </ul>
        </p>
        <p className="content">
          <p className="login-warp">
            <p>
              <input type="text" className="username" value={userName} onChange={this.handleUserName.bind(this)} placeholder="用户名"/>
            </p>
            <p>
              <input type="text" className="password" value={password} onChange={this.handlePassword.bind(this)} placeholder="密码"/>  
            </p>  
            <p>
              <input type="text" className="yz" value={yzNoId} onChange={this.handleYzId.bind(this)} placeholder="验证码"/>
              <img src={"http://localhost:3000/captcha?aaa="+this.state.hash} className="yz-img" onClick={this.setHash.bind(this)} />  
            </p>
            <p>
              <input type="button" className="submit" value="登陆" onClick={this.sbumit.bind(this,{userName:userName,password:password,captcha:yzNoId})} /> 
            </p>  
          </p>
        </p>
      </p>
    )
  }
}
登入後複製

這次在loginer方法裡面我們加入設定token，並回傳給使用者。 setToken方法是設定token的方法。

第二步：用戶拿到後儲存。


在login.tsx就變成如下


var rf = require(&#39;fs&#39;);
var jwt = require(&#39;jsonwebtoken&#39;);
var captchapng = require(&#39;captchapng&#39;);
var Tokens = require(&#39;../middleware/token&#39;)
var t = new Tokens;
class Login {
  constructor(){}
  captcha(req, res, next) {
    var str = parseInt(Math.random()*9000+1000);  //随机生成数字
    req.session.captcha = str;  // 存入session
    var p = new captchapng(80, 30, str); //生成图片
    p.color(0, 0, 0, 0);
    p.color(80, 80, 80, 255);
    var img = p.getBase64();
    var imgbase64 = new Buffer(img, &#39;base64&#39;);
    res.writeHead(200, {
      &#39;Content-Type&#39;: &#39;image/png&#39;
    });
    res.end(imgbase64);
  }
  loginer(req, res, next) {
    let captcha = req.body.captcha;
    let userName = req.body.userName;
    let password = req.body.password;
    if (captcha != req.session.captcha) {
      res.status(400).send({
        message: &#39;验证码错误&#39;
      });
    }else if(userName == "chenxuehui" && password == "123321"){
      // 设置token
      var datas = {userName:"chenxuehui"}
        //调用../middleware/token 下方法设置
      var token = t.setToken(&#39;cxh&#39;,300,datas)
      res.json({"code":100,"verson":true,"msg":"登陆成功","token":token});
    }else{
      res.json({"code":0,"verson":false,"msg":"密码错误"});
    }
  }
}

module.exports = Login
登入後複製

在sbumit方法裡我們將token放到了sessonstorage裡面。

第三步：設定中間件每次請求介面時，驗證token,如果解析成功加入到請求頭裡面。


./middleware/token.js


import * as React from &#39;react&#39;
import * as ReactDom from &#39;react-dom&#39;
import {Link, browserHistory} from &#39;react-router&#39;;
import * as axios from &#39;axios&#39;;
export default class Login extends React.Component<any,any>{
  constructor(props){
    super(props)
    this.state = {
      userName : &#39;&#39;,
      password : &#39;&#39;,
      yzNoId  : &#39;&#39;,
      hash : Math.random()
    }
  }
  public async sbumit(params : any) : Promise<any>{
    let res = await axios.post(&#39;http://localhost:3000/login&#39;,params);
    if(res.data.verson){
      sessionStorage.setItem(&#39;token&#39;,res.data.token);
      browserHistory.push("/home")
    }
  }
  handleUserName(e) : any {
    this.setState({
      userName : e.target.value
    })
  }
  handlePassword(e) : any {
    this.setState({
      password : e.target.value
    })
  }
  handleYzId(e) : any {
    this.setState({
      yzNoId : e.target.value
    })
  }
  setHash() {
    this.setState({
      hash : Math.random()
    })
  }
  render(){
    const { userName, password, yzNoId } = this.state;
    return(
      <p>
        <p className="nav-wrap">
          <ul className="nav">
            <li><Link to="/home">首页</Link></li>
            <li><Link to="/imgLoad">上传</Link></li>
            <li><Link to="/login">登陆</Link></li>
          </ul>
        </p>
        <p className="content">
          <p className="login-warp">
            <p>
              <input type="text" className="username" value={userName} onChange={this.handleUserName.bind(this)} placeholder="用户名"/>
            </p>
            <p>
              <input type="text" className="password" value={password} onChange={this.handlePassword.bind(this)} placeholder="密码"/>  
            </p>  
            <p>
              <input type="text" className="yz" value={yzNoId} onChange={this.handleYzId.bind(this)} placeholder="验证码"/>
              <img src={"http://localhost:3000/captcha?aaa="+this.state.hash} className="yz-img" onClick={this.setHash.bind(this)} />  
            </p>
            <p>
              <input type="button" className="submit" value="登陆" onClick={this.sbumit.bind(this,{userName:userName,password:password,captcha:yzNoId})} /> 
            </p>  
          </p>
        </p>
      </p>
    )
  }
}
登入後複製
登入後複製

testToken方法是驗證token，setToken是設定token方法

假如沒有登入要求是這樣的

在 router/index.js


var express = require('express');
var router = express.Router();
var rf = require('fs');
var Login = require('./controller/login');
var Tokens = require('./middleware/token')
var t = new Tokens;
var login = new Login;
//主页
router.get('/', function(req, res, next) {
  res.render("wap/index")
});
//获取图片验证码
router.get(&#39;/captcha&#39;, login.captcha);
//登录验证
router.post('/login',login.loginer);
//请求数据时 t.testToken 验证token
router.post('/list',t.testToken,function(req, res, next){
  res.json({
    //在请求信息里面拿到数据
    username : req.userInfo.userName,
    success : true,
    result : [
      {
        name:'1111111'
      },
      {
        name :'22222'
      }
    ]
  })
})
module.exports = router;
登入後複製

我们在另一个页面调用list接口试一下


import * as axios from &#39;axios&#39;;
import { transToken } from &#39;../decorator/index&#39;


class Home extends React.Component<any,any>{
  constructor(props){
    super(props)
    this.state = {
      data : &#39;&#39;
    }
  }
  async getList(): Promise<any>{
    let token = sessionStorage.getItem(&#39;token&#39;);
    const config = {
     // 请求头信息
     headers: {&#39;x-access-token&#39;: token}      
    }
    let res = await axios.post(&#39;http://localhost:3000/list&#39;,{},config);
    if(!res.data.success){
      browserHistory.push(&#39;/login&#39;);
      return;
    }
    this.setState({
      data : res.data
    })
  }
  render(){
    const { data } = this.state;
    return(
      <p>
        <p className="nav-wrap">
          <ul className="nav">
            <li><Link to="/home">首页</Link></li>
            <li><Link to="/imgLoad">上传</Link></li>
            <li><Link to="/login">登陆</Link></li>
          </ul>
        </p>
        <p className="content">
          Home
          <span onClick={this.getList.bind(this)}>获取数据</span>
          <p>{
            data ? data.result.map( (val,k) => {
              return <li key = {k}>{val.name}</li>
            }) : null
          }</p>
        </p>
      </p>
      
    )
  }
}
export default Home
登入後複製

当调用getList时，如果此时没有登录res.data.success就会为false，则跳到登录页。

全部代码

node.js

app.js


var express = require(&#39;express&#39;);
var path = require(&#39;path&#39;);
var favicon = require(&#39;serve-favicon&#39;);
var logger = require(&#39;morgan&#39;);
var cookieParser = require(&#39;cookie-parser&#39;);
var bodyParser = require(&#39;body-parser&#39;);
var session = require("express-session");
var ejs = require(&#39;ejs&#39;);

var index = require(&#39;./routes/index&#39;);


var app = express();

// view engine setup
app.set(&#39;views&#39;, path.join(__dirname, &#39;views&#39;));
// app.set(&#39;view engine&#39;, &#39;jade&#39;);
app.engine(&#39;html&#39;, ejs.__express);
app.set(&#39;view engine&#39;, &#39;html&#39;);
app.use(session({
  secret:"dabao",
  resave:false,
  saveUninitialized:true,
  cookie:{}
}));
// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, &#39;public&#39;, &#39;favicon.ico&#39;)));
app.use(logger(&#39;dev&#39;));
app.use(bodyParser.json());
app.use(bodyParser({limit: 5000000}));
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, &#39;&#39;)));

app.use(&#39;/&#39;, index);


// catch 404 and forward to error handler
app.use(function(req, res, next) {
 var err = new Error(&#39;Not Found&#39;);
 err.status = 404;
 next(err);
});

// error handler
app.use(function(err, req, res, next) {
 // set locals, only providing error in development
 res.locals.message = err.message;
 res.locals.error = req.app.get(&#39;env&#39;) === &#39;development&#39; ? err : {};

 // render the error page
 res.status(err.status || 500);
 res.render(&#39;error&#39;);
});

module.exports = app;
登入後複製

index.js


var express = require('express');
var router = express.Router();
var rf = require('fs');
var Login = require('./controller/login');
var Tokens = require('./middleware/token')
var t = new Tokens;
var login = new Login;
/* GET home page. */
router.get('/', function(req, res, next) {
  res.render("wap/index")
});
router.post('/upLoadImg',function(req,res,next){
  let imgData = req.body.imgData;
  console.log(imgData)
  let base64Data = imgData.replace(/^data:image\/\w+;base64,/, "");
  let dataBuffer = new Buffer(base64Data, 'base64');
  let timer = Number( new Date() );
  console.log(timer)
  rf.writeFile("views/images/artCover"+timer+".png",dataBuffer, function(err) {
    if(err) {
     res.json({"code":400,"verson":false,"msg":err});
    }else {
     res.json({"code":100,"verson":true,"url":"views/src/common/images/artCover/"+timer+".png"});
    }
  });
})
router.get(&#39;/captcha&#39;, login.captcha);
router.post('/login',login.loginer);
router.post('/list',t.testToken,function(req, res, next){
  // 先解析token 
  console.log(req.userInfo)
  res.json({
    username : req.userInfo.userName,
    success : true,
    result : [
      {
        name:'1111111'
      },
      {
        name :'22222'
      }
    ]
  })
})
module.exports = router;
登入後複製

controller/login.js


var rf = require(&#39;fs&#39;);
var jwt = require(&#39;jsonwebtoken&#39;);
var captchapng = require(&#39;captchapng&#39;);
var Tokens = require(&#39;../middleware/token&#39;)
var t = new Tokens;
class Login {
  constructor(){}
  captcha(req, res, next) {
    var str = parseInt(Math.random()*9000+1000);  //随机生成数字
    req.session.captcha = str;  // 存入session
    var p = new captchapng(80, 30, str); //生成图片
    p.color(0, 0, 0, 0);
    p.color(80, 80, 80, 255);
    var img = p.getBase64();
    var imgbase64 = new Buffer(img, &#39;base64&#39;);
    res.writeHead(200, {
      &#39;Content-Type&#39;: &#39;image/png&#39;
    });
    res.end(imgbase64);
  }
  loginer(req, res, next) {
    let captcha = req.body.captcha;
    let userName = req.body.userName;
    let password = req.body.password;
    if (captcha != req.session.captcha) {
      res.status(400).send({
        message: &#39;验证码错误&#39;
      });
    }else if(userName == "chenxuehui" && password == "123321"){
      // 设置token
      var datas = {userName:"chenxuehui"}
      var token = t.setToken(&#39;cxh&#39;,300,datas)
      res.json({"code":100,"verson":true,"msg":"登陆成功","token":token});
    }else{
      res.json({"code":0,"verson":false,"msg":"密码错误"});
    }
  }
}
module.exports = Login
登入後複製

middleware/token.js


var jwt = require(&#39;jsonwebtoken&#39;);

class Tokens {
  constructor(){}
  testToken(req,res,next) {
    var token = req.body.token || req.query.token || req.headers[&#39;x-access-token&#39;];

    if(token) {
      jwt.verify(token, &#39;cxh&#39; , function(err,decoded) {
        if(err) {
          return res.json({success:false,msg:&#39;token错误&#39;})
        }else {
          req.userInfo = decoded;
          next()
        }
      })
    }else {
      return res.status(403).send({success:false,msg:"没有token"})
    }
  }
  setToken(name,time,data) {
    var jwtSecret = name;
    var token = jwt.sign(data, jwtSecret, {
      expiresIn: time
    })
    return token;
  }
}
module.exports = Tokens
登入後複製

react部分

login.tsx


import * as React from &#39;react&#39;
import * as ReactDom from &#39;react-dom&#39;
import {Link, browserHistory} from &#39;react-router&#39;;
import * as axios from &#39;axios&#39;;
export default class Login extends React.Component<any,any>{
  constructor(props){
    super(props)
    this.state = {
      userName : &#39;&#39;,
      password : &#39;&#39;,
      yzNoId  : &#39;&#39;,
      hash : Math.random()
    }
  }
  public async sbumit(params : any) : Promise<any>{
    let res = await axios.post(&#39;http://localhost:3000/login&#39;,params);
    if(res.data.verson){
      sessionStorage.setItem(&#39;token&#39;,res.data.token);
      browserHistory.push("/home")
    }
  }
  handleUserName(e) : any {
    this.setState({
      userName : e.target.value
    })
  }
  handlePassword(e) : any {
    this.setState({
      password : e.target.value
    })
  }
  handleYzId(e) : any {
    this.setState({
      yzNoId : e.target.value
    })
  }
  setHash() {
    this.setState({
      hash : Math.random()
    })
  }
  render(){
    const { userName, password, yzNoId } = this.state;
    return(
      <p>
        <p className="nav-wrap">
          <ul className="nav">
            <li><Link to="/home">首页</Link></li>
            <li><Link to="/imgLoad">上传</Link></li>
            <li><Link to="/login">登陆</Link></li>
          </ul>
        </p>
        <p className="content">
          <p className="login-warp">
            <p>
              <input type="text" className="username" value={userName} onChange={this.handleUserName.bind(this)} placeholder="用户名"/>
            </p>
            <p>
              <input type="text" className="password" value={password} onChange={this.handlePassword.bind(this)} placeholder="密码"/>  
            </p>  
            <p>
              <input type="text" className="yz" value={yzNoId} onChange={this.handleYzId.bind(this)} placeholder="验证码"/>
              <img src={"http://localhost:3000/captcha?aaa="+this.state.hash} className="yz-img" onClick={this.setHash.bind(this)} />  
            </p>
            <p>
              <input type="button" className="submit" value="登陆" onClick={this.sbumit.bind(this,{userName:userName,password:password,captcha:yzNoId})} /> 
            </p>  
          </p>
        </p>
      </p>
    )
  }
}
登入後複製
登入後複製

home.js 获取列表信息


import * as React from &#39;react&#39;
import * as ReactDom from &#39;react-dom&#39;
import {Link, browserHistory} from &#39;react-router&#39;;
import * as axios from &#39;axios&#39;;
class Home extends React.Component<any,any>{
  constructor(props){
    super(props)
    this.state = {
      data : &#39;&#39;
    }
  }
  async getList(): Promise<any>{
    let token = sessionStorage.getItem(&#39;token&#39;);
    const config = {
     // 请求头信息
     headers: {&#39;x-access-token&#39;: token}      
    }
    let res = await axios.post(&#39;http://localhost:3000/list&#39;,{},config);
    if(!res.data.success){
      browserHistory.push(&#39;/login&#39;);
      return;
    }
    this.setState({
      data : res.data
    })
  }
  render(){
    const { data } = this.state;
    return(
      <p>
        <p className="nav-wrap">
          <ul className="nav">
            <li><Link to="/home">首页</Link></li>
            <li><Link to="/imgLoad">上传</Link></li>
            <li><Link to="/login">登陆</Link></li>
          </ul>
        </p>
        <p className="content">
          Home
          <span onClick={this.getList.bind(this)}>获取数据</span>
          <p>{
            data ? data.result.map( (val,k) => {
              return <li key = {k}>{val.name}</li>
            }) : null
          }</p>
        </p>
      </p>
      
    )
  }
}
export default Home
登入後複製

以上是透過使用node.js+ca​​ptchapng+jsonwebtoken完成登入驗證的詳細內容。更多資訊請關注PHP中文網其他相關文章！

相關標籤：
javascript web
來源：php.cn
上一篇：js製作一個簡單的對話框教學 下一篇：javascript實現日期差計算
本網站聲明
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn
作者最新文章
最新問題
function_exists()無法判定自訂函數 function test()    {        return true;    }    if (function_exists('TEST')) {        ech...
來自於 2024-04-29 11:01:01
0
3
2207
google 瀏覽器 手機版顯示的怎麼實現 老師您好，google 瀏覽器怎麼變成手機版樣式的？
來自於 2024-04-23 00:22:19
0
11
2360
子窗口操作父窗口，輸出沒反應 前兩句可執行，最後一句沒辦法應
來自於 2024-04-19 15:37:47
0
1
1974
父視窗沒有輸出 document.onclick = function(){ window.opener.document.write('我是子視窗的輸出');                  ...
來自於 2024-04-18 23:52:34
0
1
1859
關於CSS心智圖的課件在哪？ 課件
來自於 2024-04-16 10:10:18
0
0
1924
相關專題
更多>
熱門推薦
熱門教學
更多>
相關教學
熱門推薦
最新課程
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板